다른 수강생분들에게도 문제 해결에 도움을 줄 수 있도록 좋은 질문을 남겨봅시다 :) 1. 질문은 문제 상황을 최대한 표현해주세요.2. 구체적이고 최대한 맥락을 알려줄 수 있도록 질문을 남겨 주실수록 좋습니다. 그렇지 않으면 답변을 얻는데 시간이 오래걸릴 수 있습니다 ㅠㅠex) A라는 상황에서 B라는 문제가 있었고 이에 C라는 시도를 해봤는데 되지 않았다!3. 먼저 유사한 질문이 있었는지 꼭 검색해주세요!

안녕하세요 제로초님람다 런타임 설정 편집부분 화면이 좀 바뀐거같아서 질문 남깁니다! 저는 이렇게 보입니다일단 index를 exports로 바꿨는데 이대로 그냥 저장하고,진행했더니 thumb파일도 안만들어지고 이미지도 평소에 잘뜨던게 undefined로 떠서 문제를 찾아보고 있었습니다

안녕하세요! 섹터 52이후 수업을 진행하는데자꾸 비쥬얼 스튜디오 터미널에 jwt must be provided: {"response":{"errors":[{"message":"jwt must be provided","locations":[{"line":3,"column":9}],"path":["restoreAccessToken"],"extensions":{"code":"INTERNAL_SERVER_ERROR","exception":{"name":"JsonWebTokenError","message":"jwt must be provided","stacktrace":["JsonWebTokenError: jwt must be provided"," at Object.module.exports [as verify] (/codecamp_backend_api/node_modules/jsonwebtoken/verify.js:53:17)"," at RestoreAccessTokenService.createAccessToken (/codecamp_backend_api/dist/api/token/services/mutation/restoreAccessToken.service.js:38:31)"," at runMicrotasks (<anonymous>)"," at processTicksAndRejections (internal/process/task_queues.js:93:5)"]}}}],"data":null,"status":200,"headers":{}},"request":{"query":"\n mutation {\n restoreAccessToken {\n accessToken\n }\n }\n"}}라는 오류가 뜹니다 getAccessToken.ts 부문 뮤테이션에서 오류 나는거 같은데 혹시 왜이러는지 알 수 있을까요?

안녕하세요 선생님 이번에 쇼핑몰 강의가 업데이트가 되었길래 강의를 들어보려고 합니다그런데 제가 도커 강의도 한번 들어보고 싶은데 도커에 도자도 모르는 상태인데 수업을 따라갈만 할까요?? 항상 좋은 강의 감사합니다

안녕하세요 제로초님 저는 폴더 구조를 한 폴더안에 프론트 백엔드 담겨있지않고 다 따로 두고 있는데 그럴경우에 람다도 따로 보관해도 되는지 궁금합니다 아니면 지금 임시로 백엔드 폴더 안에 두고 진행하고있는데 괜찮은지 궁금합니다!

