nwwn10044507

디자인을 다른것으로 대체하거나(emotion이나 Styped-componenent같은 CSS in JS) 디자인 신경 끄고 개발건에 집중해서 공부하겠다 하면 tailwindCSS 사용 안해도 됩니다.

tailwindCss 꼭 사용해야하나요?

회원가입 요청 후 한참뒤에 찍힌 로그입니다. 아래 첨부한 이미지에 const signInResult의 값이 찍히지 않습니다. Next-auth에서 처리하는 signIn의 status와 responser값까지는 찍히고 SignIn부분의 로그는 안찍혀요 201{id: 'zr',nickname: 'zr',image: '/upload/scr-2024-02-214.07.171709446258471.png'}[auth][error] CallbackRouteError: Read more at https://errors.authjs.dev#callbackrouteerror[auth][cause]: TypeError: fetch failedat node:internal/deps/undici/undici:12345:11[auth][details]: {"name": "HeadersTimeoutError","code": "UND_ERR_HEADERS_TIMEOUT","message": "Headers Timeout Error","provider": "credentials"}CallbackRouteError: Read more at https://errors.authjs.dev#callbackrouteerrorat Module.callback (webpack-internal:///(action-browser)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/callback/index.js:437:23)at async AuthInternal (webpack-internal:///(action-browser)/./node_modules/next-auth/node_modules/@auth/core/lib/index.js:67:24)at async Auth (webpack-internal:///(action-browser)/./node_modules/next-auth/node_modules/@auth/core/index.js:126:34)at async signIn (webpack-internal:///(action-browser)/./node_modules/next-auth/lib/actions.js:57:17)at async $$ACTION_0 (webpack-internal:///(action-browser)/./src/app/(beforeLogin)/_lib/signup.ts:54:30)at async /Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:38:489at async tX (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:37:5313)at async rl (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:38:23339)at async doRender (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/server/base-server.js:1406:30)at async cacheEntry.responseCache.get.routeKind (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/server/base-server.js:1567:28)at async DevServer.renderToResponseWithComponentsImpl (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/server/base-server.js:1475:28)at async DevServer.renderPageComponent (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/server/base-server.js:1852:24)at async DevServer.renderToResponseImpl (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/server/base-server.js:1890:32)at async DevServer.pipeImpl (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/server/base-server.js:902:25)at async NextNodeServer.handleCatchallRenderRequest (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/server/next-server.js:266:17)at async DevServer.handleRequestImpl (/Users/jungjuyoung/dev/next-app-router-z/ch4/node_modules/next/dist/server/base-server.js:798:17) {type: 'CallbackRouteError',kind: 'error',[cause]: {err: TypeError: fetch failedat node:internal/deps/undici/undici:12345:11 {cause: [HeadersTimeoutError]},name: 'HeadersTimeoutError',code: 'UND_ERR_HEADERS_TIMEOUT',message: 'Headers Timeout Error',provider: 'credentials'}}

회원가입-status 201 Ok- 리다이렉트 안되는 현상

맥북 포맷해서 다시 재설치해도 postgresql 똑같이 비번틀리다고 나오네요 ㅠㅜ (일부러 비번도 쉬운걸로 설정해놨는데....)

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

<pre><code class="language-typescript">auth.ts파일

import NextAuth from "next-auth"
import CredentialsProvider from "next-auth/providers/credentials";
import { NextResponse } from "next/server";

export const {
 handlers: { GET, POST },
 auth,
 signIn,
} = NextAuth({
 pages: {
 signIn: '/i/flow/login',
 newUser: '/i/flow/signup',
 },
 providers: [
 CredentialsProvider({
 async authorize(credentials) {
 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,
 }),
 })
console.log('[auth] CredentialsProvider authResponse: ',authResponse)
 if (!authResponse.ok) {
 return null
 }

 const user = await authResponse.json()
 console.log('user', user);
 return {
 email: user.id,
 name: user.nickname,
 image: user.image,
 ...user,
 }
 },
 }),
 ]
});</code></pre>

[CallbackRouter Error] 회원가입->DB입력 성공-> 자동로그인 안됨

<pre><code class="language-typescript">signup파일

"use server";

import { redirect } from "next/navigation";
import { signIn } from "@/auth";

export default async function onSubmit(prevState: any, formData: FormData) {
 if (!formData.get('id') || !(formData.get('id') as string)?.trim()) {
 return { message: 'no_id' };
 }
 if (!formData.get('name') || !(formData.get('name') as string)?.trim()) {
 return { message: 'no_name' };
 }
 if (!formData.get('password') || !(formData.get('password') as string)?.trim()) {
 return { message: 'no_password' };
 }
 if (!formData.get('image')) {
 return { message: 'no_image' };
 }
 formData.set('nickname',formData.get('name') as string);
 
 let shouldRedirect = false;
 try {
 const response = await fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/users`, {
 method: 'post',
 body: formData,
 credentials: 'include',
 })
 console.log(response.status);
 if (response.status === 403) {
 return { message: 'user_exists' };
 }
 console.log('response: ', await response.json())
 shouldRedirect = true;
 await signIn("credentials", {
 username: formData.get('id'),
 password: formData.get('password'),
 redirect: false,
 })
 console.log('signIn shouldRedirect: ',shouldRedirect)
 } catch (err) {
 console.error(err);
 return;
 }

 if (shouldRedirect) {
 redirect('/home'); // try/catch문 안에서 X
 }
}</code></pre>

Generics(2) 에서 배운것을 응용하여 첫시간에 배운 객체의 동적할당 부분을 구현하고 싶습니다.

쭁님 답변감사합니다.
"아이티테스트"가 뭔가요?

integration 테스트시, 몽고디비에 데이트 업데이트 되는 이유.

글쓴이님 react-router가 버전이 6으로 올라가면서 문법이 바뀐거 같습니다. Switch-> Routes Route->Routes의 직속자식으로 변경
Component->element로 변경 콤포넌트로 임폴트
<img title="스크린샷 2021-12-25 오후 4.59.23.png" src="https://cdn.inflearn.com/public/files/posts/d95f6dfb-1a4c-4437-83e3-ce8ea6880feb/스크린샷 2021-12-25 오후 4.59.23.png" alt="" width="500" height="325" />

react-router-dom 문제....

오 감사합니다 저도 똑같은 에러 났는데 덕분에 해결했어요&nbsp;

back에서 npm i 했을 때 오류가 납니다..

John&nbsp;<span style="color: #212529; font-family: 'Noto Sans KR', -apple-system, 'system-ui', 'system-ui', 'Apple SD Gothic Neo', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', Helvetica; font-size: 14px; font-weight: bold; background-color: #fdfdfd;">Ahn님&nbsp;저도 윗댓글 쓴님과 동일하게 이해했는데, 유닛테스트 할때 postman에서 api 날릴때 부터 DB에 생성되더라구요. 근데&nbsp; 생각해보면&nbsp; 우리가 구현한것이 잘 동작하는지 확인하려면 DB에 생성되는거 까지 확인하는게 맞는것이 아닌가 생각이 들더라구요.&nbsp; 왜냐면 실제로 만들어서 돌아가?는것은 DB에 잘 생성되야하고, DB에 생성된걸 읽어와야하고, DB에 생성된 데이터를 업데이트 해야하고, DB에 생성된 데이터를 삭제하려면, 우선 DB에 데이터가 생성되는거 까지 확인하는게 맞지 않나 싶습은데 잘못 이해하고 있는건가요?

nwwn10044507

Bài viết