inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

로그인 버튼 클릭시 500에러 발생

미해결

Next + React Query로 SNS 서비스 만들기

아이디, 비밀번호를 입력하고 로그인 버튼을 누르면 500에러가 발생합니다. 9090 서버 포트는 잘 켜져있다고 뜨고, 코드 올리겠습니다. <auth.ts> import NextAuth from "next-auth"; import CredentialsProvider from "next-auth/providers/credentials"; import KakaoProvider from "next-auth/providers/kakao"; export const { handlers: { GET, POST }, auth, signIn, } = NextAuth({ pages: { signIn: "/i/flow/login", newUser: "i/flow/signup", }, providers: [ CredentialsProvider({ async authorize(credentials) { // credentials 안에 id창에서 입력하는 정보다 담겨있음 const authResponse = await fetch(`${process.env.AUTH_URL}/api/login`, { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ id: credentials.username, password: credentials.password, //next-auth의 credentials에는 username, password로 고정되어 있어서 이를 바꿔줌 }), }); //로그인 실패시 if (!authResponse.ok) { return null; } const user = await authResponse.json(); return user; }, }), //kakao로그인을 사용할때 // KakaoProvider(), ], }); <LoginModal.tsx> "use client"; import style from "@/app/(beforeLogin)/_component/login.module.css"; import { signIn } from "next-auth/react"; import { useRouter } from "next/navigation"; import { ChangeEventHandler, FormEventHandler, useState } from "react"; export default function LoginModal() { const [id, setId] = useState(""); const [password, setPassword] = useState(""); const [message, setMessage] = useState(""); const router = useRouter(); const onSubmit: FormEventHandler<HTMLFormElement> = async (e) => { e.preventDefault(); setMessage(""); try { await signIn("credentials", { username: id, password, redirect: false, }); //kakao, naver로 바꿀 수 있음 //client 일때는 next-auth/react의 signIn을 사용 //server 일때는 @/auth의 signIn을 사용 router.replace("/home"); } catch (error) { console.log(error); setMessage("아이디와 비밀번호가 일치하지 않습니다."); } }; const onClickClose = () => { router.back(); }; const onChangeId: ChangeEventHandler<HTMLInputElement> = (e) => { setId(e.target.value); }; const onChangePassword: ChangeEventHandler<HTMLInputElement> = (e) => { setPassword(e.target.value); }; return ( <div className={style.modalBackground}> <div className={style.modal}> <div className={style.modalHeader}> <button className={style.closeButton} onClick={onClickClose}> <svg width={24} viewBox="0 0 24 24" aria-hidden="true" className="r-18jsvk2 r-4qtqp9 r-yyyyoo r-z80fyv r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-19wmn03" > <g> <path d="M10.59 12L4.54 5.96l1.42-1.42L12 10.59l6.04-6.05 1.42 1.42L13.41 12l6.05 6.04-1.42 1.42L12 13.41l-6.04 6.05-1.42-1.42L10.59 12z"></path> </g> </svg> </button> <div>로그인하세요.</div> </div> <form onSubmit={onSubmit}> <div className={style.modalBody}> <div className={style.inputDiv}> <label className={style.inputLabel} htmlFor="id"> 아이디 </label> <input id="id" className={style.input} value={id} onChange={onChangeId} type="text" placeholder="" /> </div> <div className={style.inputDiv}> <label className={style.inputLabel} htmlFor="password"> 비밀번호 </label> <input id="password" className={style.input} value={password} onChange={onChangePassword} type="password" placeholder="" /> </div> </div> <div className={style.message}>{message}</div> <div className={style.modalFooter}> <button className={style.actionButton} disabled={!id && !password}> 로그인하기 </button> </div> </form> </div> </div> ); } <middleware.ts> export { auth as middleware } from "./auth"; export const config = { matcher: ["/compose/tweet", "/home", "/explore", "/messages", "/search"], }; <route.ts> export { GET, POST } from "@/auth"; 에러 내용 : TypeError: next_dist_server_web_exports_next_request__WEBPACK_IMPORTED_MODULE_0__ is not a constructor at reqWithEnvURL (webpack-internal:///(rsc)/./node_modules/next-auth/lib/env.js:15:12) at httpHandler (webpack-internal:///(rsc)/./node_modules/next-auth/index.js:139:139) at /Users/imhwarang/projects/zerocho/z-com/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:63815 at /Users/imhwarang/projects/zerocho/z-com/node_modules/next/dist/server/lib/trace/tracer.js:133:36 at NoopContextManager.with (/Users/imhwarang/projects/zerocho/z-com/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:7062) 너무 길어서 다 올릴수는 없네요 에러내용을

  • react
  • next.js
  • react-query
  • next-auth
  • msw
화랑 댓글 3 좋아요 0 조회수 1236

afterlogin beforelogin 로그인 분기처리 질문

미해결

Next + React Query로 SNS 서비스 만들기

안녕하세요. 디렉토리 구조를 afterlogin과 beforelogin구조로 나누어서 로그인을 분기치고 있고 auth.ts에서 서버로 부터 전달받은 토근값을 넣고 미들웨어에서 세션을 유무를 확인하여 login페이지로 리다이렉트 시키고 있습니다. afterlogin과 beforelogin으로 디렉토리가 어떤방식으로 나뉘는지 로직이 궁금합니다. 관련된 훅이 있는것인지?? 2. 실제 상용화된 서비스라고하면 로그인이 풀리는것을 방지하기 위해 BE로 토근값을 요청할텐데, 관련 로직은 어떤방식으로 구현하는게 좋은방법인지 요청드립니다.

  • react
  • next.js
  • react-query
  • next-auth
  • msw
댓글 1 좋아요 0 조회수 424

button과 checkbox 조건문과 함수

해결됨

5분빨리 퇴근하자! 파이썬 데이터 분석, 시각화, 웹 대시보드 제작하기

버튼과 체크박스 모두 조건문을 사용할 때는 바로 아래에 텍스트가 출력되는데, 함수를 사용하면 대시보드 맨 위에 텍스트가 호출되는 것은 왜 그런건가요?(맨 위에 텍스트가 호출되어 출력된 부분이 전부 다 한 칸 씩 밀리게 됨)

  • python
  • pandas
  • seaborn
  • plotly
  • matplotlib
  • data-visualization
  • streamlit
TEW_교육관리자 댓글 1 좋아요 0 조회수 329

riverpod 2 (async) notifier 사용?

미해결

[코드팩토리] [중급] Flutter 진짜 실전! 상태관리, 캐시관리, Code Generation, GoRouter, 인증로직 등 중수가 되기 위한 필수 스킬들!

https://riverpod.dev/ko/docs/migration/from_state_notifier riverpod 2 공식문서에 보면 Notifier/ AsyncNotifer 가 새롭게 도입되면서 StateNotifier는 더이상 사용되지 않는다고 나오는데 새로운 방식 강의 업데이트 안 해주시나요...?

  • flutter
  • 하이브리드-앱
DSC HUFS 댓글 1 좋아요 0 조회수 359

remote data source impl

해결됨

Flutter 중급 3편 - 의존성 주입 가이드

안녕하세요. 강의 잘 보고 있습니다. remote data source impl 관련해서 질문이 있습니다. @prod @Singleton(as: CommunityRemoteDataSource) class CommunityRemoteDataSourceApiImpl implements CommunityRemoteDataSource { final _dio = Session().dio; @override Future<CommunityResponseDTO> fetchCommunities() async { Response<dynamic> response = await _dio.get('get/community/path'); final responseDto = CommunityResponseDTO.fromJson(response.data); return responseDto; } } CommunityRemoteDataSource 의 구현체 CommunityRemoteDataSourceApiImpl 를 만들어서 사용중입니다. ApiImpl 은 실제 서버와 통신중 이며, http 라이브러리 Dio를 사용하고 있습니다. 여기서 테스트를 위해 DioMock 객체를 만들어서 사용하고자 합니다. 원래 CommunityRemoteDataSourceApiImpl 에 final _dio = Session().dio; 로 싱글턴으로 dio를 내부에 객체를 생성하고 있는데 이거를 주입받는 식으로 변경하여 테스트 시만 CommunityRemoteDataSourceApiImpl(DioMock()) 을 넣는 것인지, 아니면 CommunityRemoteDataSourceApiMockImpl 를 새로 또 만드는지 궁금합니다. 만약 CommunityRemoteDataSourceApiImpl(DioMock()) 로 주입을 받는 식이라면 Response<dynamic> response = await _dio.get('get/community/path'); final responseDto = CommunityResponseDTO.fromJson(response.data); 해당 코드들이 Dio() 일 때, DioMock() 일 때 달라야 할 것 같은데 어떻게 처리하는 것이 맞는지 궁금합니다. 감사합니다.

  • flutter
  • mvvm
  • provider
  • 클린-아키텍처
  • dependency
김보겸 댓글 1 좋아요 0 조회수 291

댓글 입력 후 FeedCardWidget의 FeedCcount 업데이트 관련

해결됨

Flutter로 SNS 앱 만들기

안녕하세요 댓글 입력 후 메인 화면 코멘트카운트가 업데이트 되지 않고 있습니다. CommentScreen에 callback 멤버 추가해서 하면 될것 같은데. 잘안되네요.. 도움 부탁드리겠습니다.

  • flutter
  • android
  • firebase
  • dart
이주한 댓글 1 좋아요 0 조회수 308

플러터 다트 질문

미해결

처음하는 플러터(Flutter) 기초부터 실전까지 [풀스택 Part4] (쉽고 견고하게 단계별로 다양한 프로젝트까지)

플러터 강의를 들으려고 하는데 로드맵대로 하지않고 바로 플러터를 들어도되나요? 플러터만 익히고싶고 파이썬부터 듣고싶진않아서요

  • flutter
  • dart
  • frontend
lkckss123 댓글 1 좋아요 0 조회수 319

MacOs, PostgreSQL16 설치, pgAdmin 4에서 connection 오류

미해결

Next + React Query로 SNS 서비스 만들기

비번 확실히 틀리지 않았는데 계속 오류 뜨길래, 완전 삭제후 다시 설치해서 비번 쉬운걸로 다시 설정하고 입력해도 계속 비번오류 뜹니다.

  • react
  • next.js
  • react-query
  • next-auth
  • msw
라푼젤 댓글 4 좋아요 2 조회수 1069

freezed JsonKey 사용 예시 공유

미해결

Flutter 중급 1편 - 클린 아키텍처

import 'package:freezed_annotation/freezed_annotation.dart'; part 'photo.freezed.dart'; part 'photo.g.dart'; @freezed class Photo with _$Photo { factory Photo({ required int id, required String tags, @JsonKey(name: 'previewURL') required String previewUrl, }) = _Photo; factory Photo.fromJson(Map<String, dynamic> json) => _$PhotoFromJson(json); }

  • flutter
  • ios
  • android
izar_dero 댓글 1 좋아요 1 조회수 804

파이썬에서의 재귀

해결됨

코딩테스트 [ ALL IN ONE ]

글에 두서가 없어도 양해 바랍니다 이 수업 수강 이전에 코딩 문제를 풀 때 파이썬으로 재귀함수를 사용했던 적이 있습니다. 그때 알게 된것이 파이썬의 재귀함수에는 기본적으로 깊이의 제한이 있다는 것입니다. sys.recursionlimit()으로 확인해보니 재귀호출을 1000이상 못하도록 값이 제한되어 있고 이 값을 늘려서 사용하는것은 별로 추천되는 방법이 아닌걸로 알고 있습니다. C언어 사용할때에는 속도면에서 제한도 없고 파이썬보다 속도도 월등하다보니 재귀를 자주 사용했었는데 파이썬에서 재귀함수로 풀어야 하는 경우가 있을까요?

  • python
  • 코딩-테스트
  • 알고리즘
댓글 2 좋아요 1 조회수 361

chilrdren, modal의 보여지는 원리가 제가 이해한 것이 맞을까요?

미해결

Next + React Query로 SNS 서비스 만들기

안녕하세요 제로초님. 인터넷창에 직접 주소를 입력하거나 새로고침 시 뒤에 배경화면이 사라지는 것에 대하여 질문있습니다. 먼저 <Link href='/i/flow/signup' className={styles.signup}> 를 클릭 시에는 인터셉터 라우팅이 트리거 되어 src/app/(beforeLogin)/layout.tsx 에 있는 children으로 인해 배경화면에 main컴포넌트가 보여지며 인터셉터된 @modal 은 modal부분에 보여집니다. 그런데 직접 주소창에 /i/flow/signup' 를 입력하여 접근하거나 새로고침하면 배경화면에 main컴포넌트가 사라지게 되는데 이것의 이유는 직접 접근할 때 인터셉에 걸리지 않게되고, childrend에는 i/flow에 있는 폴더들이 보여지며 defalut.tsx가 배경화면으로 보여지기 때문인가요?

  • react
  • next.js
  • react-query
  • next-auth
  • msw
김건희 댓글 1 좋아요 0 조회수 494

변수를 받는것은 상태변경이랑 상관이 없는건가요?

해결됨

[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!

8:22 에 Calendar를 스테이트풀에서 스테이트리스로 변경하시는데요. selectedDay, focusedDay등의 변수를 외부에서 받는데 이건 위젯 상태관리에 포함 되지 않는건가요?

  • flutter
  • 클론코딩
jihuniglong 댓글 2 좋아요 0 조회수 241

아이폰에서 APP 실행 안되는 현상

미해결

Flutter 중급 1편 - 클린 아키텍처

안녕하세요. 맥북에서 Android Studio와 아이폰간에 USB 케이블을 연결하여 앱 실행을 하면 아이폰에 Flutter APP 아이콘이 생깁니다. 그리고 USB 케이블이 연결된 상태에서는 화면이 활성화되어 있을 때에는 앱 실행이 잘 됩니다. 그런데 USB 케이블을 제거하고 APP을 실행하면 실행이 안됩니다. 이 문제를 해결하려면 어떤 조치를 해야 할까요?

  • flutter
  • ios
  • android
Link 댓글 1 좋아요 0 조회수 680

annot 수치 표현

해결됨

5분빨리 퇴근하자! 파이썬 데이터 분석, 시각화, 웹 대시보드 제작하기

age_bin_list = np.arange(10, 80, 10) df['age_bin'] = pd.cut(df['age'], bins = age_bin_list) pivot_df = df.pivot_table( index = 'age_bin', columns = 'region', values = 'charges', aggfunc = 'median' # 각 구간에 해당하는 값을 중간값을 사용하겠다. ) pivot_df # 각각의 값들에 대해 크기를 가늠할 수 있게끔 시각화(주로 색상)하는 방법 # 2D 형식으로 준비된 데이터를 Seaborn heatmap으로 시각화 # annot 인자를 통해 각 셀의 값 표현 가능 fig, ax = plt.subplots() sns.heatmap(pivot_df, ax = ax, annot = True) 코드 똑같이 따라했는데 왜 저는 표에 수치가 다 표현이 안되는 건가요?

  • python
  • pandas
  • seaborn
  • plotly
  • matplotlib
  • data-visualization
  • streamlit
TEW_교육관리자 댓글 1 좋아요 0 조회수 363

GoRouter 재빌드

미해결

[코드팩토리] [중급] Flutter 진짜 실전! 상태관리, 캐시관리, Code Generation, GoRouter, 인증로직 등 중수가 되기 위한 필수 스킬들!

리버팟 codegen을 쓰면서 강의를 듣다가 리버팟 codegen으로는 changeNotifier를 작성하지 못한다는 기사를 읽었습니다. 다음 코드에서 막혔습니다. @riverpod GoRouter goRouter(GoRouterRef ref) { final provider = ref.read(authProvider.notifier); final user = ref.watch(userMeProvider); return GoRouter( routes: provider.routes, initialLocation: '/splash', // refreshListenable: ???, redirect: (_, state) { return provider.redirectLogic(state); }, ); } 여기서 refreshListenable에 값을 넣어줘야 하는데 강의에서는 ChangeNotiferProvider로 했기 때문에 refreshListenable에 값을 넣어주는게 가능했는데 저는 codegen으로 하다보니 타입 에러가 뜨고 값을 넣어 줄 수가 없습니다. final user = ref.watch(userMeProvider); 이 코드를 넣어서 user의 상태가 바뀌면 고라우터를 재빌드 시켜서 리다이렉트 함수를 다시 실행시키려고 했는데, user의 상태가 UserModelLoading에서 UserModel로 분명히 바뀜에도 불구하고 고라우터가 재빌드가 안됩니다. print() 넣어서 확인했습니다. 그냥 리버팟 codegen 쓰지말고 v1처럼 하는게 나을까요? 아니면 refreshListenable에 넣어 줄 수 있는 다른 값이나 고라우터의 리다이렉트 함수를 또 실행시켜줄 장치가 있을까요?

  • flutter
  • 하이브리드-앱
진표 댓글 1 좋아요 0 조회수 295

CBV, FormView(폼 뷰)에 대해 알아보기 질문

해결됨

실리콘밸리 엔지니어가 가르치는 파이썬 장고 웹프로그래밍

안녕하세요 강사님 ㅎㅎ 현재 챕터도 이전과 같은 증상인데 어떻게 확인하면 좋을까요? Github snapshot: https://github.com/dimz119/learn-python-django/tree/form_view 에서 다운받아서 실행시켜도 제가 작성한 코드랑 똑같은 문제가 발생하는데 확인할수있는 방법이있을까요??

  • python
  • django
  • bootstrap
  • rest-api
  • drf
chicmania 댓글 1 좋아요 1 조회수 332

비디오플레이어 강의 / initialize 함수의 쓰임?

미해결

[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!

비디오플레이어 강의 중 이 부분에서 질문할 것이 많습니다... 질문1. initialize() 함수가 컨트롤러를 초기화하는 함수라고 말씀하셨는데, 바로 윗 줄에서 컨트롤러가 관리할 파일을 고른 것 아닌가요? 바로 초기화시키는 이유가 궁금합니다. 질문2. initState안에서 어떻게 바로 setState를 실행시킬 수 있는지 궁금합니다. setState는 build가 실행된 후 clean인 상태에서만 실행할 수 있는 것 아닌가요? 질문3. 질문2와 이어지는 질문인데요, 이 전체적인 state의 라이프사이클이 어떻게 돌아가는지 궁금합니다. 이 전 프로젝트까지는 어찌어찌 잘 따라왔는데 갑자기 벽에 막힌 기분이네요 ㅜㅜ 긴 글 읽어주셔서 감사합니다.

  • flutter
  • 클론코딩
kimmeanseo 댓글 1 좋아요 0 조회수 284

파이썬 이미지 크롤링이 안돼요..

미해결

url = " https://image.dcinside.com/viewimage.php?id=&no=24b0d769e1d32ca73de985fa11d02831f8aadc88aabcff47e8021605d37bf1436ebb78a575eb9e18042afbf9848bfd403905acb77b9ac250540b76e4781bf2 " # 헤더 추가 headers = { 'User-Agent' : 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36' , } # 이미지 다운로드 response = requests . get ( url , headers = headers ) print ( response . content ) img_data = BytesIO ( response . content ) # BytesIO 객체에서 이미지 열기 img = Image . open ( img_data ) # 이미지 저장 (optional) img . save ( "downloaded_image.jpg" ) response.content를 출력하면 b'' 이 값을 출력하게 되는데 원인을 잘 모르겠습니다.

  • python
  • 파이썬
  • 크롤링
  • crawling\
댓글 1 좋아요 1 조회수 675

riverpod v2 관련 질문

미해결

[코드팩토리] [중급] Flutter 진짜 실전! 상태관리, 캐시관리, Code Generation, GoRouter, 인증로직 등 중수가 되기 위한 필수 스킬들!

안녕하세요 저는 강의처럼 리버팟 v1이 아닌 어노테이션을 사용하는 v2버전으로 코딩을 하며 배우는 중입니다. 그리고 강의처럼 클래스 안에 변수를 선언해서 생성자를 통해 레포지토리를 받는걸 하려고 합니다. @riverpod class UserMe extends _$UserMe { final UserMeRepository repo; UserMe({ required this.repo, }); @override UserModelBase? build() { return UserModelLoading(); } } 이후 user_me_privder.g.dart를 보면 빨간줄이 보입니다. 저 빨간줄에 커서 가져다 대면 The argument type 'UserMe Function({required UserMeRepository repo})' can't be assigned to the parameter type 'UserMe Function()'. 요런 메세지가 뜹니다. 해결방법이 있을까요?

  • flutter
  • 하이브리드-앱
진표 댓글 1 좋아요 0 조회수 260

인기 태그

인프런 TOP Writers

주간 인기글