안녕하세요 강의 수강 후에 자체 프로젝트를 진행하고 있는데 소셜 로그인 처리 중 궁금한 점이 있어 질문 드립니다. 기존에는 Google, Naver, Kakao, Facebook 등 5가지 소셜 로그인을 각각 OAuth 리디렉션 방식으로 구현했으나, 이번에는 NextAuth를 활용하여 간편하게 통합적으로 구현하려고 합니다. 소셜 로그인은 authorization code 발급용으로만 사용하고 실제 access, refresh token 발급은 자체 서버에서 처리를 하려고 합니다. 따라서 인가 과정만 next auth를 활용하고 callbacks 내부에서 인가 코드를 전달하여 access token 발급 과정을 진행하려 했습니다. /api/auth/[...nextauth]/route.ts const authOptions = { // Configure one or more authentication providers providers: [ GoogleProvider({ clientId: process.env.GOOGLE_ID ?? "", clientSecret: process.env.GOOGLE_SECRET ?? "", }), ], callbacks: { async signIn({ account, profile }: any) { if (account.provider === "google") { const response = await fetch( `${process.env.GATEWAY_SERVER_URL}/auth/v1`, { method: "POST", headers: { "Content-Type": "application/json", devicetype: "1", }, body: JSON.stringify({ sns_type: "GOOGLE", key: 인가코드, }), } ); } return true; // Do different verification for other providers that don't have `email_verified` }, }, }; const handler = NextAuth(authOptions); export { handler as GET, handler as POST }; 하지만 알아본 결과 NextAuth의 callbacks에서는 access token이 발급되고 authorization code는 받을 수 없게 되어있는 것 같은데 authorization code 발급용으로만 사용하기에는 next auth를 사용하는것이 적합하지 않은 것인지 궁금합니다. 또한 authorization code를 받을 수 있는 방법이 있다면 알려주시면 감사하겠습니다!
안녕하세요 강사님. 리액트를 배울때, 컴포넌트 내에서 object를 초기화하면 성능 문제가 생길 수 있다고 배웠습니다. 근데, [2-4] 네비게이션 타이핑 강의(1:29)를 보면, function AuthStackNavigator() { const Stack = createStackNavigator(); return (~~) } 와 같이, 컴포넌트 내부에 Stack이 선언되어 있습니다. 이러면 화면이 재랜더링 될 때 마다, Stack이 선언되어 성능문제가 생기는건 아닌가요?
❗ 질문 작성시 꼭 참고해주세요 최대한 상세히 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주셔야 그만큼 자세히 답변드릴 수 있습니다. 맥/윈도우, 안드로이드/iOS, 버전 등의 개발환경 도 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요! 로그아웃 클릭 후 로그인 및 회원가입 버튼누르면 아래처럼 로그아웃안된것처럼 나오며 아래처럼 Warning로그가나오는데 혹시 이게문제인가요?? 구글찾아봐도 해결이안되서 게시판에 글 올립니다 ㅠㅠ
"[1-2] 맥-IOS 환경 설정"을 보고 있습니다. 저는 node를 설치하지 않고, nvm만 설치해서 사용하고 있는데요. 강사님께서는 brew install node 이후에 nvm을 설치하시네요. 저는 이렇게 하면 글로벌 node가 있고, nvm도 있는거라 혹시 꼬일까봐 node 설치 없이 nvm만 설치했는데요. 강사님 의견도 궁금합니다.
마커찍을때 위경도 가져오는걸로 알고있는데, 그때 지올로케이션 사용했엇거든요 라이브러리 근데 화면 내려갈때나 다른앱 사용할떄 백그라운드 환경으로 변하잖아요 근데 내가 그떄동안 걷고있으면 걷고있던길을 색으로 칠하고 싶다면 백그라운드에서도 해당 위도 경도를 받아와야하는데 즉 백그라인드에서 데이터 받을수있는 부분 강의에있나요 ?
영상을 3:29 이 부분을 똑같이 하려고하는데, http://localhost:3000/home 로 접속하면 파일이 없다고 합니다.. app 안에 (afterLogin) (beforeLogin)로 나뉘고, home 폴더를 만들어서 layout.tsx 와 page.tsx를 만들어 홈페이지와 홈 레이아웃을 작성하여 루트 레이아웃과 층계별 확인하려고 http://localhost:3000/ 를 들어가면 루트레이아웃은 잘나오는데 http://localhost:3000/home 는 페이지가 없다고 나옵니다.. (afterLogin) 안이 아니라 밖으로 app/home/layout.tsx 와 page.tsx가 있어야만 http://localhost:3000/home 가 잘나오는데 왜이럴까요?
failed to retrieve generated types: {"message":"Your account does not have the necessary privileges to access this endpoint. For more details, refer to our documentation https://supabase.com/docs/guides/platform/access-control "} generate-types씨 발생하는 에러 해결방법이 궁금합니다.
채팅을 계속 올려서 몇개월 치를 사용자가 본다면 위로 채팅 기록이 엄청 쌓일텐데, 실무에서 메모리가 넘치는걸 방지하는 방법으로 사용하시는게 있는지 어떤걸 사용하시는지 궁금합니다. 찾아보니 react-window 같은 라이브러리를 사용해서 실제 랜더링 하는 요소 갯수를 제한하고 스크롤을 유지 시켜서 성능 향상을 하는 글을 봤습니다. 실제로 실무에서 이런 방법을 주로 쓰는지 궁금합니다.
회원가입 페이지 에서 프로필 이미지를 한글이 포함된 이미지명로 업로드했을때 , nextjs의 서버 Formdata에서 한글 파일명이 깨지는 현상 이 있습니다. 해결방법이 있을까요?? Step1. 회원가입 페이지 Step2. 서버 에러 결과 회원가입 페이지 경로 : D:\z-com\src\app\(beforeLogin)\_lib\signup.ts 업로드시 한글 파일명 출력 확인을 위해 아래코드를 추가해봤습니다. formData.getAll("image").map((data, idx) => { console.log(data); }); 업로드 이미지명에 한글이 포함되었을때 출력 -- 한글파일명이 깨져서 출력되고 데이터베이스에 저장됩니다.
안녕하세요. 이 인강을 듣기 전에는 db에 데이터를 GET 하고 POST하기 위해서는 Rest API를 통해서 했었습니다. 하지만 이 강의에서는 supabase를 통해서 create,select 등을 이용해서 data를 다루던데 supabase를 통해서는 rest api를 통해서 data를 만들고, 가지고올수도 있나요? 만약 둘다 된다면 어떤 방식을 통해서 주로 data를 다루는게 좋을까요? 현업에서는 어떤 방식을 더 추구하나요? 현재 대학생이라 개인플젝을 할때 db가 필요해서 강의를 오늘부터 듣게되었는데 db를 어떻게 다뤄야할지 감이 안잡히네요. 아직 개념이 좀 잡히지 않아서 헷갈립니다. 추가적으로 저는 팀이나 , 특히 개인프로젝트를 하면서 사용자 정보(id,pw)나 여러 데이터들을 저장하고 싶어서 mongodb를 혼자서 공부하다가 어려워서 여러가지를 찾던 중 supabase(serverless)를 알게되어서 강의를 듣고있습니다. 하지만 그냥 mongodb를 공부해서 db를 다루는게 나은지 아니면 supabase를 공부해서 db를 저장하는게 나은지 잘 모르겠습니다. 긴 글 읽어주셔서 감사합니다..!
혹시 Next.js에서 Link태그와 useRouter를 제공하고 있는데 서로 차이점이 있을까요?? 이미지나 버튼이 있으면 거기에 onClick 달고 라우터 쓰고 있긴한데 이미지나 버튼에 링크를 감싸버리면 뭔가 이상할 것 같아서 어떤식으로 쓰면 좋을까요 <Link href="/" ><Image ... /></Link> <Image ... onClick={()=>router.push("/")} />
강사님, 최근에 강사님 강의를 듣고, 실제 프로젝트를 진행하면서 앱 배포 관련해서 이런저런 공부를 하고 있는데 궁금한 점이 생겨 질문드립니다. XCode 에서 BundleIdentifier을 com.xxx .xxxx 이런식으로 제공해주고 있는데. 해당 부분을 URL Scheme으로 활용하여 네이버 로그인을 개발 중에 있습니다. 이 부분을, 그럼 @implementation AppDelegate - (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options { if([RNKakaoLogins isKakaoTalkLoginUrl:url]) { return [RNKakaoLogins handleOpenUrl: url]; } if ([url.scheme isEqualToString:@"{{ CUSTOM URL SCHEME }}"]) { return [[NaverThirdPartyLoginConnection getSharedInstance] application:app openURL:url options:options]; } return NO; } CUSTOM URL SCHEME을 BundleIdentifier로 사용해도 괜찮은지 여부와, 해당 값을 환경변수 처리 없이, 공개적으로 적용해도 되는지 아래와 같이 입니다. if ([url.scheme isEqualToString:@"com.matzip"]) { return [[NaverThirdPartyLoginConnection getSharedInstance] application:app openURL:url options:options]; } return NO; } 혹시 만약에 되지 않는다면 AppDelegate.mm 에서 환경변수를 처리하는 방법과, 소셜 로그인시 필요한 URL Scheme은 보통 현업에서 어떠한 식으로 선정하여 처리하는지 궁금하여 질문드립니다.
안녕하세요, 강사님, 강사님 강의를 들으며, 개인적인 프로젝트를 RN으로 진행중에 비슷한 상황이 발생하여 질문을 남겨봅니다. 아이콘같은 경우도, 이전에 잘 동작하다가 빌드 후, 에러가 발생하면 빌드 페이즈에 추가로 파일을 넣어서 해결하였습니다. 이번에 제가 추가한 폰트도, 이전에 잘 동작하다가, 해당 브랜치를 develop에 머지한 후, 새로 다른 브랜치를 만들어 작업중인데, 이전에 잘 동작했지만 동작하지 않습니다. 빌드 페이즈에 들어가있는걸 확인했는데 잘 동작하지 않는 경우는 어떻게 해결할지 의견을 구하고자 질문을 남깁니다.
❗ 질문 작성시 꼭 참고해주세요 최대한 상세히 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주셔야 그만큼 자세히 답변드릴 수 있습니다. 맥/윈도우, 안드로이드/iOS, 버전 등의 개발환경 도 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요! 안녕하세요. vs code 터미널에서 안드로이드 시뮬레이터를 켜기위해 $ npx react-native run-android를 실행하면 error Failed to install the app. Make sure you have an Android emulator running or a device connected. 디바이스가 연결되어있는지 확인하라고 뜨고 Android Studio 를 켜서 virtual deivce manager 에서 디바이스를 연결해놓고 하면 잘되는데 원래 Android Studio에서 디바이스를 연결해놓고 $ npx react-native run-android 를 실행하는게 맞는건가해서요.
