질문)짹짹을 눌렀을 때 게시물이 우측에 정렬되는데 어떻게 해야 아래로 정렬될까요? 현재 게시물 추가시 화면)작성한 코드)PostForm.jsimport React,{useCallback, useState, useRef} from 'react'; import {Form, Input, Button} from 'antd'; import {useSelector, useDispatch} from 'react-redux'; import {addPost} from '../reducers/post'; const PostForm = () => { const {imagePaths} = useSelector((state) => state.post); const dispatch = useDispatch(); const imageInput = useRef(); const [text, setText] = useState(''); const onChangeText = useCallback((e) => { setText(e.target.value); }, []) const onSubmit = useCallback(()=> { dispatch(addPost); setText(''); }); const onClickImageUpload = useCallback(() => { imageInput.current.click(); }, [imageInput.current]); return ( <Form style={{ margin: '10px 0 20px'}} encType="multipart/form-data" onFinish={onSubmit}> <Input.TextArea value={text} onChange={onChangeText} maxLength={140} placeholder="어떤 신기한 일이 있었나요?" /> <div> <input type="file" multiple hidden ref={imageInput}/> <Button onClick={onClickImageUpload}>이미지 업로드</Button> <Button type="primary" style={{float:'right'}} htmlType="submit">짹짹</Button> </div> <div> {imagePaths.map((v) => ( <div key={v} style={{display: 'inline-block'}}> <img src={v} style={{width:'200px'}} alt={v}/> <div> <Button>제거</Button> </div> </div> ))} </div> </Form> ) } export default PostForm;post.jsexport const initalState = { mainPosts:[{ id:1, User:{ id:1, nickname: '해지니1', }, content: '첫 번째 게시글 #해시태그 #행복한집사생활', Images:[{ src: 'https://loremflickr.com/640/360' },{ src: 'https://placekitten.com/640/360' },{ src: 'https://picsum.photos/640/360' }], Comments: [{ User: { nickname:'해지니2' }, content: '고양이는 다 기여벙', }, { User: { nickname:'해지니3' }, content: '냥냥냥' }] }], imagePaths: [], //게시물 저장 경로 postAdded: false //게시글 추가 완료시 true } const ADD_POST = 'ADD_POST'; export const addPost = { type: ADD_POST } const dummyPost = { id: 2, content: '더미데이터', User: { id:1, nickname:'해지니', }, Images: [], Comments: [], }; const reducer = (state = initalState, action) => { switch(action.type){ case ADD_POST: return { ...state, mainPosts: [dummyPost, ...state.mainPosts], postAdded: true, }; default: return state; } } export default reducer;

 ERROR [TypeOrmModule] Unable to connect to the database Retrying (2)... QueryFailedError: Incorrect datetime value: '0000-00-00 00:00:00' for column 'meetingTime' at row 1라고 오류납니다 product.resolver.tsimport { Args, Mutation, Query, Resolver } from '@nestjs/graphql'; import { ProductsService } from './product.service'; import { CreateBoardInput } from '../boards/dto/create-board.input'; import { CreateProductInput } from './dto/create-product.input'; import { Product } from './entities/product.entity'; @Resolver() export class ProductsResolver { constructor( private readonly productsService: ProductsService, // ) {} @Query(() => [Product]) fetchProducts(): Promise<Product[]> { return this.productsService.findAll(); } @Query(() => Product) fetchProduct( @Args('productId') productId: string, // ): Promise<Product> { return this.productsService.findOne({ productId }); } @Mutation(() => Product) createProduct( @Args('createProductInput') createProductInput: CreateProductInput, ): Promise<Product> { // << 브라우저에 결과 보내주는 2가지 방법>> // 1. 등록된 내용이 담긴 객체를 그대로 브라우저에 보내주기 return this.productsService.create({ createProductInput }); // 이걸 선호. 조회 api 요청을 안해도 된다 // 2.결과에서만 간단히 보내주기 // return '정상적으로 상품이 등록되었습니다' } }  product.service.tsimport { Args, Mutation, Query, Resolver } from '@nestjs/graphql'; import { ProductsService } from './product.service'; import { CreateBoardInput } from '../boards/dto/create-board.input'; import { CreateProductInput } from './dto/create-product.input'; import { Product } from './entities/product.entity'; @Resolver() export class ProductsResolver { constructor( private readonly productsService: ProductsService, // ) {} @Query(() => [Product]) fetchProducts(): Promise<Product[]> { return this.productsService.findAll(); } @Query(() => Product) fetchProduct( @Args('productId') productId: string, // ): Promise<Product> { return this.productsService.findOne({ productId }); } @Mutation(() => Product) createProduct( @Args('createProductInput') createProductInput: CreateProductInput, ): Promise<Product> { // << 브라우저에 결과 보내주는 2가지 방법>> // 1. 등록된 내용이 담긴 객체를 그대로 브라우저에 보내주기 return this.productsService.create({ createProductInput }); // 이걸 선호. 조회 api 요청을 안해도 된다 // 2.결과에서만 간단히 보내주기 // return '정상적으로 상품이 등록되었습니다' } }  productSaleslocation.entity.tsimport { Field, Float, ObjectType } from '@nestjs/graphql'; import { Column, Entity, PrimaryGeneratedColumn } from 'typeorm'; @Entity() @ObjectType() export class ProductSaleslocation { @PrimaryGeneratedColumn('uuid') @Field(() => String) id: string; @Column() @Field(() => String) address: string; @Column() @Field(() => String) addressDetail: string; // // 9자리 중에서 6자리가 소수점 @Column({ type: 'decimal', precision: 9, scale: 6 }) @Field(() => Float) lat: number; @Column({ type: 'decimal', precision: 9, scale: 6 }) @Field(() => Float) lng: number; @Column() @Field(() => Date) meetingTime: Date; }  meetingTime graphlql 타입을 맞게 해났는데 왜 오류나는지 모르곘습니다 

강의 듣기전부터 프리티어는 사용하고 있었는데yarn add --dev eslint-config-prettier이걸 입력한이후 저장시 프리티어 간격조정이 자동으로 안됩니다format on save 다 체크 되있는 상태이고 다른폴더에선 프리티어가 되지만 yarn add --dev eslint-config-prettier 이걸 입력한 폴더만 간격 조정이 안먹는 데 이유가 뭘까요

안녕하세요 정환님! 강의 듣다가 궁금한 점이 생겨서 질문드립니다.curDate가 변경되면 diary에서 현재 연도와 월에 해당하는 일기만 보여주려고 가공하는 부분입니다. 강의 13분 37초 쯤에서 useEffect 는 현재 연도와 월의 가장 첫번째 날짜를 구한다고 하시고 코드를 작성하시는데 firstDay의 new Date 내에서 curDate.getMonth() 에서 왜 +1을 하지 않아도 현재 월을 잘 받아오는건가요? (JS 에서 월이 0부터니까 +1을 한다고 알고 있었는데요..!)위의 headText 에서랑 increaseMonth 에서는 모두 +1 을 해서 현재 월을 받아왔는데 useEffect 내에서는 왜 +1을 안했는데도 정상적으로 받아왔는지 궁금합니다 !

안녕하세요 선생님 상황) 리덕스 실제 구현하기 부분을 따라하던 도중 configureStore.js에서 createStore 단어 가운데에 취소선이 생기면서 @reduxjs/toolkit의 configureStore로 대체를 권장한다고 뜨는 상황입니다.import {createStore} from 'redux'; import reducer from '../reducers'; const configureStore = () => { const store = createStore(reducer); store.dispatch({ type:'CHANGE_NICKNAME', data:'luckyhaejin' }); return store; }; 사용 중인 OS, 버전)저는 맥 OS사용자이며, 사용하고 있는 버전은 아래와 같습니다.{ "name": "react-nodebird-front", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "dev": "next", "build": "next build" }, "author": "luckyhaejin", "license": "ISC", "dependencies": { "@ant-design/icons": "^4.2.1", "antd": "^4.2.1", "next": "^9.5.5", "next-redux-wrapper": "^6.0.2", "prop-types": "^15.8.1", "react": "^16.14.0", "react-dom": "^16.14.0", "react-redux": "^7.2.9", "redux": "^4.2.1", "styled-components": "^6.1.1" }, "devDependencies": { "eslint": "^8.56.0", "eslint-plugin-import": "^2.29.1", "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0" } }  상황) 그래서 @reduxjs/toolkit과 관련한 문제 같아 react, react-dom 버전을 최신버전인 18로 바꾸고 next도 최신 버전인 14버전으로 바꾼 뒤 @reduxjs/toolkit을 설치하고 @reduxjs/toolkit 방식으로 대체하라는 메세지 안의 redux 링크를 참고하여 코드를 수정해보았습니다. https://redux.js.org/introduction/why-rtk-is-redux-today 하지만 제가 맞게 작성한건지 잘 모르겠고, 이렇게 제가 짠 코드로 변경을 하게되면 강의를 보며 따라하기가 어려워질 것 같아서 다시 원래 에러가 난 상태로 되돌린 상태입니다. 질문)reduxjs/toolkit을 적용하여 작성한 아래 코드가 맞게 작성된건지 궁금합니다.  질문)깃에서 reduxjs/toolkit을 사용한 코드를 강의 순서대로 적용하고 싶어서 찾아보았으나, 섹션2 코드가 순서대로 적용된게 아니라 한번에 올라온것 같아서, 혹시 강의 순서대로 @reduxjs/toolkit을 적용한 코드가 있다면 어떻게 해야 그 코드를 순서대로 볼 수 있는지 궁금합니다. 만약 강의 순서대로 적용한 코드가 없고 섹션별로 나눠져 있다면 섹션 순서대로 코드를 보는 방법이 궁금합니다. 수정 전)reducers/index.jsconst initialState = { user: { isLoggedIn:false, user:null, signUpData:{}, loginData:{} }, post: { mainPosts:[] } }; export const loginAction = (data) => { return { type: 'LOG_IN', data } } export const logoutAction = () => { return { type: 'LOG_OUT' } } // 이전 상태, 액션 => 다음상태 const rootReducer = (state = initialState, action) => { switch(action.type) { case 'LOG_IN': return { ...state, user: { ...state.user, isLoggedIn: true, user:action.data } }; case 'LOG_OUT': return { ...state, user: { ...state.user, isLoggedIn: false, user:null } }; default: return state; } }; export default rootReducer; 수정 후)reducers/userSliceimport {createSlice} from '@reduxjs/toolkit' const userSlice = createSlice({ name: 'user', initialState: { isLoggedIn: false, user:null }, reducers: { login(state, action) { isLoggedIn: true, user:action.payload; }, logout(state) { isLoggedIn: false, user:null } } }) export const {login, logout} = userSlice.actions; export default userSlice.reducer;reducers/postSliceimport {createSlice} from '@reduxjs/toolkit' const postSlice = createSlice({ name: 'post', initialState: { mainPosts:[] }, reducers: { } }); export default postSlice.reducer;   수정 전)store/configureStore.jsimport {createWrapper} from 'next-redux-wrapper'; import {createStore} from 'redux'; import reducer from '../reducers'; const configureStore = () => { const store = createStore(reducer); store.dispatch({ type:'CHANGE_NICKNAME', data:'luckyhaejin' }); return store; }; const wrapper = createWrapper(configureStore, { debug: process.env.NODE_ENV === 'development', }); export default wrapper;수정 후)store/configureStore.jsimport { createWrapper } from 'next-redux-wrapper'; import { configureStore } from '@reduxjs/toolkit'; import userReducer from '../reducers/userSlice'; import postReducer from '../reducers/postSlice' const makeStore = () => { const store = configureStore({ reducer: { user: userReducer, post: postReducer } }); return store; }; const wrapper = createWrapper(makeStore, { debug: process.env.NODE_ENV === 'development', }); export default wrapper;   

