묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
12.18 새 일기 쓰기 페이지 제목 수정 관련
index.html<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Emotion Diary</title> </head> <body> <div id="root"></div> <script type="module" src="/src/main.jsx"></script> </body> </html> New.jsximport Header from "../components/Header"; import Button from "../components/Button"; import Editor from "../components/Editor"; import { useNavigate } from "react-router-dom"; import { useContext, useEffect } from "react"; import {DiaryDispatchContext} from "../App"; import usePageTitle from "../hooks/usePageTitle"; const New=()=>{ const{onCreate}=useContext(DiaryDispatchContext); const nav=useNavigate(); usePageTitle(`${useParams.id}번 일기 수정`); const onSubmit=(input)=>{ onCreate( input.createdDate.getTime(), input.emotionId, input.content ); nav('/',{replace: true}); }; return ( <div> <Header title={"write new diary"} leftChild={<Button onClick={()=>nav(-1)} text={"< back"}/>} /> <Editor onSubmit={onSubmit}/> </div> ); }; export default New;usePageTitle.jsximport { useEffect } from "react"; const usePageTitle=(title)=>{ useEffect(()=>{ const $title=document.getElementByTagName("title")[0]; $title.innerText=title; },[title]); }; export default usePageTitle;이전 과정까지는 문제없었는데 12.18에 있는 새일기 쓰기 페이지에 들어왔을 때 페이지에 아무것도 뜨지 않는 문제가 발생하는데 어떤게 문제일까요
-
해결됨[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스
가상 시뮬레이터 실행
강의에서 모든 부분이 잘 따라왔습니다.다만.. 마지막 안드로이드 가상 에뮬레이터가 작업표시줄 창에는 뜨지만 직접적으로 확인하지 못하고 있습니다. 클릭해도 아무 반응이 없고, 작업 표시줄에 있는 프로그램에 마우스를 올려보면 이렇게만 뜨고 있습니다. adb 설치도 다시 해보았고, 에뮬레이터에서 앱이 실행 중인지도 adb shell pm list packages | grep 명령어로 확인해보았습니다. 제가 놓친 부분이 있는 걸까요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
로컬 스토리지에 데이터를 저장하는 시점에 대해 문의드립니다.
안녕하세요 강의 잘 듣고 있습니다! 수업 중 reducer의 마지막 부분에 localStorage.setItem()를 호출하여 로컬 스토리지에 데이터를 저장하셨는데요. 그 이유는 데이터의 생성, 수정, 삭제가 reducer 함수 호출 시 이루어지기 때문이라고 이해했습니다. 만약 reducer 내부가 아닌 아래 코드처럼 data를 deps로 가지는 useEffect안에서 데이터를 저장해도 동일하게 동작하는 것이 맞을까요?useEffect(() => { localStorage.setItem("diary", JSON.stringify(data)); }, [data]);
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
12.16 Viewer.css background-color 질문
css를 적용하였는데도 감정 이미지의 background가 적용이 되지 않는데 잘못된 것이 있을까요??.Viewer > section{ width:100%; margin-bottom: 100px; display: flex; flex-direction: column; align-items: center; text-align: center; } .Viewer > section > h4{ font-size:22px; font-weight: bold; } .Viewer .emotion_img_wrapper{ width:250px; height:250px; border-radius: 5px; display:flex; flex-direction: column; align-items: center; justify-content: space-around; color: white; font-size: 25px; } .Viewer .emotion_img_wrapper_1{ background-color: rgb(100,201,100); } .Viewer .emotion_img_wrapper_2{ background-color: rgb(157,215,114); } .Viewer .emotion_img_wrapper_3{ background-color: rgb(253,206,23); } .Viewer .emotion_img_wrapper_4{ background-color: rgb(253,132,70); } .Viewer .emotion_img_wrapper_5{ background-color: rgb(253,86,95); }
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
완벽한 프론트엔드
고농축 프론트엔드 강의와 완벽한 프론트엔드 강의 커리큘럼이 차이가 많이 날까요?추가된 강의 공지는 읽어봤는데 기존의 기본적인 리액트 내용에서 업데이트가 많이 되었다던가 등 차이가 많이 나는지 궁금합니다.
-
해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
질문 있습니다.
안녕하세요. API 개발을 하다가 클라이언트의 IP를 가져와서 사용 할 일이 생겼습니다.간단하게 Request 객체의 ip 값을 가져와서 사용하려고 하는데, 저희 클라이언트가 NextJS의 SSR을 사용해서 렌더링을 하고있어서 브라우저에서 요청을 하면 NextJS 서버 -> NestJS 서버로 요청이 들어가 IP가 요청을 보낸 유저의 IP가 아닌 배포하고있는 서버의 IP로 들어오고 있습니다. 이 문제는 user-agent 값 확인을 통해서 원인을 파악 할 수 있었습니다. 문제를 해결하기 위해 NextJS에서 axios요청을 할 때, 헤더에 클라이언트의 원본 아이피를 가져와서 달아주고 서버에서 해당 헤더의 값을 가져와서 사용하고자 했습니다.생각처럼 됐으면 좋았겠지만, 왜인지 서버에서는 계속 배포하고있는 서버의 IP를 가져오고 있는 상태입니다. 커스텀 헤더에 달아준 값을 확인해봐도 서버 IP가 찍히고 있는데요. 클라이언트 로그에서는 또 원본 IP가 잘 찍히고 있습니다.Nginx를 사용중인데 Nginx에서 문제가 생기고 있는건지, 어디가 잘못된건지 감이 안와서 질문 남깁니다. 어떻게 하는게 좋을까요? 추가로, 클라이언트의 원본 IP를 받아오는 다른 방법이 있을까요?감사합니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
그랩마켓 웹화면 구현하기 -2 질문입니다.
header 에서는 header-area를 따로 만들어서 이미지를 관리를 하였는데body에서 배너는 배너-area를 따로 안만들고 바로 banner에 이미지를 넣어서 관리하는 이유가 따로 있나여?? 무슨차이인가요
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
refreshToken 저장의 문제
아래에 질문이 있으나 해결안이 없어 다시 문의드립니다.refreshToken, 쿠키는 정상적으로 전달되고 있습니다.setCookie도 나옵니다. 그러나, Application에 나타나지 않습니다.그리고 조금 기다렸다가 acessToken을 재발급하려고 클릭하면 아래와 같은 메시지가 나타납니다. 크롬에서 써드파티 쿠키를 다 accept하도록 설정이 되어있고, 시크릿 모드에서도 진행해봤고 사파리에서도 동일합니다. 클릭하여 나타난 통신기록을 총 3번입니다.첫번째 통신은 accessToken만료로 발생한 것으로 보입니다.네트워크 통신기록을 살펴보면 UNAUTHENTICATED가 발생된 것을 알수 있습니다. 두번째 통신은 restoreAccessToken의 뮤테이션입니다. 헤더와 페이로드는 아래와 같습니다. jwt가 첨부되지 않았다는 부분입니다. 3번째 통신의 Header와 payload, response입니다. 이 부분은 주어진 조건으로 사용자 정보를 불러오는 query같습니다. 사용자에 관련된 정보가 없이 시도되어 _id null이 표시된것 같습니다.인터넷에 검색해보았지만 잘 모르겠습니다. axios통신으로 refreshToken을 직접 저장해주는 코드를 보긴 했는데, graphql은 설정만 바꾼다고 하셔서 refreshToken을 어떻게 처리하는지 잘 모르겠습니다.관련해서 검색을 통해 https로 환경을 바꾸면 될거다 하여, localhost:3000을 mkcert로 https로 환경을 바꾸려고 해봤는데 설치만 하고 아래의 글을 발견해서 잠깐 멈추었습니다. https://shingy.tistory.com/46 _id null의 문제가 local에 받아온 쿠키를 저장하지 못하는 문제인것 같은데, 어떻게 처리할수있는 방법이 있나 싶어서 여쭤봅니다. 코드 getAccessToken의 코드 import { GraphQLClient, gql } from "graphql-request"; import { IMutation } from "../../../commons/types/generated/types"; const RESTORE_ACCESS_TOKEN = gql` mutation { restoreAccessToken { accessToken } } `; export const getAccessToken = async (): Promise<string | undefined> => { try { const graphQLClient = new GraphQLClient( "https://backend-practice.codebootcamp.co.kr/graphql", { credentials: "include" }, ); const result = await graphQLClient.request<Pick<IMutation, "restoreAccessToken">>( RESTORE_ACCESS_TOKEN, ); const newAccessToken = result.restoreAccessToken.accessToken; return newAccessToken; } catch (error) { if (error instanceof Error) console.log(error); } }; 아폴로 클라이언트 코드 import { ApolloClient, InMemoryCache, ApolloProvider, ApolloLink, fromPromise, } from "@apollo/client"; import { createUploadLink } from "apollo-upload-client"; import { useRecoilState } from "recoil"; import { accessTokenState } from "../../../commons/store"; import { useEffect } from "react"; import { ErrorResponse, onError } from "@apollo/client/link/error"; import { getAccessToken } from "../libraries/getAccessToken"; const GLOBAL_STATE = new InMemoryCache(); interface IApolloSettingProps { children: JSX.Element; } export default function ApolloSetting(props: IApolloSettingProps) { const [accessToken, setAccessToken] = useRecoilState(accessTokenState); useEffect(() => { const result = localStorage.getItem("accessToken"); console.log(result); console.log("현재는 브라우저입니다"); setAccessToken(result ?? ""); }, []); const errorLink = onError(({ graphQLErrors, operation, forward }) => { //1-1.에러캐치 if (typeof graphQLErrors !== "undefined") { for (const err of graphQLErrors) { //1-2.토큰 만료에러인지 체크 if (err.extensions?.code === "UNAUTHENTICATED") { return fromPromise( getAccessToken() .then((newAccessToken) => { setAccessToken(newAccessToken ?? ""); operation.setContext({ headers: { ...operation.getContext().headers, Authorization: `Bearer ${newAccessToken}`, }, }); }) .catch((err) => { console.log("오류입니다"); }), ).flatMap(() => forward(operation)); } } } }); const uploadLink = createUploadLink({ uri: "https://backend-practice.codebootcamp.co.kr/graphql", headers: { Authorization: `Bearer ${accessToken}`, credentials: "include", }, }); const client = new ApolloClient({ link: ApolloLink.from([errorLink, uploadLink]), uri: "http://backend-practice.codebootcamp.co.kr/graphql", cache: GLOBAL_STATE, }); return <ApolloProvider client={client}>{props.children}</ApolloProvider>; }로그인 success의 코드import { gql, useApolloClient, useQuery } from "@apollo/client"; import type { IQuery } from "../../../src/commons/types/generated/types"; import { wrapAsync } from "../../../src/components/commons/libraries/asyncFunt"; const FETCH_USER_LOGGED_IN = gql` query fetchUserLoggedIn { fetchUserLoggedIn { email name } } `; export default function LoginPage() { const client = useApolloClient(); const onClickButton = async (): Promise<void> => { const result = await client.query({ query: FETCH_USER_LOGGED_IN, }); console.log(result); }; return ( <> {/* <div>{data?.fetchUserLoggedIn.name}님, 환영합니다.</div> */} <div>환영</div> <button onClick={wrapAsync(onClickButton)}>클릭하세요</button> </> ); }
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
5.4) Props로 데이터 전달하기 Button 추가 시 서버가 응답을 하지 않습니다.
commponents 폴더 하위에 Button.jsx 파일을 만들고 const Button = () => { return <Button>Click</Button>; }; export default Button; 이렇게 입력한 후에 App.jsx에서 import "./App.css"; import Header from "./commponents/Header.jsx"; import Footer from "./commponents/Footer.jsx"; import Main from "./commponents/Main.jsx"; import Button from "./commponents/Button.jsx"; function App() { return ( <> <Button /> <Button /> <Button /> </> ); } export default App; 이렇게 입력하고 새로고침을 하면 계속 이렇게 나오는데 왜 그런걸까요. 🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
LightSail 실행 중 오류 질문드립니다!
4:47경 sudo dpkg -i mysql-apt-config_0.8.23-1_all.deb 입력시 이렇게 강의와 다른 화면이 나왔었습니다. 또한영상 5:20에서 명령어를 입력했더니 에러가 나면서 비밀번호를 입력하는 화면이 나오지 않아 더 이상 진행하지 못하고 있습니다.
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
RedisStore 사용법 질문
connect-redis 8.0.1 최신버젼을 사용중입니다. 강의 내용도 해보고 깃헙 코드도 참조해서 해봐도 오류나서 connect-redis 공식문서 읽어보았더니const { RedisStore } = require('connect-redis'); const sessionOption = { resave: false, saveUninitialized: false, secret: process.env.COOKIE_SECRET, cookie: { httpOnly: true, secure: false, }, store: new RedisStore({ client: redisClient }), //저장소의 기본값: 메모리 }이렇게 사용해야 할 것 같습니다. 그렇게 되면 session객체를 const RedisStore = require('connect-redis')(session); 이렇게 넘겨줄 필요는 없는 걸까요?? 그리고 8.0.1 공식문서에서 말하는대로 해도 괜찮을까요?
-
해결됨React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
req.cookies.token == undefined 현상
logout을 해보니 400BadRequest:이미 로그아웃 됨 상태가 지속됩니다. console.log(req.cookies.token); 출력해보니 undefined 라고 출력됩니다. 쿠키를 제대로 읽지 못하는것 같은데 왜 이런 현상이 뜨는지 궁금합니다.. const express = require("express"); const router = express.Router(); const bcrypt = require("bcrypt"); const User = require("../models/User"); const axios = require("axios"); const jwt = require("jsonwebtoken"); router.post("/signup", async (req, res) => { try { const { username, password } = req.body; const existingUser = await User.findOne({ username }); if (existingUser) { return res.status(400).json({ message: "이미 존재하는 사용자입니다." }); } const hashedPassword = await bcrypt.hash(password, 10); const user = new User({ username, password: hashedPassword, }); await user.save(); res.status(201).json({ message: "회원가입이 완료되었습니다." }); } catch (error) { res.status(500).json({ message: "서버 오류가 발생했습니다." }); console.log(error); } }); router.post("/login", async (req, res) => { try { const { username, password } = req.body; const user = await User.findOne({ username }).select("+password"); //왜인지 password가 select되지 않아서 추가함 if (!user) { return res.status(401).json({ message: "존재하지 않는 사용자입니다." }); } if (!user.isActive) { return res.status(401).json({ message: "비활성화된 사용자입니다." }); } if (user.isLoggedIn == true) { return res.status(401).json({ message: "이미 접속 중인 사용자입니다." }); } const isValidPassword = await bcrypt.compare(password, user.password); //비밀번호 비교 if (!isValidPassword) { user.failedLoginAttempts += 1; user.lastLoginAttempt = new Date(); if (user.failedLoginAttempts >= 5) { user.isActive = false; //다섯번 틀리면 계정 비활성화 ㅋㅋ await user.save(); return res.status(401).json({ message: "비밀번호를 5회 이상 틀려 계정이 비활성화되었습니다.", }); } await user.save(); return res.status(401).json({ message: "비밀번호가 일치하지 않습니다.", remainingAttempts: 5 - user.failedLoginAttempts, }); } user.failedLoginAttempts = 0; user.lastLoginAttempt = new Date(); user.isLoggedIn = true; try { const response = await axios.get("https://api.ipify.org?format=json"); //공공장소 사용금지요 const ipAddress = response.data.ip; //한번 정제함 user.lastLoginIp = ipAddress; } catch (error) { console.log("IP 주소를 가져오는데 실패했습니다: ", error.message); } await user.save(); const token = jwt.sign( { userId: user._id, username: user.username }, process.env.JWT_SECRET, { expiresIn: "24h" } //토큰 만료는 24시간 ); console.log(token); //오 된다 res.cookie("token", token, { httpOnly: true, //자바스크립트에서 쿠키 접근 불가 secure: "production", //https에서만 쿠키 전송 sameSite: "strict", //같은 사이트에서만 쿠키 전송 maxAge: 24 * 60 * 60 * 1000, //24시간 }); const userWithoutPassword = user.toObject(); //구글링 해보니 이렇게 하면 문서 타입을 일반 객체로 변환할 수 있다고 한다 delete userWithoutPassword.password; //보안때문에 비밀번호는 삭제할 수 있다고 한다 res.json({ user: userWithoutPassword }); } catch (error) { console.log("서버 오류: ", error); res.status(500).json({ message: "서버 오류가 발생했습니다." }); } }); router.post("/logout", async (req, res) => { console.log(req.cookies.token); try { const token = req.cookies.token; if (!token) { return res.status(400).json({ message: "이미 로그아웃된 상태입니다." }); } try { const decoded = jwt.verify(token, process.env.JWT_SECRET); const user = await User.findById(decoded.userId); if (user) { user.isLoggedIn = false; await user.save(); } } catch (error) { console.log("토큰 검증 오류: ", error.message); } res.clearCookie("token", { httpOnly: true, secure: "production", sameSite: "strict", }); res.json({ message: "로그아웃되었습니다." }); } catch (error) { console.log("로그아웃 오류: ", error.message); res.status(500).json({ message: "서버 오류가 발생했습니다." }); } }); router.delete("/delete/:userId", async (req, res) => { try { const user = await User.findByIdAndDelete(req.params.userId); if (!user) { return res.status(404).json({ message: "사용자를 찾을 수 없습니다." }); } res.json({ message: "사용자가 성공적으로 삭제되었습니다." }); } catch (error) { res.status(500).json({ message: "서버 오류가 발생했습니다." }); } }); module.exports = router;
-
해결됨대용량 채팅 TPS 처리를 위한 웹소켓 통신 만들며 학습하기
RunInit() 관련 질문
현재 웹소켓 구조는 커넥션당 고루틴이 발생하여 블록되어 있는 구조이고 동시에 많은 트래픽이 들어올 경우에 각 커넥션을 담당하는 고루틴들에서 동시에 요청을 처리하기 때문에, RunInit() 같은 메시지 채널을 관리하는 고루틴을 두게 되면, 구조는 깔끔해지지만, 병목이 생길 포인트인 것 같습니다. 그래서 이를 완화하기 위해서 RunInit() 고루틴을 포문으로 여러 개 돌게 할지, 아니면 굳이 RunInit()과 같은 메시지 채널관리용 고루틴을 만들 필요가 있는 건지 의문이 생깁니다. RunInit()과 같은 패턴을 사용하는 것은 강사님 소스에서 뿐만 아니라, 다른 프로젝트에서도 많이 봤어서 관련하여 강사님의 답변을 듣고 싶습니다!
-
미해결코로나맵 개발자가 알려주는 React + Express로 지도서비스 만들기 (Typescript)
수업자료 다운로드 시 빈폴더만 나오네요
안녕하세요. 오늘 강의 결제하고 수업 소스코드를 다운받았는데 아무 것도 없는 빈 폴더만 나왔습니다. 그래서 질문 답변에 나왔던 구글 드라이브 링크로 들어가려고 해도 엑세스 거부됨만 나와서 전혀 진행이 돼지 않는 상황이네요...
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
오류 함수
이 빨간색은 왜 뜨는걸까요?
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
윈도우 파일탐색기 주소창에서 cmd를 입력할 경우 해당 경로로 바로 cmd를 열 수 있습니다.
윈도우 파일탐색기 주소창에서 cmd를 입력할 경우 해당 경로로 바로 cmd를 열 수 있습니다. 중요한건 아닌데 혹시 도움 되실까 싶어서 올려봅니다. (강의 마지막에 cmd를 따로 열어서 직접 경로를 찾아가고 있는데 시간을 단축시킬 수 있습니다)
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
TodoList 최적화 질문드립니다.
Editor.jsx 파일은 Props 가 없고단순히 export default memo(editor) 코드만 있으니 당연히 리렌더링이 안되어야 하지만리렌더링이 되고 있습니다.그래서 App.jsx 파일에서<TodoDispatchContext.Provider value={memoizedDispatch}> <Editor /> <List /></TodoDispatchContext.Provider>이렇게 리턴하는걸 <Editor />를 위쪽으로 빼면리렌더링이 안 일어 납니다.dispatchContext 안쪽으로 editor 컴포넌트가 들어가면리렌더링 일어나고 바깥으로 빼면 리렌더링 안 일어 나는거 설명좀 될까요?
-
해결됨React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
npm run dev 무한로딩
npm run dev를 통해 frontend 폴더에서 다음과같이 정상적으로 실행이 되었습니다.다만, 막상 해당 경로로 접속하면 우외같이 무한로딩에 빠져서 아무것도 뜨지 않습니다.F12 개발자도구로 봐도 어떠한 콘솔에러메시지도 없습니다. 어떻게 해결해야 할까요?
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
To-do list 강의 세션에서 궁금한게 있습니다.
선생님 궁금한 게 있어서 글을 남겨봅니다 오늘 To-do list 강의 세션을 완강했는데 이해를 하지 못하는 부분이 있었습니다 const onUpdate = (targetId) => { setTodo( todo.map((it) => it.id === targetId ? { ...it, isDone: !it.isDone } : it ) ); };onUpdate 부분을 만들때 todo.map((it) => it.id === targetId ? { ...it, isDone: !it.isDone } : it 이분에서 ...it : !it.isDone 이 무엇을 의미하는지와 스프레드 연산자를 쓴 이유를 이해하기 어려웠습니다 const onDelete = (targetId) => { setTodo(todo.filter((it) => it.id !== targetId)); }; 에서 todo.filter((it) => it.id !== targetId) 가 삭제를 하기위해 만들어졌는데 .filter((it) => it.id !== targetId filter 를 쓴 이유와 it.id !== targetId 가 뭔지를 아직도 잘모르겠습니다 to-do list 를 배열을 이용하여 상태 관리를 하는것으로 만들었는데 천천히 공부 해보면서 적용 해볼려고 합니다 공부할떄 선생님께서 보는 학습자료나 to-do list 를 만들때 특별히 참고한게 있었는지 궁금합니다
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
저도 수정 페이지 왔을때 설명과 다르게 아무것도 보이지 않습니다.
밑에 같은 질문을 하신 분이 계시던데요.12.15 챕터의 10:33 초에 보면 수정 으로 들어 왔을때기본값으로 수정 전 데이터가 나온다고 되어 있습니다.지금까지 영상을 보면서 같이 코딩을 해오고 있었는데요.. 그런데 밑에 질문 하신 분 처럼 10:33 초 전 까지의 코딩으로는 수정 시 데이터가 나오지 않습니다.그리고 인프런 측 인지..답변 설명에 useEffect 얘기 하시던데.. useEffect(() => { if (initData) { setInput({ ...initData, createdDate: new Date(Number(initData.createdDate)), }); } }, [initData]); 이 부분은 10:33 초 전 까지는 나오지 않았습니다.인프런 측도 답변을 주실려면 정확히 파악 후 답변을 주세요.. 뭐가 잘못된 건가요?useEffect 부분이 없어도 설명대로 수정 으로 들어가면 데이터가 나오는게 맞는건가요?아니면 제가 뭔가 빠트린 것이 있나요?
