강의대로 따라갔는데 강의처럼 렌더링이 되고 있지 않습니다 ㅠㅠ 어디가 문제일까요chatgpt는 서버가 없다 뭐 이렇다는데 ㅠㅠ 출력 화면  Nav.jsimport React, { useEffect, useState } from 'react' import"./Nav.css" export default function Nav() { const [show, setShow] = useState(false); useEffect(() => { window.addEventListener("scroll", ()=> { console.log('window.scrollY', window.scrollY); if(window.scrollY > 50) { setShow(true); } else { setShow(false); } }) return () => { window.removeEventListener("scroll", ()=> {}); }; }, []); return ( <nav className={`nav ${show && "nav__black"}`}> <img alt = 'Netflix logo' src = "https://upload.wikimedia.org/wikipedia/commons/thumb/0/08/Netflix_2015_logo.svg/960px-Netflix_2015_logo.svg.png" decoding="async" width="799" height="216" srcset="//upload.wikimedia.org/wikipedia/commons/thumb/0/08/Netflix_2015_logo.svg/1198px-Netflix_2015_logo.svg.png 1.5x, //upload.wikimedia.org/wikipedia/commons/thumb/0/08/Netflix_2015_logo.svg/1597px-Netflix_2015_logo.svg.png" className='nav__logo' onClick={() => window.location.reload()} /> <img alt = "User logged" src = "https://occ-0-3077-988.1.nflxso.net/dnm/api/v6/vN7bi_My87NPKvsBoib006Llxzg/AAAABTZ2zlLdBVC05fsd2YQAR43J6vB1NAUBOOrxt7oaFATxMhtdzlNZ846H3D8TZzooe2-FT853YVYs8p001KVFYopWi4D4NXM.png?r=229" className="nav__avatar" /> </nav> ); } Nav.css.nav{ position: fixed; top: 0; width: 100%; height: 30px; z-index: 1; padding: 20px; display: flex; justify-content: space-between; align-items: center; transition-timing-function: ease-in; transition: all 0.5s; } .nav__black { background-color: #111; } .nav__logo{ position: fixed; left: 40px; width: 80px; object-fit: contain; } .nav__avatar { position: fixed; right: 40px; width: 30px; object-fit: contain; }Banner.jsimport axios from "../api/axios"; import React, { useEffect, useState } from 'react' import requests from '../api/requests'; import "./Banner.css" export default function Banner() { const [movie, setMovie] = useState([]); useEffect(() => { fetchData(); }, []); const fetchData = async() => { //현재 상영중인 영화 정보를 가져오기 (여러 영화) const request = await axios.get(requests.fetchNowPlaying); //여러 영화 중 영화 하나의 ID를 가져오기 const movieId = request.data.results[ Math.floor(Math.random() * request.data.results.length) ].id; //특정 영화의 더 상세한 정보를 가져오기 (비디오 정보도 포함) const {data: movieDetail} = await axios.get(`movie/${movieId}`, { params: {append_to_reponse: "videos"} }); setMovie(movieDetail); } const truncate = (str, n) => { return str?. length > n ? str.substr(0, n - 1) + "..." : str; } return ( <header className="banner" style={{ backgroundImage: `url("https://image.tmdb.org/t/p/original/${movie.backdrop_path}")`, backgroundPosition: "top center", backgroundSize: "cover" }}> <div className="banner__contents"> <h1 className="banner__title"> {movie.title || movie.name || movie.original_name} </h1> <div className="banner__buttons"> <button className="banner__button play">Play</button> <button className="banner__button info">More Information</button> </div> <h1 className="banner_description"> {truncate(movie.overview, 100)} </h1> </div> <div className="banner--fadeBottom"></div> </header> ) } Banner.css.banner{ color: white; object-fit: contain; height: 448px; } @media (min-width : 1500px) { .banner{ position: relative; height: 600px; } .banner--fadeBottom{ position: absolute; bottom: 0; width: 100%; height: 40rem; } } @media (max-width : 768px) { .banner__contents{ width: min-content !important; padding-left: 2.3rem; margin-left: 0px !important; } .banner--description{ font-size: 0.8rem !important; width: auto !important; } .info{ text-align: start; padding-right: 1.2rem; } .space{ margin-left: 6px; } }axios.jsimport axios from "axios"; const instance = axios.create({ baseURL: "https://api.themoviedb.org", params: { api_key: "eea00451962aefe6185011d467944242", language: "ko-KR", }, }); export default instance;requests.jsconst requests = { fetchNowPlaying: "movie/now_playing", fetchNetFlixOriginals: "/discover/tv?with_networks=213", fetchTrending: "/trending/all/week", fetchTopRated: "/movie/top_rated", fetchActionMovies: "/discover/movie?with_genres=28", fetchComedyMovies: "/discover/movie?with_genres=35", fetchHorrorMovies: "/discover/movie?with_genres=27", fetchRomanceMovies: "/discover/movie?with_genres=10749", fetchDocumentaries: "/discover/movie?with_genres=99", } export default requests;

aws face liveness라는 서비스를 써야하는데 리액트, 코틀린, 스위프트만 지원하는듯 합니다.네이티브 단은 건들 엄두가 안나서 웹뷰로 띄워서 카메라를 연결하려고 하는데 이론적으로 가능할까요?

강의 예제로 다운받은 버전은 SocialLoginWeb1703 인데요. 강의는 1303이네요. 스프링시큐리티 구현코드에 있어서도 차이가 나는데, 이유가 있는건가요?

eas submit --platform ios  Select a build from EAS❯ Provide a URL to the app archive Provide a path to a local app binary file Provide a build ID to identify a build on EAS  이렇게 뜹니다어떻게해야하나요?

앱 빌드 중에 문제가 생겨 문의드립니다.아래 알려주신 명령어를 입력하면 로컬이 아니라 expo.dev 사이트에서 앱이 빌드 되는 것을 확인 했습니다. 무료 계정 기준으로 빌드 시간이 30분~1시간 소요됩니다...npx eas build --platfo rm android --profile development 바쁘시겠지만 로컬에서 빌드하고 AVD에 설치하는 과정을 알려주시면 감사하겠습니다. 저와 같은 문제가 발생하시는 분들은 npm run android 또는 npm run ios 를 입력하시면 앱이 설치가 됩니다.이게 정석인지는 잘 모르겠습니다..

안녕하세요 Next app router 관련해서 질문드립니다.현재 사이드프로젝트에서 route handler를 적극활용하고 있는데요.제가 인프라나 백엔드 관련 지식이 없다보니 좀 헷갈리는게 있습니다. 현재 저희 서비스에서 특정 API는 클라이언트 컴포넌트에서 route handler로 API 호출 -> route handler에서 외부 백엔드 API 호출이런 형태로 사용되고 있는데요, 이때 실제로 route handler 서버가 아래의 사진 중 어느 형태로 운용되는 것인가요? 즉, Next 프로젝트를 배포했을 때 각 유저마다 route handler 서버가 할당되는 것인가요? 아니면 모든 유저의 요청을 오직 하나의 route handler서버에서 대응하는 것인가요?     아니면 이게 배포 환경에 따라 달라지는것인가요?

강의 보다보면 저장했을 때 들여쓰기가 다 정리되던데 단축키 인가요 확장프로그램인가요??

안녕하세요.강의를 잘 듣고 있습니다.prd 자료가 강의 노트에 없습니다.가능하면citymir@naver.com으로 자료를 부탁드립니다.

안녕하세요! 강의 잘 듣고 있습니다. 제가 혼자 실습하다가 createPostAction 의 반환값에 success 필드를 넣은 후에 useActionState의 initialState 에도 이 필드를 아래와 같이 추가했었는데요, const [state, formAction, isPending] = useActionState(createPostAction, { message: '', errors: {}, formData: { title: '', tag: '', content: '', }, success: false, });useActionState 훅을 사용할 때 initialState에 포함된 필드 중 일부를 이후 action 함수의 반환값에서 생략하면 어떤 경우에는 에러가 발생하고, 어떤 경우에는 아무 문제 없이 동작하는 게 잘 이해가 되지 않아서요. 예를 들어 initialState에는 success 필드가 있지만, 유효성 검사 실패 시 반환 객체에서 success를 생략하면 에러가 발생합니다. if (!validatedFields.success) { return { errors: validatedFields.error.flatten().fieldErrors, message: 'Validation failed', formData: rawFormData, success: false, // 없으면 useActionState 에서 에러 발생 }; }그런데 try...catch 문에서는 success 없이 반환하면 에러가 발생하지 않는 걸 확인할 수 있었습니다. try { const { title, tag, content } = validatedFields.data; await createPost({ title, tag, content }); revalidateTag('posts'); return { success: true, // 없어도 에러 안남 message: 'Post created successfully', }; } catch (e) { return { message: 'Failed to create post : ' + e, formData: rawFormData, }; }formData 필드도 비슷하게 행동하는데 이 차이가 왜 발생하는지, 어떤 기준으로 반환 객체의 필드 구조를 검사하고 에러를 발생시키는지 궁금합니다. useActionState에서 반환 객체의 필드가 initialState와 구조적으로 정확히 일치해야 하는 조건이 언제 적용되는 건가요?

안녕하세요 Expo 패키지 혹은 React native 패키지를 사용하는 기준이 무엇인가요?예를 들어 Image도 react native 패키지로도 가져올 수 있고 expo로도 가져올 수 있는데 강의에서는 expo를 사용하셨더라구요 혹시 그 이유를 알 수 있을가요?

루트 page.tsx에서 사용하는 컴포넌트는pages/_components/ 여기에 바로 넣으셨는데그럼 about 페이지에서만 사용하는 컴포넌트는pages/_components/about/ 이 경로에 배치하면될까요?

뒤로 이동 버튼을 눌러 페이지 전환이 잘 되었음을 검증하고 싶으면 history web api 등을 이용해서 검증하는게 더 올바르지 않나요??왜 useNavigate 의 반환 함수의 인자로 검증하는지 궁금합니다~

무한로딩 되면서 접속이 안되요 ㅠㅠ

ErrorBoundary component ( react-error-boundary ) 는 client component 인데 수업에서는 server component 에서 사용하고 있는걸로 확인됩니다. 괜찮을까요?

socialLoginSpa1703 소스코드를 다운받고인텔리제이로 프로젝트를 열었습니다.jdbc 설정대로 mysql을 생성하였고 bootRun으로 실행시키면 프로젝트는 실행됩니다.강의와같이 localhost:8080 이 접속이 안되고localhost에 대한 액세스가 거부됨이 페이지를 볼 수 있는 권한이 없습니다.HTTP ERROR 403가 뜹니다. 확인 부탁드려요2025-06-07T13:23:42.478+09:00 INFO 46412 --- [ restartedMain] c.e.demo.SocialLoginSpa1703Application : Starting SocialLoginSpa1703Application using Java 17.0.15 with PID 46412 (C:\Users\HP\Desktop\�Ǽ�ȣ\Project\SocialLoginSpa1703\build\classes\java\main started by HP in C:\Users\HP\Desktop\�Ǽ�ȣ\Project\SocialLoginSpa1703)2025-06-07T13:23:42.483+09:00 INFO 46412 --- [ restartedMain] c.e.demo.SocialLoginSpa1703Application : No active profile set, falling back to 1 default profile: "default"2025-06-07T13:23:42.566+09:00 INFO 46412 --- [ restartedMain] .e.DevToolsPropertyDefaultsPostProcessor : Devtools property defaults active! Set 'spring.devtools.add-properties' to 'false' to disable2025-06-07T13:23:42.566+09:00 INFO 46412 --- [ restartedMain] .e.DevToolsPropertyDefaultsPostProcessor : For additional web related logging consider setting the 'logging.level.web' property to 'DEBUG'2025-06-07T13:23:44.141+09:00 INFO 46412 --- [ restartedMain] .s.d.r.c.RepositoryConfigurationDelegate : Bootstrapping Spring Data JPA repositories in DEFAULT mode.2025-06-07T13:23:44.275+09:00 INFO 46412 --- [ restartedMain] .s.d.r.c.RepositoryConfigurationDelegate : Finished Spring Data repository scanning in 119 ms. Found 2 JPA repository interfaces.2025-06-07T13:23:45.451+09:00 INFO 46412 --- [ restartedMain] o.s.b.w.embedded.tomcat.TomcatWebServer : Tomcat initialized with port 8080 (http)2025-06-07T13:23:45.477+09:00 INFO 46412 --- [ restartedMain] o.apache.catalina.core.StandardService : Starting service [Tomcat]2025-06-07T13:23:45.478+09:00 INFO 46412 --- [ restartedMain] o.apache.catalina.core.StandardEngine : Starting Servlet engine: [Apache Tomcat/10.1.39]2025-06-07T13:23:45.585+09:00 INFO 46412 --- [ restartedMain] o.a.c.c.C.[Tomcat].[localhost].[/] : Initializing Spring embedded WebApplicationContext2025-06-07T13:23:45.587+09:00 INFO 46412 --- [ restartedMain] w.s.c.ServletWebServerApplicationContext : Root WebApplicationContext: initialization completed in 3018 ms2025-06-07T13:23:45.876+09:00 INFO 46412 --- [ restartedMain] o.hibernate.jpa.internal.util.LogHelper : HHH000204: Processing PersistenceUnitInfo [name: default]2025-06-07T13:23:46.037+09:00 INFO 46412 --- [ restartedMain] org.hibernate.Version : HHH000412: Hibernate ORM core version 6.5.3.Final2025-06-07T13:23:46.427+09:00 INFO 46412 --- [ restartedMain] o.h.c.internal.RegionFactoryInitiator : HHH000026: Second-level cache disabled2025-06-07T13:23:47.214+09:00 INFO 46412 --- [ restartedMain] o.s.o.j.p.SpringPersistenceUnitInfo : No LoadTimeWeaver setup: ignoring JPA class transformer2025-06-07T13:23:47.301+09:00 INFO 46412 --- [ restartedMain] com.zaxxer.hikari.HikariDataSource : HikariPool-1 - Starting...2025-06-07T13:23:47.595+09:00 INFO 46412 --- [ restartedMain] com.zaxxer.hikari.pool.HikariPool : HikariPool-1 - Added connection com.mysql.cj.jdbc.ConnectionImpl@3419a5dd2025-06-07T13:23:47.600+09:00 INFO 46412 --- [ restartedMain] com.zaxxer.hikari.HikariDataSource : HikariPool-1 - Start completed.2025-06-07T13:23:49.656+09:00 INFO 46412 --- [ restartedMain] o.h.e.t.j.p.i.JtaPlatformInitiator : HHH000489: No JTA platform available (set 'hibernate.transaction.jta.platform' to enable JTA platform integration)2025-06-07T13:23:49.824+09:00 INFO 46412 --- [ restartedMain] j.LocalContainerEntityManagerFactoryBean : Initialized JPA EntityManagerFactory for persistence unit 'default'2025-06-07T13:23:50.469+09:00 INFO 46412 --- [ restartedMain] o.s.d.j.r.query.QueryEnhancerFactory : Hibernate is in classpath; If applicable, HQL parser will be used.2025-06-07T13:23:51.243+09:00 WARN 46412 --- [ restartedMain] JpaBaseConfiguration$JpaWebConfiguration : spring.jpa.open-in-view is enabled by default. Therefore, database queries may be performed during view rendering. Explicitly configure spring.jpa.open-in-view to disable this warning2025-06-07T13:23:52.357+09:00 INFO 46412 --- [ restartedMain] o.s.b.d.a.OptionalLiveReloadServer : LiveReload server is running on port 357292025-06-07T13:23:52.418+09:00 INFO 46412 --- [ restartedMain] o.s.b.w.embedded.tomcat.TomcatWebServer : Tomcat started on port 8080 (http) with context path '/'2025-06-07T13:23:52.428+09:00 INFO 46412 --- [ restartedMain] c.e.demo.SocialLoginSpa1703Application : Started SocialLoginSpa1703Application in 10.793 seconds (process running for 11.915)2025-06-07T13:24:32.032+09:00 INFO 46412 --- [nio-8080-exec-2] o.a.c.c.C.[Tomcat].[localhost].[/] : Initializing Spring DispatcherServlet 'dispatcherServlet'2025-06-07T13:24:32.032+09:00 INFO 46412 --- [nio-8080-exec-2] o.s.web.servlet.DispatcherServlet : Initializing Servlet 'dispatcherServlet'2025-06-07T13:24:32.035+09:00 INFO 46412 --- [nio-8080-exec-2] o.s.web.servlet.DispatcherServlet : Completed initialization in 2 ms2025-06-07T13:24:32.090+09:00 INFO 46412 --- [nio-8080-exec-2] c.e.d.security.JwtAuthenticationFilter : doFilterInternal

강의 잘 따라가다가 로그인까지 성공했는데 20강부터 갑자기 add,activity,user탭을 눌러도 전환이 안돼요.. home이랑 search만 전환이 됩니다. 에러도 안떠서 어디부터 잘못된건지 감이 안 오는데 어떤 파일을 확인해야 할까요?app/(tabs)_layout.tsx 입니다import { Ionicons } from "@expo/vector-icons"; import { type BottomTabBarButtonProps } from "@react-navigation/bottom-tabs"; import { Tabs, useRouter } from "expo-router"; import { useContext, useRef, useState } from "react"; import { Animated, Modal, Pressable, Text, TouchableOpacity, View } from "react-native"; import { AuthContext } from "../_layout"; export default function TabLayout(){ const router=useRouter(); const [isLoginModalOpen,setIsLoginModalOpen]=useState(false); const {user}=useContext(AuthContext); const isLoggedIn = !!user; const openLoginModal=()=>{ setIsLoginModalOpen(true); }; const closeLoginModal=()=>{ setIsLoginModalOpen(false); }; const toLoginPage= ()=>{ setIsLoginModalOpen(false); router.push("/login"); } const AnimatedTabBarButton=({ children, onPress, style, ...restProps }: BottomTabBarButtonProps)=>{ const scaleValue=useRef(new Animated.Value(1)).current; const handlePressOut=()=>{ Animated.sequence([ Animated.spring(scaleValue,{ toValue:1.2, useNativeDriver:true, speed:200, }), Animated.spring(scaleValue,{ toValue:1, useNativeDriver:true, speed:200, }), ]).start(); } return ( <Pressable onPress={onPress} onPressOut={handlePressOut} style={[{ flex: 1, justifyContent: "center", alignItems: "center" }, style]} android_ripple={{ borderless: false, radius: 0 }} > <Animated.View style={{ transform: [{ scale: scaleValue }] }}> {children} </Animated.View> </Pressable> ); } return ( <> <Tabs backBehavior="history" screenOptions={{ headerShown:false, tabBarButton: (props)=><AnimatedTabBarButton {...props}/>, }} > <Tabs.Screen name="(home)" options={{ tabBarLabel:()=>null, tabBarIcon:({focused})=>( <Ionicons name="home" size={24} color={focused ? "black":"gray"}/> ), }} /> <Tabs.Screen name="search" options={{ tabBarLabel:()=>null, tabBarIcon:({focused})=>( <Ionicons name="search" size={24} color={focused ? "black":"gray"}/> ), }}/> <Tabs.Screen name="add" listeners={{ tabPress:(e)=>{ e.preventDefault(); if(!isLoggedIn){ openLoginModal(); } } }} options={{ tabBarLabel:()=>null, tabBarIcon:({focused})=>( <Ionicons name="add" size={24} color={focused ? "black":"gray"}/> ), }} /> <Tabs.Screen name="activity" listeners={{ tabPress:(e)=>{ e.preventDefault(); if(!isLoggedIn){ openLoginModal(); } }, }} options={{ tabBarLabel:()=>null, tabBarIcon:({focused})=>( <Ionicons name="heart-outline" size={24} color={focused ? "black":"gray"}/> ), }}/> <Tabs.Screen name="[username]" listeners={{ tabPress:(e)=>{ e.preventDefault(); if(!isLoggedIn){ openLoginModal(); } }, }} options={{ tabBarLabel:()=>null, tabBarIcon:({focused})=>( <Ionicons name="person-outline" size={24} color={focused ? "black":"gray"}/> ), }}/> <Tabs.Screen name="(post)/[username]/post/[postID]" options={{ href:null, }} /> </Tabs> <Modal visible={isLoginModalOpen} transparent={true} animationType="slide" > <View style={{ flex:1, justifyContent:"flex-end", backgroundColor:"rgba(0,0,0,0.5)" }}> <View style={{backgroundColor:"white",padding:20}}> <Pressable onPress={toLoginPage}> <Text>Login Modal</Text> </Pressable> <TouchableOpacity onPress={closeLoginModal}> <Ionicons name="close" size={24} color='#555'/> </TouchableOpacity> </View> </View> </Modal> </> ); }

ios환경에서 어떻게 해야되는 지 알려주시면 감사하겠습니다.

<리스트> <레코드1/> <레코드2/></리스트> 일 경우… 리스트단에서 use client로 한 후 zustand에서 리스트 자체를 통으로 관리해야하는가?각각의 레코드에 use client를 한 후 데이터를 받으면 zustand에 리스트를 만들어 레코드별로 hash(Map)으로 등록해 관리해야하는가? 레코드에는 좋아요, 조회수 등이 표시됨. 제 생각은1번은 SEO가 중요한건 각각 레코드 (상세페이지) 이므로 zustand에서 통으로 넣어 관리하면 되니 구현 및 데이터 신뢰도에서는 나아보이는데 하나바뀌면 전부 렌더링되니까 애매한거같고2번은 서버에서 모두 다 가져와서 초기속도는 빠르고 seo에 좋으나 zustand에 통으로 못넣고 데이터 자체를 내가 직접관리하는 구조라 구현 및 데이터 신뢰 측면에서는 골치아플거같은데… 무엇이 일반적인 구현방식인지 모르겠습니다. 도와주세요 ㅠㅠ

<리스트> <레코드1/> <레코드2/></리스트> 일 경우… 리스트단에서 use client로 한 후 zustand에서 리스트 자체를 통으로 관리해야하는가?각각의 레코드에 use client를 한 후 데이터를 받으면 zustand에 리스트를 만들어 레코드별로 hash(Map)으로 등록해 관리해야하는가? 레코드에는 좋아요, 조회수 등이 표시됨. 제 생각은1번은 SEO가 중요한건 각각 레코드 (상세페이지) 이므로 zustand에서 통으로 넣어 관리하면 되니 구현 및 데이터 신뢰도에서는 나아보이는데 하나바뀌면 전부 렌더링되니까 애매한거같고2번은 서버에서 모두 다 가져와서 초기속도는 빠르고 seo에 좋으나 zustand에 통으로 못넣고 데이터 자체를 내가 직접관리하는 구조라 구현 및 데이터 신뢰 측면에서는 골치아플거같은데… 무엇이 일반적인 구현방식인지 모르겠습니다. 도와주세요 ㅠㅠ

<리스트> <레코드1/> <레코드2/></리스트> 일 경우… 리스트단에서 use client로 한 후 zustand에서 리스트 자체를 통으로 관리해야하는가?각각의 레코드에 use client를 한 후 데이터를 받으면 zustand에 리스트를 만들어 레코드별로 hash(Map)으로 등록해 관리해야하는가? 레코드에는 좋아요, 조회수 등이 표시됨. 제 생각은1번은 SEO가 중요한건 각각 레코드 (상세페이지) 이므로 zustand에서 통으로 넣어 관리하면 되니 구현 및 데이터 신뢰도에서는 나아보이는데 하나바뀌면 전부 렌더링되니까 애매한거같고2번은 서버에서 모두 다 가져와서 초기속도는 빠르고 seo에 좋으나 zustand에 통으로 못넣고 데이터 자체를 내가 직접관리하는 구조라 구현 및 데이터 신뢰 측면에서는 골치아플거같은데… 무엇이 일반적인 구현방식인지 모르겠습니다. 도와주세요 ㅠㅠ