그랩마켓 자바스크립트 적용하기 -2 편에서 다 되는데 농구공 그림이 안떠요 <html> <head> <title>그랩마켓</title> <link href="index.css" type="text/css" rel="stylesheet" /> </head> <body> <div id="header"> <div id="header-area"> <img src="images/icons/logo.png" /> </div> </div> <div id="body"> <div id="banner"> <img src="images/banners/banner1.png"> </div> <h1>판매되는 상품들</h1> <div id="product-list"> </div> </div> <div id="footer"></div> </body> <script> var product = [{ name : '농구공', price : 10000, seller : '조던', imagUrl : '/images/products/basketball1.jpeg' },{ name : '축구공', price : 50000, seller : '메시', ImageUrl : '/images/prodocts/soccerball1.jpg' },{ name : '키보드', price : 10000, seller :'그랩', ImageUrl : '/images/prodocts/keyboard.jpg' }]; document.querySelector("#product-list").innerHTML = '<div class="product-card>'+ "<div>" + '<img class="product-img" src="images/products/basketball1.jpeg" />' + "</div>" + '<div class="product-contents">' + '<span class="product-name">농구공 1호</span>' + '<span class="product-price">50000원</span>' + '<div class="product-seller">' + '<img class="product-avatar" src="images/icons/avatar.png" />'+ "<span>그랩</span>" + "</div>" + "</div>" + "</div>" </script> </html>

