searchParams, params 를 사용하는 부분이 15에서 변경되었습니다.
해결됨
한 입 크기로 잘라먹는 Next.js
https://nextjs.org/docs/messages/sync-dynamic-apis 에 내용이 변경되었다고 하네요. 혹 어떻게 수정하면 좋을지에 대한 공지가 따로 있을까요?
- react
- typescript
- next.js
173만명의 커뮤니티!! 함께 토론해봐요.
해결됨
한 입 크기로 잘라먹는 Next.js
https://nextjs.org/docs/messages/sync-dynamic-apis 에 내용이 변경되었다고 하네요. 혹 어떻게 수정하면 좋을지에 대한 공지가 따로 있을까요?
미해결
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오)y 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)y 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)y [질문 내용] 여기에 질문 내용을 남겨주세요. H2를 삭제 후 재설치도 해봤지만 여전히 테이블이 생기지않습니다...
미해결
실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화
JPQL 로 한번에 가져오는 방식으로 변경해가면서 실제 db 로 날아가는 쿼리 횟수는 적어지지만 jpql 에 점점 더 많이 의존하게 되는것 같아요. 전 jpa 가 sql 쿼리 사용의 의존을 줄이고 애플리케이션 단에서 객체지향 적으로 코드를 짤 수 있다는 이유 때문에 사용하는 것으로 알고있는데요.. 물론 orm 만으로 모든 비즈니스 로직을 해결하기엔 힘든 경우도 있다는 것은 잘 이해하고 있지만, JPQL 을 많이 사용할 수록 mybatis 를 사용하는 것과 다를게 없다는 느낌이 드는데.. 현업에서는 n + 1 문제나 쿼리 횟수 최적화를 위해서 jpql 로 많이 작성하는지 궁금해요
미해결
김영한의 실전 자바 - 중급 2편
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. 컬렉션 프레임 워크 - LinkedList MyLinkedListV1 에서 이해 못하는 소스가 있어서 질문 드려요. 아래 코드에서 x.item을 oldValue에 대입하고 반환하는지 궁금합니다. 그냥 x.item = element만 사용해도 되는거 아닌지? public Object set(int index, Object element) { Node x = getNode(index); Object oldValue = x.item; x.item = element; return oldValue; }
미해결
김영한의 실전 자바 - 고급 2편, I/O, 네트워크, 리플렉션
try catch finally에서 finally에서 발생한 예외로 try에서 발생한 핵심예외가 없어지고 finally에서 발생한 부가예외로 변경되어서 예외가 리턴되는데요, try with resources 와 같이 핵심예외를 반환하면서 부가예외를 반환하는 방법은 따로 없는건가요?
미해결
코드로 배우는 React 19 with 스프링부트 API서버
refresh token filter를 validation하고 재발급해주는 걸 컨트롤러로 구현하셨는데 필터로 구현한다면 UsernamePasswordAuthenticationFilter 앞으로 지정한 JWTCheckFilter 에다가 구현하면될까요>?
미해결
CloudNet@ - Amazon EKS 기본 강의
원클릭 배포를 통해서 eks 생성 하였습니다. 마스터 노드와 워커노드 둘다 퍼블릭 서브넷에 배치되어있으며 워커노드마다 퍼블릭 IP 를 할당받은걸로 확인됩니다. 혹시 외부와 통신시에 고정 ip 1개로 통신하고 싶다면 워커노드를 프라이빗 서브넷에 배치후 NAT GateWay 를 통한 방법만 있을까요 ??
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요~ 포트폴리오 과제하다가 질문 생겨 남겨요 첫번째는 댓글 내용 수정할 때 댓글 내용을 지우다가 다 지워지면 수정 전 원래 댓글 내용으로 도로 바뀌는 문젠데요 댓글부분 리팩토링 끝마치고나서 발견해서 처음엔 뭘 잘못했나? 했는데 계속 보니 그냥 value에서 defaultValue를 대체하여 작성해주던 아래 부분 때문인 것 같더라고요 value={ props.inputs.contents !== "" ? props.inputs.contents : props.el?.contents ?? "" } 수정을 시작할 땐 props.inputs.contents === ""이니까 댓글 내용인 props.el?.contents를 불러와서 띄워주고, 지우는 중엔 state가 빈 문자열이 아니니까 props.inputs.contents대로 표시되다가 댓글 내용을 전부 지우면 props.inputs.contents가 다시 빈 문자열이 되어서 바로 기존 댓글 내용을 띄워버려요 아예 댓글 내용을 지우고 싶어도 지울수가 없게 되어버리는데 어떻게 바꾸면 될까요? 좀 생각해봤는데 감이 안와서요 혹시 나중에 고치는 내용이 나오나요 두번째는 이번 포트폴리오 과제의 댓글부분 리팩토링 진행하다가 궁금했던 건데요 // BoardCommentWrite.container.tsx // ... const onClickWrite = async (): Promise<void> => { // ... // setWriter(""); // setPassword(""); // setContents(""); setInputs( (prev) => Object.fromEntries( Object.keys(prev).map((key) => [key, ""]), ) as typeof prev, ); // ... } 댓글 작성 끝날때 writer, password, contents를 비워줄 수 있도록 빈 문자열로 초기화시켜주던 걸 이런식으로 바꾸었는데 리팩토링 마치고 나서 잘 돌아가긴 했는데요 위 부분을 너무 어거지로 바꾼 것 같아서 좀 그래요... 사실 setInputs({ writer: "", password: "", contents: "" }) 그냥 이렇게 하는게 여기선 가장 좋은 방법인 것 같긴 한데, 더 많은 state들을 묶는 경우도 있다고 생각하면 것도 좀... 그래서요 이번 댓글 부분 코드에서는 setInputs({ writer: "", password: "", contents: "" }) 이렇게 하는게 가장 적당할까요? 그리고 더 많은 걸 초기화해야한다고 치면 어떻게 하는게 좋을까요?
해결됨
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
주문상품과 주문은 다대일 양방향인데 주문상품과 상품은 다대일 단방향으로 하셨는데 첫번째는 양방향으로 설정하신 이유가 뭘까요?
해결됨
풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)
50개의 데이터를 넣는 과정에서 발생한 오류입니다. 임시 데이터라 발생한 오류라 나중에 데이터를 넣으면 해결된다는 답변을 보았는데 그 뒤에 수업을 따라가면서 맞게 코드작성을 하고 있는지 체크가 불가능한 상태여서 임시적으로라도 해결하는 방법이 있을까요?
미해결
실전! 스프링 데이터 JPA
제 기억속에 jpa 활용편에서 들었던 내용이였던 거 같은데 em.persist()를 호출하게 되면 id값이 자동증가여서 값이 null이기 때문에 em.flush를 호출안해줘도 persist와 동시에 flush가 호출된다고 기억속에 있습니다... 혹시 맞을까요..?
미해결
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? ( 예 /아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? ( 예 /아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? ( 예 /아니오) [질문 내용] 자바 중급까지 듣고 스프링 입문 강의를 한번 들어봤는데 자바 중급 강의 까지는 이해도 잘 되고 좋았습니다. 그런데 이번 스프링 입문 강의 들으니 이해가 쉽지가 않네요 스프링 기본 강의로 넘어가면 자바 강의했던거 처럼 차근차근 가르쳐 주시는건가요? 아니면 여기서 이해 안되는 것들 다 알고 넘어가야 하나요?
미해결
코드로 배우는 React 19 with 스프링부트 API서버
api 가 요청받을때 시큐리티 필터 넘버링되서 13개쭉나오는 설정은 어디서 하는건지 알수있을까요>?
미해결
실전! 스프링 데이터 JPA
public void updateUserName(Long userId, String newName) { User user = userRepository.findById(userId) .orElseThrow(() -> new CustomException("User not found with id: " + userId)); user.setName(newName); userRepository.save(user); } 여기서 findById로 인해 영속성 컨텍스트에 user가 올라가있어서 setName만 해줘도 더티체킹으로 인해서 저장되는 걸로 알고있습니다. 그러면 userRepository.save (user);를 따로 해줘야하나요?
미해결
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? ( 예 /아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? ( 예 /아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? ( 예 /아니오) [질문 내용] 여기에 질문 내용을 윈도우에서 실행했는데 이런식으로 나옵니다. ㅠㅠ 왜이런건가요?
미해결
실전! 스프링 데이터 JPA
Optioanl<Member> findById(Long id)와 @Query("select m from Member m where m.id = :id) Optional<Member> findByid(@Param("id") Long id) 가장 위의 코드는 spring data jpa를 이용해서 작성했기 때문에 em.flush()가 호출될 때 바로 일어나지않고 아래의 코드는 jpql로 작성했기 때문에 로직 호출 시에 바로 em.flush()가 발생하는 거 맞나요?
해결됨
김영한의 실전 자바 - 중급 2편
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 말 그대로 입니다. 영한님은 하루에 자바 강의를 찍을 때 평균적으로 하루에 시간을 얼마나 투자하시나요? ('어레이 리스트 에서 링크드리스트로 변환 할때 이런 것은 얼마나 생각을 해야지 나오지?(11:30~40)'라는 생각이 들어서 질문을 합니다.)
미해결
실전! Querydsl
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] fetchOne()은 결과 값이 없을 경우 null을 반환 하는데 왜 Optional<Member>로 반환 하지 않나요? fetchOne()은 member가 없을 경우 null 반환 합니다. 결과 값을 Optional.ofnullable()로 감싸서 반환 후 서비스 계층에서 null 이면 안될 경우 RutTimeException을 상속한 커스텀 Exception을 발생 시키고 advice에서 처리 하는게 맞나요?
미해결
그림으로 배우는 자바, 파트1: 입문!
자료 관련 주소가 있을까요?
해결됨
Next + React Query로 SNS 서비스 만들기
안녕하세요, 아래 ISR에 대해서 질문드렸었는데, nextjs 에서 2가지 구현 방법이있다고 해서 두가지가 어떤 차이점이 있고 어떻게 활용하는게 좋을지 궁금해서 질문드립니다! 1번 방법 = fetch API 의 revlidate를 활용하여 ISR 구현 import ProductList from "@/component/ProductList"; import { getQueryClient } from "@/component/TanstackQueryOption"; import { getProducts } from "@/fetch/getProducts"; import { dehydrate, HydrationBoundary, QueryClient } from "@tanstack/react-query"; import Image from "next/image"; export default async function ProductPage () { const queryClient = getQueryClient(); await queryClient.prefetchQuery({ queryKey:['products'], queryFn: getProducts, }) return ( <> <section className='visual-sec'> <Image src="/visual.png" alt="visual" width={1920} height={300}/> </section> <section className="product-sec"> <h2>상품 리스트</h2> <HydrationBoundary state={dehydrate(queryClient)}> <ProductList /> </HydrationBoundary> </section> </> ) } import { isServer, QueryClient, defaultShouldDehydrateQuery, } from '@tanstack/react-query' function makeQueryClient() { return new QueryClient({ defaultOptions: { queries: { staleTime: 10 * 1000, }, dehydrate: { shouldDehydrateQuery: (query) => defaultShouldDehydrateQuery(query) || query.state.status === 'pending', }, }, }) } let browserQueryClient: QueryClient | undefined = undefined export function getQueryClient() { if (isServer) { return makeQueryClient() } else { if (!browserQueryClient) browserQueryClient = makeQueryClient() return browserQueryClient } } 'use client' import { getQueryClient } from '@/component/TanstackQueryOption'; import { QueryClientProvider, } from '@tanstack/react-query' import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; import { ReactNode } from 'react' export default function TanstackQueryProvider({ children }: { children: ReactNode }) { const queryClient = getQueryClient() return ( <QueryClientProvider client={queryClient}> {children} <ReactQueryDevtools initialIsOpen={true} /> </QueryClientProvider> ) } export const getProducts = async () => { const res = await fetch(`http://localhost:9090/api/products`, { method: "GET", headers: { "Content-Type": "application/json", }, next: { revalidate: 10, } }); const data = await res.json(); const currentTime = new Date().toLocaleTimeString('ko-KR', { hour: '2-digit', minute: '2-digit', second: '2-digit', fractionalSecondDigits: 3, hour12: false, }); if (typeof window === "undefined") { console.log('fetch products', 'server', currentTime); console.table(data); } else { console.log('fetch products', 'client', currentTime); console.table(data); } if(!res.ok) { throw new Error("Failed to fetch products"); } return data; } 2번 방법 = export const revalidate 로 시간 설정 후 fetch로 받은 data 값을 바로 렌더링 시키기 import Product from "@/component/Product"; import styles from '@/component/ProductList.module.css'; import Image from "next/image"; export const revalidate = 10; export default async function Product2Page() { const data = await fetch('/api/products'); const products = await data.json(); console.log(revalidate, 'Product2Page'); return ( <> <section className='visual-sec'> <Image src="/visual.png" alt="visual" width={1920} height={300}/> </section> <section className="product-sec"> <h2>상품 리스트</h2> <div className={styles.productList}> {products.map((product: any) => ( <Product key={product.item_no} product={product} /> ))} </div> </section> </> ) } 2개다 ISR로 구현되며, 1번 방법은 Data Cache 캐싱 매커니즘을 활용하고, 2번 방법은 Full Router Cache 캐싱 매커니즘을 활용한다의 차이점으로 생각이 드는데, 이 외에 다른 차이점과 실제 개발을 하면서 선호되는 방식이 따로 있을까요? 해당 페이지만 보았을때는 2번 방법으로 해도 어차피 주기적으로 다시 생성해서 최신 데이터를 반영하면 복잡하게 react-query를 사용하고, Hydration을 하면서 데이터를 동기화할 필요가 있나 싶어서 어떻게 사용해야할지 감이 안잡히네여