Environment- Synology NAS - code-server - MySQL(mariaDB) - Node.js@latest | v18.16.0 - npm@latest | v9.5.1 - nvm@latest | v0.39.3sequelize 사용 시, 로컬이 아닌 외부 DB에 연결하는 경우저 같은 경우, Synology NAS로 code-server를 사용하고 있습니다. 저와 비슷한 환경에서 개발하시는 경우, 포트 설정에 애먹으시는 분 있을까봐 메모 납깁니다.db의 port를 방화벽에서 해제하기해당 포트 포트포워딩(공유기)참고로, phpMyAdmin이나 WorkBench에서 외부 DB에 접근이 가능한데, squelize로 접근하면 ERROR: connect ETIMEDOUT과 같은 메시지가 출력되는 경우가 있는데, 저는 아래 방법으로 해결할 수 있었습니다.(위 에러메시지는 host는 찾았지만 DB를 찾지 못했거나, DB가 있어도 접근할 수 없을 때 출력된다고 합니다.){ "development": { "username": "slackk", "password": process.env.DB_PASSWORD, "database": "slack-db", "host": "***.***.***.***", //IP "port": 3307, //source|target 다를 경우 별도로 지정 "dialect": "mysql" } }port를 별도로 지정해주어야 합니다. ERROR: getaddrinfo ENOTFOUND {IP address} 메시지가 출력되는 경우host에 입력한 주소 문제입니다.

App.tsximport React, { FC } from 'react'; import loadable from '@loadable/component'; import { Switch, Route, Redirect } from 'react-router'; const Login = loadable(() => import('@pages/Login')); const SignUp = loadable(() => import('@pages/SignUp')); const Channel = loadable(() => import('@pages/Channel')); const App: FC = () => { return ( <Switch> <Redirect exact path="/" to="/login" /> <Route path="/login" component={Login} /> <Route path="/signUp" component={SignUp} /> <Route path="/workspace/channel" component={Channel} /> </Switch> ); }; export default App;  Login/ index.tsximport React, { useState, useCallback } from 'react'; import useInput from '@pages/hooks/useinput'; import axios from 'axios'; import { Error, Form, Label, Input, LinkContainer, Button, Header } from '@pages/SignUp/styles'; import { Link, Redirect } from 'react-router-dom'; import useSWR from 'swr'; import fetcher from '@utils/fetcher'; const Login = () => { const { data, error, revalidate } = useSWR('http://localhost:3095/api/users', fetcher); //주소를 fetcher로 옮겨주고 실제로 주소를 어떻게 처리할지 정해줌 const [logInError, setLogInError] = useState(false); const [email, onChangeEmail] = useInput(''); const [password, onChangePassword] = useInput(''); const onSubmit = useCallback( (e) => { e.preventDefault(); setLogInError(false); axios .post( 'http://localhost:3095/api/users/login', { email, password }, { withCredentials: true, }, ) .then(() => { revalidate(); }) .catch((error) => { setLogInError(error.response?.data?.statusCode === 401); }); }, [email, password], ); if (data) { return <Redirect to="/workspace/channel" />; }Channel / index.tsximport Workspace from '@layouts/Workspace'; import React from 'react'; const Channel = () => { return ( <Workspace> <div>로그인을 축하합니다.</div> </Workspace> ); }; export default Channel; Workspace.tsximport React, { FC, useCallback } from 'react'; import useSWR from 'swr'; import fetcher from '@utils/fetcher'; import axios from 'axios'; import { Redirect } from 'react-router'; const Workspace: FC = ({ children }) => { const { data, error, revalidate } = useSWR('http://localhost:3095/api/users', fetcher); const onLogout = useCallback(() => { axios .post('http://localhost:3095/api/users/logout', null, { withCredentials: true, }) .then(() => { revalidate(); }); }, []); if (!data) { return <Redirect to="/login" />; } return ( <div> <button onClick={onLogout}>로그아웃</button> {children} </div> ); }; export default Workspace;  현재 코드에서 로그인 성공까지 되는데 페이지 이동이 없습니다... 하나하나 빠짐없이 확인 해봤는데 제가 찾지 못하는거 같습니다 ㅠㅠ더군다나 URl 주소를 다이렉트로 localhost:3090/workspace/channel 입력해도 아무런 창이 뜨지 않고 있어서 어떤 문제가 있는지 확인이 어렵습니다.. 도움을 부탁드려요

좋은 강의 너무 감사드립니다. 강의 10:40 부분에 useParams 사용하는 부분에서:const params = useParams();console.log(params); 이거 입력한 후에 리프레쉬 한후 각자 아이템을 누르면, 밑에 화면이 뜹니다. 뭐가 잘못된 건지 잘 모르겠어요..

Minor 한 이슈 질문드립니다. (부트스트랩CSS 라서요..ㅎㅎ)우선 해결은 했으나, 왜 해결됬는지 이해가 안되서질문내용: 테이블부분이 꽉차지 않은 이슈댓글내용에 적어놨습니다. layout.html 에 부트스트랩 워치 테마적용(CSS) 부분 수강중 입니다.위 이미지 처럼 꽉찬 화면이 저만 안되는데(???) 이유를 모르겠습니다. (해당화면 스크롤은 질문캡쳐용으로 잠시 zoom out 한 상태입니다.)서버재시작브라우저 강제 새로고침강사님과 동일한 테마(simplex) 도 안되고 있습니다.<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootswatch@4.5.2/dist/sketchy/bootstrap.min.css" integrity="sha384-RxqHG2ilm4r6aFRpGmBbGTjsqwfqHOKy1ArsMhHusnRO47jcGqpIQqlQK/kmGy9R" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script>layout.html 전체코드<!doctype html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>{% block title %}{% endblock title %}</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootswatch@4.5.2/dist/sketchy/bootstrap.min.css" integrity="sha384-RxqHG2ilm4r6aFRpGmBbGTjsqwfqHOKy1ArsMhHusnRO47jcGqpIQqlQK/kmGy9R" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script> <style> body{ padding-top: 5rem; } </style> </head> <body> <!-- begin::header --> <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top"> <a class="navbar-brand" href="#">Navbar</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarsExampleDefault"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a> <div class="dropdown-menu" aria-labelledby="dropdown01"> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Another action</a> <a class="dropdown-item" href="#">Something else here</a> </div> </li> </ul> <form class="form-inline my-2 my-lg-0"> <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search"> <button class="btn btn-secondary my-2 my-sm-0" type="submit">Search</button> </form> </div> </nav> <!-- end::header --> {% block content %} {% endblock content %} </body> </html> post_list.html 전체코드{% extends "instagram/layout.html" %} {% load bootstrap4 %} {% block title %} Instagram / Post List {% endblock title %} {% block content %} <form action="" method="get"> <label> <input type="text" name="q" value="{{ q }}" placeholder="검색할 게시물의 message를 입력하세요"> </label> <input type="submit" value="검색 "> </form> {% if post_list %} <table class="table table-bordered table-hover table-striped table-responsive"> <tbody> {% for post in post_list %} <tr> <td>{{ post.pk }}</td> <td> {% if post.photo %} <img src="{{ post.photo.url }}" width="100px" height="100px" alt="{{ post.photo }}"> <br> (post.photo값: {{ post.photo }}) {% else %} No photo <br> (post.photo값: {{ post.photo }}) {% endif %} </td> <td> <!-- 장고 스타일(URL Reverse / get_absolute_url 메서드 이용) --> <a href="{{ post.get_absolute_url }}"> {{ post.message }} </a> <!-- 장고 스타일(URL Reverse 이용) --> {# <a href="{% url 'instagram:post_detail' post.pk %}">#} {# {{ post.message }}#} {# </a>#} <!-- 기존 --> {# <a href="/instagram/{{ post.pk }}/">#} {# {{ post.message }}#} {# </a>#} </td> </tr> {% endfor %} </tbody> </table> {% else %} <p>검색 결과가 없습니다.</p> {% endif %} {% if is_paginated %} {% bootstrap_pagination page_obj size="large" justify_content="center" %} <h2>paginator</h2> <div> {{ paginator }} </div> <h2>page_obj</h2> <div> {{ page_obj }} </div> <h2>is_paginated</h2> <div> {{ is_paginated }} </div> <h2>object_list</h2> <div> {{ object_list }} </div> <h2>post_list</h2> <div> {{ post_list }} </div> {% endif %} {% endblock content %}   

만약에 닉네임을 name[react](23) 라고 지었고, id가 20이라면data.content는 @[name[react](23)](20) 이런식으로 되잖아요. 그런데 거기서 코드에 있는 정규표현식을 쓰면 match는](1) 부분을 빼먹게 되고 그 상태에서 arr을 구하면닉네임이 name[react 으로, id는 1이 아닌23으로 출력되더라고요. 실제로 예시와 똑같이 회원가입 하고 name[react](23)에게 멘션 해보니클릭했을 때 초깃값으로 파란줄이 name[react 까지만 생성되고 추가로 ](20) 이란 텍스트가 더해지더라고요. (참고로 name[react](23)의 ID가 20입니다.)물론 Link로 넘어가는 것도 안되고요. 그래서 +? 말고 그냥 +로 해보니깐 위처럼 잘 매칭 되는 것 같아서 코드에 적용시켰더니이제 Link부분은 잘 나오는데 멘션 클릭시 초깃값이 여전히 이상하게 나옵니다. 저 부분은 어딜 고쳐야 되는 건가요?  

Axios 를 다운 받을때, 꼭 특정한 폴더에서 받아야 하는 건가요? Node-modules 랑 json.package 가 public 폴더 밑으로 또 생겨있고, nom start 누르면 Axios error 라고 뜹니다.

settings 를 common, dev, prod 3개로 만들고 부터 안되는데 무슨 문제일까요

커뮤니티 리스트 ui생성 강의 부분에서 맨앞 내용에서 상위 커뮤니티 데이터를 가져오는 부분이const {data: topsubs} = useSWR<Sub[]>(address,fetcher) 부분 undefined가 나오네요 ㅠ 소스코드가 확인해서 오타도 확인해봤는데 원인을 찾지못했습니다. 혹시 짐작가는 부분이 있으시나요?

사이트에 연결할 수 없음127.0.0.1에서 연결을 거부했습니다.다음 방법을 시도해 보세요.연결 확인프록시 및 방화벽 확인ERR_CONNECTION_REFUSED 그전에 연결 잘되다가 갑자기 이러는 이유가 멀까요..?

function useInterval(callback, delay) { const savedCallback = useRef(); //useEffect(() => { savedCallback.current = callback; //}); useEffect(() => { function tick() { savedCallback.current(); } if (delay !== null) { let id = setInterval(tick, delay); return () => clearInterval(id); } }, [delay]); return savedCallback.current; } deps를 주지 않은 useEffect는 렌더링될때마다 실행되는 것으로 알고 있습니다useEffect로 감싸주든 안 감싸주든savedCallback.current = callback 코드는 렌더링될때마다 실행되는데useEffect로 감싸준 이유가 궁금합니다! 

강의부분에const weatherDataActive = function({location, weather}){ const locationNameTag = document.querySelector('#location-name-tag'); locationNameTag.textContent = location; console.log(weather); document.body.style.backgroundImage = `url('./images/${weather}.jpg')` };이 부분을 제가 똑같이 따라했는데요 노션에 있는 사진 자료 그대로 다운받았고선생님이 말씀하신 경로에 똑같이 담았는데document.body.style.backgroundImage = `url('./images/${weather}.jpg')`이걸 치니까 직전에 선생님이랑 같이 적용했던 css 백그라운드 이미지(햇빛)도 안나오고 404오류가 떠요ㅠㅠ왜일까요?

웹 소켓쓸 때 폴링방식으로 쓰면 http갔다가 웹 소켓으로 전환되기 때문에 CORS문제가 발생한다고 했는데 http요청을 한다 한들 저희는 이미 proxy를 설정한 상태인데 왜 cors문제가 발생하는 건가요?

다시 시도해보고 질문하겠습니다.

선생님 안녕하세요 수업 잘듣고있습니다!freebord 폴더로docker-compose up 했는데 오류가 났어요혼자해볼려했지만 잘안되서 올려요../boards/[boardId]/index.tsximport { gql, useQuery } from "@apollo/client"; import { useRouter } from "next/router"; import { IQuery, IQueryFetchBoardArgs, } from "../../../../src/commons/types/generated/types"; import BoardWrite from "../../../../src/components/units/board/write/BoardWrite.container"; const FETCH_BOARD = gql` query fetchBoard($boardId: ID!) { fetchBoard(boardId: $boardId) { writer title contents youtubeUrl boardAddress { zipcode address addressDetail } images } } `; export default function BoardsEditPage() { const router = useRouter(); if (typeof router.query.boardId !== "string") { alert("올바르지 않은 게시글 아이디입니다."); void router.push("/"); return <></>; } const { data } = useQuery<Pick<IQuery, "fetchBoard">, IQueryFetchBoardArgs>( FETCH_BOARD, { variables: { boardId: router.query.boardId } } ); return <BoardWrite isEdit={true} data={data} />; } #0 95.00 Error occurred prerendering page "/boards/[boardId]". Read more: https://nextjs.org/docs/messages/prerender-error #0 95.00 ReferenceError: alert is not defined #0 95.00 at BoardDetail (/freeBoard_/.next/server/pages/boards/[boardId].js:308:9) #0 95.00 at d (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:33:498) #0 95.00 at bb (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:36:16) #0 95.00 at a.b.render (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:42:43) #0 95.00 at a.b.read (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:41:83) #0 95.00 at Object.exports.renderToString (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:52:138) #0 95.00 at Object.renderPage (/freeBoard_/node_modules/next/dist/server/render.js:751:45) #0 95.00 at Object.defaultGetInitialProps (/freeBoard_/node_modules/next/dist/server/render.js:389:51) #0 95.00 at Function.getInitialProps (/freeBoard_/.next/server/pages/_document.js:530:20) #0 95.00 at Object.loadGetInitialProps (/freeBoard_/node_modules/next/dist/shared/lib/utils.js:69:29) #0 95.00 #0 95.00 Error occurred prerendering page "/boards/[boardId]/edit". Read more: https://nextjs.org/docs/messages/prerender-error #0 95.00 ReferenceError: alert is not defined #0 95.00 at BoardsEditPage (/freeBoard_/.next/server/pages/boards/[boardId]/edit.js:48:9) #0 95.00 at d (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:33:498) #0 95.00 at bb (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:36:16) #0 95.00 at a.b.render (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:42:43) #0 95.00 at a.b.read (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:41:83) #0 95.00 at Object.exports.renderToString (/freeBoard_/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:52:138) #0 95.00 at Object.renderPage (/freeBoard_/node_modules/next/dist/server/render.js:751:45) #0 95.00 at Object.defaultGetInitialProps (/freeBoard_/node_modules/next/dist/server/render.js:389:51) #0 95.00 at Function.getInitialProps (/freeBoard_/.next/server/pages/_document.js:530:20) #0 95.00 at Object.loadGetInitialProps (/freeBoard_/node_modules/next/dist/shared/lib/utils.js:69:29) #0 95.00 info - Generating static pages (2/8) #0 95.04 info - Generating static pages (4/8) #0 95.04 [] #0 95.05 info - Generating static pages (6/8) #0 96.43 info - Generating static pages (8/8) #0 96.43 #0 96.43 > Build error occurred #0 96.43 Error: Export encountered errors on following paths: #0 96.43 /boards/[boardId] #0 96.43 /boards/[boardId]/edit #0 96.43 at /freeBoard_/node_modules/next/dist/export/index.js:498:19 #0 96.43 at runMicrotasks (<anonymous>) #0 96.43 at processTicksAndRejections (internal/process/task_queues.js:95:5) #0 96.43 at async Span.traceAsyncFn (/freeBoard_/node_modules/next/dist/trace/trace.js:75:20) #0 96.43 at async /freeBoard_/node_modules/next/dist/build/index.js:1024:17 #0 96.43 at async Span.traceAsyncFn (/freeBoard_/node_modules/next/dist/trace/trace.js:75:20) #0 96.43 at async /freeBoard_/node_modules/next/dist/build/index.js:898:13 #0 96.43 at async Span.traceAsyncFn (/freeBoard_/node_modules/next/dist/trace/trace.js:75:20) #0 96.43 at async Object.build [as default] (/freeBoard_/node_modules/next/dist/build/index.js:82:25) #0 96.55 error Command failed with exit code 1. #0 96.55 info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. ------ failed to solve: executor failed running [/bin/sh -c yarn build]: exit code: 1

정보를 입력 후 회원가입 버튼을 클릭하면콘솔창에 제로초님 화면처럼정보들이 나열되지않습니다! -백 콘솔창Executing (default): SELECT TABLE_NAME FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_TYPE = 'BASE TABLE' AND TABLE_NAME = 'ChannelMembers' AND TABLE_SCHEMA = 'sleact'Executing (default): SHOW INDEX FROM ChannelMembers FROM sleactDB 연결 성공GET /api/users 304 24.697 ms - -GET /api/users 200 4.038 ms - 5GET /api/users 304 2.241 ms - -GET /api/users 304 3.459 ms - -GET /api/users 304 2.637 ms - -GET /api/users 304 2.528 ms - --회원가입 indeximport useInput from '@hooks/useInput'; import { Header, Form, Label, Input,Error, Success, LinkContainer, Button } from "./style"; import fetcher from '@utils/fetcher'; import axios from 'axios'; import React, { useCallback, useState } from "react"; import { Redirect } from "react-router-dom"; import useSWR from 'swr'; const Signup = () => { const [email, setEmail] = useState(''); const [nickname, setNickname] = useState(''); const [password, setPassword] = useState(''); const [passwordCheck, setPasswordCheck] = useState(''); const {data: userData} = useSWR('/api/users', fetcher); const [signupError, setSignUpError] = useState(false); const [signUpSuccess, setSignUpSuccess] = useState(false); const [mismatchError, setMismatchError] = useState(false); const onChangeEmail = useCallback ( (e) => { setEmail(e.target.value); }, []); const onChangeNickname = useCallback ( (e) => { setNickname(e.target.value); }, []); const onChangePassword = useCallback ( (e) => { setPassword(e.target.value); setMismatchError(passwordCheck !== e.target.value); }, [passwordCheck, setPassword], ); const onChangePasswordCheck = useCallback( (e) => { setPasswordCheck(e.target.value); setMismatchError(password !== e.target.value); }, [password, setPasswordCheck], ); const onSubmit = useCallback( (e) => { e.preventDefault(); if(!nickname || nickname.trim()) { return; } if(! mismatchError) { setSignUpError(false); setSignUpSuccess(false); axios .post('/api/users', {email, nickname, password }) .then(() => { setSignUpSuccess(true); }) .catch((error) => { console.log(error.response?.data); setSignUpError(error.response?.data?.code ===403); }); } }, [email, nickname, password, mismatchError], ); if (userData) { return <Redirect to ="/workspace/sleact"/>; } return ( <div id="container"> <Header>Sleact</Header> <Form onSubmit={onSubmit}> <Label id="email-label"> <span>이메일 주소</span> <div> <Input type="email" id="email" name="email" value={email} onChange={onChangeEmail}/> </div> </Label> <Label id="nickname-label"> <span>닉네임</span> <div> <Input type="text" id="nickname" name="nickname" value={nickname} onChange={onChangeNickname}/> </div> </Label> <Label id="password-label"> <span>비밀번호</span> <div> <Input type="password" id="password" name="password" value={password} onChange={onChangePassword}/> </div> </Label> <Label id="password-check-label"> <span>비밀번호 확인</span> <div> <Input type="password" id="password-check" name="password-check" value={passwordCheck} onChange={onChangePasswordCheck}/> </div> {mismatchError && <Error>비밀번호가 일치하지 않습니다.</Error>} {!nickname && <Error>닉네임을 입력해주세요</Error>} {signupError && <Error>이미 가입된 이메일입니다.</Error>} {signUpSuccess && <Success>회원 가입되었습니다! 로그인해주세요.</Success>} </Label> <Button type="submit">회원가입</Button> </Form> <LinkContainer> 이미 회원이신가요?&nbsp; <a href="/login">로그인 하러 가기</a> </LinkContainer> </div> ); }; export default Signup; -개발자도구 콘솔창-개발자도구 네트워크요청 URL:http://localhost:3090/api/users요청 메서드:GET상태 코드:304 Not Modified원격 주소:[::1]:3090리퍼러 정책:strict-origin-when-cross-origin응답 헤더소스 보기access-control-allow-credentials:trueconnection:closedate:Wed, 26 Apr 2023 05:29:10 GMTetag:W/"5-fLbvuYullyqbUJDcLlF/4U0SywQ"vary:Originx-powered-by:Express요청 헤더소스 보기Accept:application/json, text/plain, /Accept-Encoding:gzip, deflate, brAccept-Language:ko-KR,ko;q=0.9,en-US;q=0.8,en;q=0.7Connection:keep-aliveHost:localhost:3090If-None-Match:W/"5-fLbvuYullyqbUJDcLlF/4U0SywQ"Referer:http://localhost:3090/signupsec-ch-ua:"Chromium";v="112", "Google Chrome";v="112", "Not:A-Brand";v="99"sec-ch-ua-mobile:?0sec-ch-ua-platform:"Windows"Sec-Fetch-Dest:emptySec-Fetch-Mode:corsSec-Fetch-Site:same-originUser-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36