안녕하세요!! 강의 너무나도 잘 듣고 있습니다. 18-05 게시글 이미지와 함께 등록 23:25분에서 file에 대한 타입을 지정을 할 때 알려주신 방법 외에도 ! 를 이용해서 해결을 의도치 않게 했는데, 구글 및 스택오버플로우에도 Argument of type ' file | undefined' is not assignable to parameter of type 'File'. Type 'undefined' is not assignable to type 'File'.ts(2345) 해당 오류를 검색해보았지만 알려주신 방법들 외에는 느낌표를 사용하는 방법은 찾지 못했습니다. 이게 왜 되는건지... 도통 알수가 없네요... 이건 어떤 원리인가요?? 항상 감사드립니다.
1강 '왜 Next.js 가 필요할까?(기술적인 등장 배경)' 에서 언급하신 영상들이 무엇인지 궁금해서 질문드립니다. 04:40 "이 비동기에 대한 의미는 한 번 설명드린 적이 있어요." 10:00 "서버 사이드 렌더링 시간에 저희가 이미 공부했으니까요." 두 지점에서 언급하신 Youtube 영상이 각각 무엇인지 URL을 알려주실 수 있으실까요?
질문1) 한 트랜잭션 안에서 최초 getReference() 를 통해 가져온 애는 쭉 프록시 객체 로, find() 를 통해 가져온 애는 쭉 일반 객체 로 영속성 컨텍스트에 남는다고 보면 되나요? (두 경우 모두 별도로 영속성 컨텍스트를 비우는 등의 작업을 하지 않는다고 가정) 질문2) 링크1 의 답변에 의하면 영속성 컨텍스트 안에 프록시 객체를 담는 Map 과 진짜 객체를 담는 1차 캐시 가 있는 것으로 이해했습니다. 그럼 find() ( getReference() )는 아래와 같은 흐름으로 동작하는 게 맞나요? 프록시를 담는 Map 을 먼저 조회 (1차 캐시를 먼저 조회) 있으면 프록시 객체를 가져오고 없으면 1차 캐시에서 조회 (있으면 진짜 객체 가져오고 없으면 프록시 담는 Map 에서 조회) 1차 캐시에 있으면 그대로 가져오고 없으면 DB에서 조회 ( Map 에 있으면 그대로 가져오고 없으면 프록시 객체 생성) 질문3) 링크2 의 답변을 통해 프록시 객체는 영속 대상이 아니라고 말씀해주셨습니다. 그렇다면 em.detach(프록시객체); 는 어떻게 이해하면 되나요? detach() 라는 것이 영속 상태인 것을 준영속 상태로 바꿔주는 것인데 프록시 객체는 애초에 영속 대상이 아니라고 말씀해주셔서 헷갈리네요 전에 올렸던 다른 질문들인데요 AI 답변만 달려서 그런데 한번 확인부탁드립니다 https://inf.run/EcpuQ https://inf.run/75Xi1
안녕하세요. 정말 도움을 많이 받고 있습니다. 감사합니다. 항상 앱을 재시작하고 같은 아이디(whiteship)로 회원가입을 하시는데 계속 성공하시는 것 같아서 질문드립니다. 혹시 앱을 재시작하면 회원 목록이 초기화되는 코드가 있으신가요? 제가 놓친 것 같지만 부득이하게 질문드립니다. 감사합니다.
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. 뭐가 문제일까요 똑같이 타이핑 한 것 같은데 변수 초기화 오류 뜨네요
"Cannot invoke 'jdk.internal.platform.CgroupInfo.getMountPoint()' because 'anyController' is null" 다음과 같은 에러가 발생합니다. Mac Docker Desktop 환경 OpenJDK 17 slim 이미지 사용 로컬에서 진행했을 때 gpt에게 물어봤을 때와 stackoverflow를 확인해봤습니다. 이 에러는 Java 17 이상에서, JVM이 리눅스 컨테이너(CGroup) 안에서 리소스(CPU, 메모리 등) 정보를 가져오려고 할 때, Mac OS 에서는 리눅스 CGroup 시스템 이 아예 존재하지 않아서 발생 그리고 문제를 해결하기 위한 방법으로 프로메테우스를 비활성화하라는 답변을 주었는데, 해결방안을 적용해봐도 해결할 수 없었습니다. 그래서 생각한게 리눅스 컨테이너 이미지인 slim 버전에 대해서 생각하게 되었고, Dockerfile의 이미를 교체했을 때 FROM eclipse-temurin:17-jdk 정상적으로 실습을 수행할 수 있었습니다. 답변보다는 mac에서 진행할 경우 다음과 같은 문제로 머리아플 분들을 위해 작성했습니다.
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. 강의 할 때 보여주시는 화면은 문서로는 없나요?
안드로이드로 실행하고 있고 앱 아이콘까지 성공하였습니다. 그런데 app. tsx에 function Section({children, title}: SectionProps): React.JSX.Element { useEffect(() => { setTimeout(() => { SplashScreen.hide(); }, 1000); }); const isDarkMode = useColorScheme() === 'dark'; 이 코드를 올리면 Cannot read property 'hide' of null 이라고 뜹니다. 그래서 시도해본 방법은 -metro 서버 연겨리도 다시해보고 -js hide 호출위치를 app()쪽에도 해보고 -mainActivity 코드에 SplashScreen.show (this); 코드가 잘 있는지 확인도 하고 -gradle.properties에 android.enableJetifier=true 추가해보고 -androidmanifest의 activity에 android:theme="@style/SplashTheme" 이 부분도 추가해보고 -styles.xml에 resource부분에 <!-- ① 스플래시 화면용 테마 --> <style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- launch_screen.xml(layout) 을 배경으로 사용 --> <item name="android:windowBackground">@layout/launch_screen</item> </style> <!-- ② 앱 전체용 기본 테마 --> <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar"> <!-- 여기에 앱 전체 스타일 아이템들을 넣으세요 --> <!-- 예: 상태바 색상, 기본 버튼 스타일 등 --> </style> 이렇게도 넣어보아도 앱이 켜지려다가 바로 꺼져버립니다. 로그도 따로 안남고.. 혹시 이 부분에서 왜 이렇게 되고 해결방안이 있을까요??
버튼 컴포넌트 onClick={handleClick()} jsx 에서 위처럼 적으면 자바스크립트에서 엔진에서 즉시실행함수로 인식하는것 처럼 인식을 해서 렌더링이 되기도전에 함수를 먼저 실행해버리는 현상이 생기는 이유가 맞을까요? 결국 핸들러 함수의 기능도 하지못하고 1회용으로 즉시실행되고 소멸해버리는 함수가 되어버리는 것 같아보이는데 이에 대한 정확한 설명이 있을까요? 제가 생각한 이 부분에 보충적으로 필요한 설명을 혹시 해주실 수 있으실까요?
안녕하세요! 항상 유익한 강의를 제공해 주셔서 감사드리며, 강의를 통해 UI를 다양한 방법으로 구현하는 법과 요구 사항의 디테일한 부분을 어떻게 처리해야 하는지에 대해 많은 것을 배우고 있습니다. 조심스럽게 여쭤보고 싶은 점이 있어 글을 남깁니다. 혹시 시간이 괜찮으시면 선생님의 고견을 듣고 싶습니다. - tooltip의 react 버전 viewportContext.tsx에서 useSyncExternalStore()사용부분 useSyncExternalStore를 통해 외부요소의 변화를 구독할 수 있게, 첫번째 인자로 subscribe를 넘기고 해당 상태를 컴포넌트와 동기화 할 수 있도록 두번째 인자로 getViewportRect를 넘기고 있습니다. 첫번째 인자인 subscribe는 함수의 참조를 넘기는데, 두번째 인자인 getViewportRect는 "getViewportRect()"로 값을 넘기고 있어, 이 부분에서 조금 의문이 생겨 아래와 같이 수정하면 어떨까 생각했습니다. useSyncExternalStore의 두번째 인자에도 함수의 참조를 넘기도록 수정하여 react에게 제어권을 넘기고, getViewportRect에서 리턴된 함수는 stored값을 기억할 수 있도록 즉시실행함수로 만드는 방식입니다. const getViewportRect = (() => { let stored: Rect = DefaultRect; return () => { const el = typeof document !== 'undefined' && document.scrollingElement; if (!el) return stored; const { left, top, width, height } = el.getBoundingClientRect(); const newRect = { left, top, width, height, scrollHeight: el.scrollHeight }; if (newRect && !isSameRect(stored, newRect)) stored = newRect; return stored; }; })(); //1. 즉시실행함수로 수정 const ViewportContextProvider = ({ children }: { children: ReactNode }) => { const viewportRect = useSyncExternalStore(subscribe, getViewportRect); //2.두 인자 모두 참조만 넘기도록 수정 return ( <ViewportContext.Provider value={viewportRect}> {children} </ViewportContext.Provider> ); }; 이렇게 수정하는 것이 더 나은 방법일지 여쭙고 싶습니다. useStyleView.ts에서 useLayoutEffect의 의존성배열에 참조 자료형 넣는 것 viewportRect가 객체인데, 이를 의존성배열에 그대로 넣는것이 괜찮은지 궁금합니다. const viewportRect = useViewportRect(); //객체 useLayoutEffect(() => { ... }, [viewportRect, wrapperRef, targetRef, position]); viewportRect에서 개별 값만 분리해서 넣는 방법도 고려해 보았습니다. const { top, left, width, height } = useViewportRect(); //생각해본 버전 useLayoutEffect(() => { ... }, [top, left, width, height, wrapperRef, targetRef, position]); 강의자료에 완성코드가 있다고 하는 걸 어디서 본 것도 같은데... 제가 어디있는지 찾지를 못해서... 🥲 강의 내용만 보고 작성한 코드임을 양해 부탁드립니다. 🙇♀
선생님! AWS에 이미지 호스팅 서비스 관련해서 궁금한게 있습니다. 제가 테스트를 해봤는데 썸네일 이미지 크기(가로/세로)에 상관없이 실제 운영 환경에는 동일한 크기의 썸네일 이미지로 보여지더라구요. 그러면 이게 AWS 이미지 호스팅 할 때 이미지 크기를 리사이징해서 조절해주는 작업이 일어나는거라고 저는 추측하고 있는데요. 만약 이런 작업이 일어난다면 결국 AWS에 불필요한 작업으로 인한 비용이 발생이 되는거라서... 혹시 이미지 사이즈 크기에 대한 팁이 있을까요?
강의의 3분 정도 쯤에, (beforeLogin)/i 폴더와 파일들을 (beforeLogin)/@modal/(i) 로 복사 한 후 http://localhost:3000/i/flow/login 접속시 무한 GET 접속 시도가 터미널 창에 보입니다. 이때, <Link href ="login" className ={styles.login}>로그인</Link> 입니다. 그런데, <Link href ="/i/flow/login" className ={styles.login}>로그인</Link> 변경하면, http://localhost:3000/i/flow/login 접속시, 터미널 창에서는 무한 GET 접속시도는 사라집니다. 어떻게 해서 이렇게 되는지요?
강의 50초 정도에, i, login, page.tsx는 {children}에서 렌더링, 여기는 (@modal 의 하위 폴더와 파일 선택) {modal}에서 되죠? 라고 설명하시는 부분이 이해가 안됩니다. 저는, app/(beforeLogin)/layout.tsx 의 {children}은 app/(beforeLogin)/page.tsx 를 가져오는 것이고, {modal}은 @modal 폴더의 page.tsx (default.tsx, i/flow/login/폴더로 리다이렉션) 를 찾는 것으로 이했습니다. 여러 폴더를 모두 보여준다고 설명하신듯하여, 이해가 안되네요.
안녕하세요. 항상 좋은 인사이트와 경험을 공유해주셔서 감사드립니다. 최근 프론트엔드 개발을 공부하면서 "Content Attribute"와 "IDL Attribute"의 사용 방식에 대해 고민하게 되었습니다. 이를 정리해보면서 나름대로 다음과 같은 결론에 이르렀습니다. Content Attribute는 변하지 않는 어트리뷰트 값이나 리소스를 표현할 때 사용하고, 그 외, 동적으로 핸들링이 필요한 경우에는 IDL Attribute를 사용하는 것이 맞다고 이해하고 있습니다. 이러한 개념을 공부하면서, 현업에서 다양한 코드들을 보게 되었는데요, 특히 주니어 개발자분들이 작성한 코드에서는 Content Attribute를 많이 사용하는 반면, 시니어 개발자나 CTO급 분들의 코드에서는 Content Attribute 사용이 상대적으로 적고, 대부분 IDL Attribute를 적극적으로 사용하는 모습을 많이 볼 수 있었습니다. 이런 현상을 보며 자연스럽게 궁금증이 생겼습니다. 왜 경험 많은 개발자일수록 Content Attribute 사용이 줄어드는 걸까? Content Attribute 방식과 IDL Attribute 방식에 대해 어떻게 생각하시고, 어떤 기준으로 선택하시는지 궁금합니다. 혹시 이 부분에 대해 간단히 의견을 들려주실 수 있다면 큰 도움이 될 것 같습니다. (물론 바쁘시다면 답변 주시지 않아도 괜찮습니다! 이렇게 질문을 정리하는 과정만으로도 많은 공부가 되고 있습니다.) 읽어주셔서 감사합니다. 좋은 하루 되세요.