aggregate 영역이 엔티티(product)와 엔티티(review)간의 생명 주기가 밀접한 관계를 갖고 있는 것들을 하나의 영역으로 묶은 것이라고 말씀해주셨는데그럼 농심이라는 brand가 있고 농심 브랜드에 속한 양파링, 새우깡이 있을 경우에 어느날 농심 브랜드가 퇴점을 하게된다면 농심이라는 brand의 product인 양파링, 새우깡은 같이 삭제가 될테니 brand와 product를 aggregate 영역으로 묶을 수 있는건가요?

정주행 시작했습니다. 강의 PPT 파일은 어디서 다운 받을수있나요?

안녕하세요, 강의에서는 Cat 클래스에서 정의한 스키마를 이용해 requestDTO, responseDTO 등으로 상속해서 확장하셨습니다. 검색해보니 이때 원래 파일에 있던 Decorator 등의 메타데이터는 그대로 남아있다고 하는데요, Response 상황에서 어차피 Validation이나 API Property 같은 내용을 신경쓰지 않아도 되니까 상속해도 별 문제가 없긴할거고 강의에서도 그 부분은 크게 신경쓰지 않으신것 같습니다. 혹시 현업에서나 개발 과정에서 저렇게 PickType으로 기존 클래스를 재사용하는 과정에서 기존 클래스에 있던 여러 Decorator 들을 초기화하고 다시 세팅하려면 어떻게 해야할까요? PartialType으로 래핑하는 방법을 사용하면 required 필드는 사라집니다.상속을 하니까 API 문서에 표시되는 순서가 id가 가장 나중에 표시가 됩니다. 순서를 바꾸는 방법을 찾지못했는데 방법이 있을까요?그래서 저는 아예 schema 파일에 id까지 넣은 후에 PickType에서 id 까지 가져오는 방법을 사용해봤습니다. 

function TokenAPI(phNumber){ try { checkPhoneState(phNumber); //휴대폰 상태 점검 } catch (error) { console.log(error); } const token = createToken(); //토큰발급 sendToken(phNumber,token); //휴대폰에 토큰 발송 } function checkPhoneState(phNumber){ if(phNumber.length != 11){ throw new Error("올바르지 않은 번호입니다."); } else if(isNaN(phNumber) != false){ throw new Error("올바르지 않은 번호입니다."); } } function createToken(){ return String(Math.floor(Math.random() * 1000000)).padStart(6,"0"); } function sendToken(phNumber,token){ console.log(phNumber + "번호로 인증번호 " + token + "이 전송되었습니다."); } 이런식으로 try catch 써도 되나요? 

App - state값을 배열로 헀는   이에럭 뜨는데 콘솔로 찍어보면 프롭으로 넘긴 값이 객체로 들어오던데 왜그러는걸까요?

강의하시면서 자동으로 띄어쓰기같은 포매팅이 되던데단축키인지 아니면 익스텐션인지 알 수 있을까용?

🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 수정하기 다 구현한 것 같은데... 수정이 안됩니다ㅠ 뭐가 문제인지 모르겠어요코드샌드박스 링크 첨부합니다!https://codesandbox.io/p/sandbox/emotion-diary-hnrd4q?file=%2Fsrc%2Fcomponents%2FDiaryEditor.js%3A142%2C17

새 일기를 쓰려고 하면 다음과 같은 에러가 발생합니다.해결해보려고 했는데 어떻게 손대야할지 막막하더라구요ㅠ코드를 뒤져보고 강의도 몇번씩 돌려보고 깃헙 소스코드랑 비교도 해봤습니다... 어떤식으로 에러를 해결해야하는지 찾는 방법도 함께 알려주시면 정말정말 감사하겠습니다..!! 아래는 제가 작성한 소스코드입니다!Home.jsimport { useContext, useEffect, useState } from "react"; import { DiaryStateContext } from "../App"; //components import MyButton from "./../components/MyButton"; import MyHeader from "./../components/MyHeader"; import DiaryList from "../components/DiaryList"; const Home = () => { const diaryList = useContext(DiaryStateContext); const [data, setData] = useState([]); // 날짜 저장 state const [curDate, setCurDate] = useState(new Date()); const headText = `${curDate.getFullYear()}년 ${curDate.getMonth() + 1}월`; useEffect(() => { if (diaryList.length >= 1) { const firstDay = new Date(curDate.getFullYear(), curDate.getMonth(), 1).getTime(); const lastDay = new Date(curDate.getFullYear(), curDate.getMonth() + 1, 0).getTime(); setData(diaryList.filter((it) => firstDay <= it.date && it.date <= lastDay)); } else { setData([]); } }, [diaryList, curDate]); // useEffect(() => { // console.log(data); // }, [data]); const increaseMonth = () => { setCurDate(new Date(curDate.getFullYear(), curDate.getMonth() + 1, curDate.getDate())); }; const decreaseMonth = () => { setCurDate(new Date(curDate.getFullYear(), curDate.getMonth() - 1, curDate.getDate())); }; return ( <div> <MyHeader headText={headText} leftChild={<MyButton text={"<"} onClick={decreaseMonth} />} rightChild={<MyButton text={">"} onClick={increaseMonth} />} /> <DiaryList diaryList={data} /> </div> ); }; export default Home; App.jsimport React, { useReducer, useRef } from "react"; import "./App.css"; import { BrowserRouter, Route, Routes } from "react-router-dom"; import Home from "./pages/Home"; import New from "./pages/New"; import Edit from "./pages/Edit"; import Diary from "./pages/Diary"; const reducer = (state, action) => { let newState = []; switch (action.type) { case "INIT": { return action.data; } case "CREATE": { newState = [action.data, ...state]; break; } case "REMOVE": { newState = state.filter((it) => it.id !== action.targetId); break; } case "EDIT": { newState = state.map((it) => (it.id === action.data.Id ? { ...action.data } : it)); break; } default: return state; } return newState; }; export const DiaryStateContext = React.createContext(); export const DiaryDispatchContext = React.createContext(); const dummyData = [ { id: 1, emotion: 3, content: "오늘의 일기 1번", date: 1702273692142, }, { id: 2, emotion: 2, content: "오늘의 일기 2번", date: 1702273692143, }, { id: 3, emotion: 5, content: "오늘의 일기 3번", date: 1702273692144, }, { id: 4, emotion: 1, content: "오늘의 일기 4번", date: 1702273692145 }, { id: 5, emotion: 4, content: "오늘의 일기 5번", date: 1702273692146, }, ]; function App() { const [data, dispatch] = useReducer(reducer, dummyData); const dataId = useRef(0); // CREATE const onCreate = (date, content, emotion) => { dispatch({ type: "CREATE", date: { id: dataId.current, date: new Date(date).getTime(), content, emotion, }, }); dataId.current += 1; }; // REMOVE const onRemove = (targetId) => { dispatch({ type: "REMOVE", targetId }); }; // EDIT const onEdit = (targetId, date, content, emotion) => { dispatch({ type: "EDIT", data: { id: targetId, date: new Date(date).getTime(), content, emotion, }, }); }; return ( <DiaryStateContext.Provider value={data}> <DiaryDispatchContext.Provider value={{ onCreate, onEdit, onRemove }}> <BrowserRouter> <div className="App"> <Routes> <Route path="/" element={<Home />} /> <Route path="/new" element={<New />} /> <Route path="/edit/:id" element={<Edit />} /> <Route path="/diary/:id" element={<Diary />} /> </Routes> </div> </BrowserRouter> </DiaryDispatchContext.Provider> </DiaryStateContext.Provider> ); } export default App;DiaryList.jsimport { useState } from "react"; import { useNavigate } from "react-router-dom"; import MyButton from "./MyButton"; import DiaryItem from "./DiaryItem"; const sortOptionList = [ { value: "latest", name: "최신순" }, { value: "oldest", name: "오래된 순" }, ]; const filterOption = [ { value: "all", name: "전부 다" }, { value: "good", name: "좋은 감정만" }, { value: "bad", name: "안좋은 감정만" }, ]; const ControlMenu = ({ value, onChange, optionList }) => { return ( <select className="ControlMenu" value={value} onChange={(e) => onChange(e.target.value)}> {optionList.map((it, idx) => ( <option value={it.value} key={idx}> {it.name} </option> ))} </select> ); }; const DiaryList = ({ diaryList }) => { const navigator = useNavigate(); const [sortType, setSortType] = useState("latest"); const [filter, setFilter] = useState("all"); const getProcessedDiaryList = () => { const filterCallBack = (item) => { if (filter === "good") { return parseInt(item.emotion) <= 3; } else { return parseInt(item.emotion) > 3; } }; // 비교함수 const compare = (a, b) => { if (sortType === "latest") { return parseInt(b.date) - parseInt(a.date); } else { return parseInt(a.date) - parseInt(b.date); } }; const copyList = JSON.parse(JSON.stringify(diaryList)); const filteredList = filter === "all" ? copyList : copyList.filter((it) => filterCallBack(it)); const sortedList = filteredList.sort(compare); return sortedList; }; return ( <div className="DiaryList"> <div className="menu_wrapper"> <div className="left_col"> <ControlMenu value={sortType} onChange={setSortType} optionList={sortOptionList} /> <ControlMenu value={filter} onChange={setFilter} optionList={filterOption} /> </div> <div className="right_col"> <MyButton type={"positive"} text={"새 일기쓰기"} onClick={() => navigator("/new")} /> </div> </div> {getProcessedDiaryList().map((it) => ( <DiaryItem key={it.id} {...it} /> ))} </div> ); }; DiaryList.defaultProps = { diaryList: [], }; export default DiaryList;

강의에 나온대로 require()로 따라하던 중 import가 더 최신방식이라는 이야기를 듣게 되었습니다. 구글링을 해보니require()를 쓰는 쪽은 CommonJS(CJS)이고 import 쓰는 쪽이 ESM이라는 걸 알게되었습니다Es6(2015)부터 import를 쓸 수 있던거 같은데그 이후에 나온 강의가 require를 쓰게된 이유가 있을까요?사용되는 패키지의 호환성 이슈인지 다른 이유인지 궁금합니다

안녕하세요!강의 수강 시작하고 지금 싸이월드 실습 막 시작한 학생입니다.다름이 아니라 회원가입 부분 실습 마지막 몇 부분을 남기고 막혀서모범코드(?) 같은걸 확인하고 싶은데, 학습자료 부분에가도 싸이월드 코드랑피그마 링크만 안내되어있고 회원가입코드는 안보여서요!일단 이렇게 이미지로 질문을 드려봅니다.남성/여성 라디오버튼을 크기맞추고 가운데정렬까지 했는데 텍스트가 이렇게 세로로 정렬되어 버립니다. 체크박스버튼은 어떻게 손을봐야 할지 모르겠습니다 ㅜ

새로운 name,email,password로 http://localhost:3000/api/users/register에 post 요청하니까 다음과 같은 오류가 떠요 ㅠㅜ 이메일 부분도 unique: true로 해봤음에도 오류는 그대로네요.. 어떻게 해결할 수 있을까요? ( 전 3000번 포트로 설정해놓았어요){ "success": false, "err": { "index": 0, "code": 11000, "keyPattern": { "email": 1 }, "keyValue": { "email": null } } }

안녕하세요 강의를 만족하며 보고있습니다.제가 강의를 수강하면서 모르는 부분만 보거나, 필요한 내용들을 그때마다 찾아서 공부하고 있습니다.하지만 강의가 차례로, 순서대로 해야만 학습 가능한 부분들이있어 공부 하기가 어려운 점이 많습니다. 또 전체적인 코드로 한눈에 흐름을 파악하여 해당 강의 내용을 보고 싶을 때도 많은데, 차례로 강의를 따라가야지만 전체를 볼 수 있기 때문에 어렵습니다.그래서 세션을 공부하기 위한 베이스 코드나, 강의를 하고 난 완료된 코드를 받고 싶은데 부탁드리겠습니다.감사합니다.

컴포넌트가 unmount될때 해당 컴포넌트에서 관리하는 state도 함께 사라지는건가요?컴포넌트가 리랜더링될때 해당 컴포넌트에서 관리하는 state는 여전히 유지되나요?부모컴포넌트가 리랜더링 될때 자식컴포넌트도 리랜더링 되는 건 알고있는데요, 이때 자식컴포넌트가 unmount됐다가 리랜더링되나요? ps) 질문이.. 뭔가 너무 당연한 것 같다는 생각도 드네요..?

안녕하세요! 수업 잘 듣고있습니다.수업소스를 보면 함수도 항상 const를 쓰는데 let을 안쓰고 const를 사용하는 이유가 궁금합니다!!