섹션 2 - 강력한 CSS의 "grid 속성" 강의에서 15분 30초쯤에 보이는 grid 레이아웃이 그림 예시와 적용된 속성값이 다른 것 같습니다. grid-item에게 grid-column: 1 / 3; grid-row: 2 / 3; 속성을 주고 실행했을 경우 아래의 레이아웃으로 나눠지고ex)HTML<div class="container"> <div class="item item1">box</div> <div class="item">box</div> // ... </div>CSS.container { box-sizing: border-box; border: 2px solid pink; display: grid; grid-template-columns: 200px repeat(3, 1fr); grid-template-rows: 1fr 2fr; } .item { font-size: 1.3em; font-weight: 500; border: 2px solid powderblue; } .item1 { grid-column: 1 / 3; grid-row: 2 / 3; }result) ㅁ ㅁ ㅁ ㅁ[ㅁ ㅁ]ㅁ ㅁ 강의에서 보여지는 레이아웃처럼 만드려면 grid-column: 1 / 4; grid-row: 2 / 3; 처럼 입력해 주어야 아래처럼 적용이 되었습니다.ex)CSS/* ... */ .item1 { grid-column: 1 / 4; /* 3 -> 4 */ grid-row: 2 / 3; }result) ㅁ ㅁ ㅁ ㅁ[ㅁ ㅁ ㅁ]ㅁ 제가 잘못 입력된 부분이 있는지 혹은 강의 내용의 값이 오타였던 건지 알고싶습니다.

1. mysql 1 : 다 관계인 모델이 2개일때 1 인쪽이 Post 인 모델과 다 인쪽이 Image 인 모델 둘이 묶여 있을때 post.addImages 라는 형식으로 Image가 자동으로 복수형으로 생성되는 걸로 알고있었습니다. 당연히 그런줄알고 (이때 모델명은 그냥 단순예시입니다.) Image가 아니라 Gas 라고 가정할때 post.addGass로 생성되나요? 제가 지금 하고 있는 프로젝트에서 post.addGass 로 사용할시에 post.addGass is not a function 에러가나 혹시나.. Gas의 복수형이 Gass가 아니기 때문에 post.addGas로 넣었더니 돼버렸습니다그게아니라 그냥 add.Gass가 맞는다면 제가 코드를 다시 봐야할꺼같습니다.

const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); // error State const [emailError, setEmailError] = useState(''); //on 으로 시작하는 함수는 행동을 취할 때 마다 event 가 들어온다. => 이벤트핸들러함수 function onChangeEmail(event) { console.log(event); //행위 console.log(event.target); //행위 대상 console.log(event.target.value); //그래서 입력한 값이 뭔지 setEmail(event.target.value); } function onChangePassword(event) { setPassword(event.target.value); } //마지막 포장한 거 보내주기 function onClickSignup() { //진짜 포장이 잘 됐는지 확인해보기 console.log(email); console.log(password); //검증하기 //@ 가 들어가 있지 않다면 if (email.includes('@') === false) { // alert('이메일이 올바르지 않습니다!! @ 가 없음 !!'); // document.getElementById('error').innerText = '이메일이 올바르지 않습니다!! @ 가 없음 !!'; setEmailError('이메일이 올바르지 않습니다!! @ 가 없음 !!'); } else { // 메시지 알림 이전, Backend 컴퓨터에 있는 API(함수) 요청하기 alert('회원가입을 축하합니다!!'); } }onClicksignup 매개 변수로 event 를 써주지 않는 것은 이 함수는 입력값을 보내주지 않아서 그런걸까요 ?on 이 붙은 함수가 모두 event 를 사용할 수 있다는 것으로 이해하면 될까요 ?  

안녕하세요 제로초님 제가 개발하다 궁금한 사항이 생겼는데예시를 하나들면프론트 프로세스가 있고백엔드 프로세스가 있을때외부에서 접속가능하게 포트가 열려있는 것은 프론트만 되어있으면 되잖아요.관련해서 백엔드는 CORS 설정 및 차단 이전에 네트워크설정단에서 아예 포트가 외부에서 접속이 아예 안되면 되고그렇다면 ex) axios.defaults.baseURL = 'https://localhost:백엔드포트'; //backend URL즉 URL conntion을 잡을때 열려있는 ip,port가 아닌 localhost로 커넥션을 잡으면 문제가 있을까요?서비스 서버 기준으로전제조건 : 해당 프로세스들이 로컬환경에서 돌아갈경우

오늘 강의를 들어보니까 react는 자동으로 바뀐 props만 랜더링을 한다고 하셨는데 그럼 memo는 부모 노드가 바뀌었을 때 자식 컴포넌트가 랜더링 되는 것을 방지하기위해 자식 컴포넌트에만 적용한다고 생각하면 될까요?그렇다면 memo는 자식컴포넌트가 없을 때는 memo를 사용할 일이 아예 없는 것이 맞나요?

import React from "react"; import PropTypes from "prop-types"; import Link from "next/link"; import { Input, Menu, Row, Col } from "antd"; import { useState, UseMemo } from "react"; import UserProfile from "../components/UserProfile"; import LoginForm from "../components/LoginForm"; import styled from "styled-components"; const { Search } = Input; const onSearch = (value) => console.log(value); const SearchInput = styled(Input.Search)` verticalalign: middle; width: 200px; marginleft: 10px; `; const items = [ { label: <Link href="/">노드버드</Link>, key: "mail", }, { label: ( <div> <Link href="/profile">프로필</Link> <SearchInput placeholder="input search text" enterButton="Search" onSearch={onSearch} /> </div> ), key: "profile", }, { label: <Link href="/signup">회원가입</Link>, key: "signup", }, ]; let tmp = "mail"; const AppLayout = ({ children }) => { const [isLoggedIn, setIsLoggedIn] = useState(false); const [current, setCurrent] = useState(tmp); console.log(current); const onClick = (e) => { console.log("click ", e); setCurrent(e.key); tmp = e.key; }; return ( <div> <Row> <Col span={12} offset={6}> <Menu mode="horizontal" onClick={onClick} selectedKeys={[current]} items={items} /> </Col> </Row> <Row gutter={8}> <Col xs={24} md={6}> {isLoggedIn ? <UserProfile /> : <LoginForm />} </Col> <Col xs={24} md={12}> {children} </Col> <Col xs={24} md={6}> <a href="https://github.com/seroak" target="_blank" rel="noreferrer noopener" > Made by seooak </a> </Col> </Row> </div> ); }; AppLayout.propTypes = { children: PropTypes.node.isRequired, }; export default AppLayout;제가 메뉴를 만들 때 ant 디자인 공식문서를 보고 const item에 요소를 작성해서 메뉴를 만드는 방식으로 코드를 작성했는데 이렇게 작서하니까 SearchInput에 styled 컴포넌트를 적용하는 것이 안됩니다 어떤 방식이 좋을까요?const SearchInput = styled(Input.Search)` verticalalign: middle; width: 200px; marginleft: 10px; `; const items = [ { label: <Link href="/">노드버드</Link>, key: "mail", }, { label: ( <div> <Link href="/profile">프로필</Link> <SearchInput placeholder="input search text" enterButton="Search" onSearch={onSearch} /> </div> ),맨위의 코드가 전체 코드이고 제가 궁금한 부분이 있는 코드는 아래에 있습니다

수업을 잘 따라갔는데 localhost를 연결할 수 없다고 계속 떠요ㅠㅠ 이유가 뭘까요ㅠ

다른 것들은 다 작동이 되는데 수정하기 페이지에서 버튼을 눌러도 동작이 안됩니다 ㅜㅜ 콘솔에도 오류가 안 나오고 강의를 3번 처음부터 다시 봐도 뭐 때문에 동작을 안 하는지 모르겠습니다 ㅜㅜ

Cannot read property 'me' of undefined 에러가 났는데 원인을 모르겠어서 질문드립니다.에러로 추정되는 코드 파일(PostCard.js, user.js, post.js)을 함께 첨부합니다.PostCard.jsimport React, { useState, useCallback } from 'react'; import PropTypes from 'prop-types'; import { useSelector } from 'react-redux'; import { Card, Popover, Button, Avatar } from 'antd'; import { RetweetOutlined, HeartOutlined, MessageOutlined, EllipsisOutLined, HeartTwoTone } from '@ant-design/icons'; import PostImages from './PostImages'; const PostCard = ({ post }) => { const { user } = useSelector((state) => state.user); const [liked, setLiked] = useState(false); const [commentFormOpened, setCommentFormOpened] = useState(false); const onToggleLike = useCallback(() => { setLiked((prev) => !prev); }, []); const onToggleComment = useCallback(() => { setCommentFormOpened((prev) => !prev); }, []); const id = useSelector((state) => state.User.me?.id); return ( <div style={{ marginBottom: 20 }}> <Card cover={post.Images[0] && <PostImages images={post.Images} />} actions={[ <RetweetOutlined key="retweet" />, liked ? <HeartTwoTone twoToneColor="#eb2f96" key="heart" onClick={onToggleLike} /> : <HeartOutlined key="heart" onClick={onToggleLike} />, < MessageOutlined key="comment" onClick={onToggleComment} />, <Popover key="more" content={( <Button.Group> {id && post.User.id === id ? ( <> <Button>수정</Button> <Button type="danger">삭제</Button> </> ) : <Button>신고</Button>} </Button.Group> )}> <EllipsisOutLined /> </Popover>, ]} > <Card.Meta avatar={<Avatar>{post.User.nickname[0]}</Avatar>} title={post.User.nickname} description={post.content} /> </Card> {commentFormOpened && ( <div> 댓글 부분 </div>)} { /* <CommentFrom /> */ } { /* <Comment /> */ } </div> ); }; PostCard.propTypes = { post: PropTypes.shape({ id: PropTypes.number, User: PropTypes.object, content: PropTypes.string, createdAt: PropTypes.object, Comments: PropTypes.arrayOf(PropTypes.object), Images: PropTypes.arrayOf(PropTypes.object), }).isRequired, }; export default PostCard;user.jsexport const initialState = { isLoggedIn: false, me: null, signUpData: {}, loginData: {}, } export const loginAction = (data) => { return { type: 'LOG_IN', data, } } export const logoutAction = (data) => { return { type: 'LOG_OUT', } } const reducer = (state = initialState, action) => { switch (action.type) { case 'LOG_IN': return { ...state, isLoggedIn: true, me: action.data,. // }, }; case 'LOG_OUT': return { ...state, isLoggedIn: false, me: null, }; default: return state; } }; export default reducer;post.jsexport const initialState = { mainPosts: [{ id: 1, User: { id: 1, nickname: 'YeonSeong' }, content: '첫 번째 게시글 #해시태그 #이모티콘', Images: [ { src: 'https://item.kakaocdn.net/do/3b669cd3532e2e97f42dc388d8c29fcb41d1a2caccd0c566eab28b91e2e5d306',}, { src: 'https://item.kakaocdn.net/do/3b669cd3532e2e97f42dc388d8c29fcb7f9f127ae3ca5dc7f0f6349aebcdb3c4',}, { src: 'https://item.kakaocdn.net/do/3b669cd3532e2e97f42dc388d8c29fcbb3a18fdf58bc66ec3f4b6084b7d0b570',}, ], Comments: [{ User: { nickname: 'loveheart',}, content: '우와 강아지가 귀여워요~', }, { User: { nickname: 'starlight',}, content: '얼른 사고 싶어요!', }] }], imagePaths: [], postAdded: false, } 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 = initialState, action) => { switch (action.type) { case ADD_POST: return { ...state, mainPosts: [dummyPost, ...state.mainPosts], postAdded: true, }; default: return state; } }; export default reducer;영상 잘 보고 있습니다 감사합니다.

Todolist 코드 작성할때 함수표현식으로 작성된 함수는 호이스팅이 되지않는다고 하셨는데,saveItemsFn같은 함수는 어떻게 정의 되기 전에 createTodo와 같은 함수에서 사용 할 수 있는건가요?

1.처음 해당 페이지로 이동시 back에있는 데이터만 정상적으로 불러와집니다.2.두번쨰 사진과 세번쨰 사진은 다른페이지로 이동했다가 다시 해당페이지로 돌아올때 useEffect 가 정상적으로 실행, map 함수를 통해 새로운 배열을 만들시에 전에있던 배열데이터가 남아있어 동일한 데이터가 계속 쌓이는 상황입니다. 새로고침시에는 다시 정상적으로 한번만 불러와진 데이터만 보인느데 다른 페이지를 다녀와도 map 함수가 실행될때 전에 있던 데이터는 빈배열로 다시 세팅하고 map 함수가 실행되는 방법이 무엇인지 아무리 찾아봐도 해결이 안되네요.. ㅠㅜ 구원의 손길 부탁드립니다import React, { useEffect } from 'react'; import { useSelector, useDispatch } from 'react-redux'; import { Col, Row } from 'antd' import SystemLayout from '../../components/System/SystemLayout'; import SystemCard from '../../components/System/SystemCard'; import { LOAD_SYSTEMS_REQUEST } from '../../reducers/system-post'; const Test = () => { const dispatch = useDispatch(); const { mainSystems } = useSelector((state) => state.systempost); useEffect(() => { dispatch({ type: LOAD_SYSTEMS_REQUEST, }); }, []); return ( <SystemLayout> <Row justify="space-evenly"> {mainSystems.map((systempost) => ( <Col xs={6}> <SystemCard key={systempost.id} systempost={systempost} /> </Col> ))} </Row> </SystemLayout> ); }; export default Test;

안녕하세요 제로초님.post, put, delete 할때 백엔드에서 response에 data를 담아 돌려보내는 보내는 이유가 궁금합니다.프론트에서 post, put, delete 요청을 보내면, 백엔드에서는 db에 업데이트만 하고, 아무것도 안 돌려주고 나서,프론트에서는 response 200 온거 확인한 후에, 프론트 안에서 data를 변경해도 되지 않나요??새로고침 할때는 mounted 할때 일괄적으로 list 보내면 되지 않나요?

해당 강의의 http://example.codebootcamp.co.kr/api-docs/http://example.codebootcamp.co.kr/graphql사이트에 연결할 수 없다고 나옵니다 ㅠ 

강의중 자바스크립트 최신문법을 사용해서 설정했다고 언급(7:35)되는데 "module": "commonjs","target": "ES5",commonjs에 최신문법을 적용해도 상관없는건가요?exnext에 적용하는게 좀더 안정적이지 않을까 생각이 들어서 말씀드립니다.

$ yarn generateyarn run v1.22.19$ graphql-codegen✔ Parse Configuration⚠ Generate outputs ❯ Generate to ./src/commons/types/generated/typed.ts ✔ Load GraphQL schemas ✔ Load GraphQL documents ✖ Cannot use GraphQLObjectType "BoardReturn" from another module or realm. Ensure that there is only one instance of "graphql" in the node_modules directory. If d…error Command failed with exit code 1.info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.   practice로 주소를 변경하고 yarn generate를 실행하는데 자꾸 위와같은 오류가 납니다 ㅠㅠ

안녕하세요, 강의 영상을 보면 Body나 Param를 입력하면 맨 위에 import가 자동으로 되던데 vsc extension의 기능인가요?

안녕하세요. 강의 잘 듣고 있습니다.현재 섹션 1까지 모두 수강하였습니다. 다만 제목과 같이 NicknameEditForm, FollowList 구현부터 웹에 렌더가 되지 않아 진도가 막힌 상태입니다...ㅜㅜantd나 스타일 컴포넌트의 문제 같아 환경설정도 변경해보고 VS code를 재다운로드하거나 버전별로 테스트 해보기도 했는데 아직 해결 방법을 찾지 못한 상태입니다. 코드 실행한 결과입니다. 회원 정보 카드 옆에 닉네임 수정 폼이나 팔로우 리스트가 생성되어야 하는데 전혀 뜨질 않네요. 혹시 어떤 해결 방법이 있을까요?아래는 환경과 작성한 코드입니다.{ "name": "react-nodebird-front", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "dev": "next" }, "author": "kde", "license": "ISC", "dependencies": { "@ant-design/icons": "^5.1.3", "antd": "^4.3.1", "next": "^9.5.5", "prop-types": "^15.8.1", "react": "^17.0.2", "react-dom": "^17.0.2", "react-test-renderer": "^17.0.2", "styled-components": "^5.3.11" }, "devDependencies": { "eslint": "^8.41.0", "eslint-plugin-import": "^2.27.5", "eslint-plugin-react": "^7.32.2", "eslint-plugin-react-hooks": "^4.6.0" } }import React, { useCallback } from 'react'; import { Avatar, Button, Card } from 'antd'; const UserProfile = ({ setIsLoggedIn }) => { const onLogOut = useCallback(() => { setIsLoggedIn(false); }, []); return ( <Card actions={[ <div key="twit">짹짹<br/>0</div>, <div key="following">팔로잉<br/>0</div>, <div key="following">팔로워<br/>0</div>, ]} > <Card.Meta avatar={<Avatar>test</Avatar>} title="test" /> <Button onClick={onLogOut}>로그아웃</Button> </Card> ); }; export default UserProfile;import React, { useMemo } from "react"; import { Form, Input } from 'antd'; const NicknameEditForm = () => { return ( <Form style={{ marginBottom: '20px', border: '1px solid #d9d9d9', padding: '20px' }}> <Input.Search addonBefore="닉네임" enterButton="수정"/> </Form> ); }; export default NicknameEditForm;import React from "react"; import PropTypes from 'prop-types'; import { Button, List, Card } from 'antd'; import { StopOutlined } from '@ant-design/icons'; const FollowList = ({ header, data }) => { return ( <List style={{ marginBottom: '20px' }} grid={{ gutter: 4, xs: 2, md: 3 }} size="small" header={<div>{header}</div>} loadMore={<div style={{ textAlign: 'center', margin: '10px 0' }}><Button>더보기</Button></div>} bordered dataSource={data} renderItem={(item) => ( <List.Item style={{ marginTop: '20px' }}> <Card actions={[<StopOutlined key="stop"/>]}> <Card.Meta description={item.nickname}/> </Card> </List.Item> )} /> ); }; FollowList.propTypes = { header: PropTypes.string.isRequired, data: PropTypes.array.isRequired, }; export default FollowListimport React, { useState } from 'react'; import PropTypes from 'prop-types'; import Link from 'next/link'; import { Menu, Input, Row, Col } from 'antd'; import UserProfile from '../components/UserProfile'; import LoginForm from '../components/LoginForm'; // const SearchInput = styled(Input.Search)` // vertical-align: middle; // `; const AppLayout = ({ children }) => { const [isLoggedIn, setIsLoggedIn] = useState(false); return ( <div> <Menu mode="horizontal"> <Menu.Item> <Link href="/"><a>노드버드</a></Link> </Menu.Item> <Menu.Item> <Link href="/profile"><a>프로필</a></Link> </Menu.Item> <Menu.Item> <Link href="/signup"><a>회원가입</a></Link> </Menu.Item> <Menu.Item> <Input.Search enterButton style={{ verticalAlign: 'middle' }}/> </Menu.Item> </Menu> <Row gutter={8}> <Col xs={24} md={6}> {isLoggedIn ? <UserProfile setIsLoggedIn={setIsLoggedIn}/> : <LoginForm setIsLoggedIn={setIsLoggedIn}/>} </Col> <Col xs={24} md={12}> </Col> <Col xs={24} md={6}> <a href="http://google.com" target="_blank" rel="noreferrer noopener">메인화면</a> </Col> </Row> </div> ); }; AppLayout.propTypes = { children: PropTypes.node.isRequired, }; export default AppLayout;import React, { useState, useCallback, useMemo } from 'react'; import { Form, Input, Button } from 'antd'; import Link from 'next/link'; import PropTypes from 'prop-types'; import styled from 'styled-components'; import useInput from '../hooks/useInput'; // const ButtonWrapper = styled.div` // margin-top: 10px; // `; // const FormWrapper = styled(Form)` // padding: 10px; // `; function LoginForm({ setIsLoggedIn }) { const [id, onChangeId] = useInput(''); const [password, onChangePassword] = useInput(''); // const style = useMemo(() => ({ marginTop: 10 }), []); const onSubmitForm = useCallback(() => { console.log(id, password); setIsLoggedIn(true); }, [id, password]); return ( <Form onFinish={onSubmitForm} style={{ padding: '10px' }}> <div> <label htmlFor="user-id">아이디</label> <br /> <Input name="user-id" value={id} onChange={onChangeId} required /> </div> <div> <label htmlFor="user-password">비밀번호</label> <br /> <Input name="user-password" type="password" value={password} onChange={onChangePassword} required /> </div> <div style={{ marginTop: '10px' }}> <Button type="primary" htmlType="submit" loading={false}>로그인</Button> <Link href="/signup"><a><Button>회원가입</Button></a></Link> </div> </Form> ); } LoginForm.propTypes = { setIsLoggedIn: PropTypes.func.isRequired, } export default LoginForm;/* eslint-disable react/jsx-no-undef */ /* eslint-disable no-unused-vars */ import React from 'react'; import Head from 'next/head'; import AppLayout from '../components/AppLayout'; import NicknameEditForm from '../components/NicknameEditForm'; import FollowList from '../components/FollowList'; const Profile = () => { const followerList = [{ nickname: 'test1' }, { nickname: 'test2' }, { nickname: 'test3' }]; const followingList = [{ nickname: 'test1' }, { nickname: 'test2' }, { nickname: 'test3' }]; return ( <> <Head> <title>내 프로필 | NodeBird</title> </Head> <AppLayout> <NicknameEditForm/> <FollowList header="팔로잉 목록" data={followingList}/> <FollowList header="팔로워 목록" data={followerList}/> </AppLayout> </> ); }; export default Profile;

안녕하세요.강의를 수강하면서 next 13으로 만들고 있습니다...노드에서 이미지 정적 폴더를 생성하고, 이미지가 서버에 저장되게끔 하는거는 구현했는데,아무리 해도 next에서 서버에 있는 이미지를 불러오지를 못합니다.아래는 제가 시도해본 방법입니다.app.use('/', express.static(__dirname + '/public')); app.use(express.static('public'));express에서 클라이언트 단으로 던져주는 저 app.use 자체가 먹지 않고 있고 아무 에러도 나오지 않아서 너무 답답합니다 ㅠㅠ 어떻게 해야 될까요...?....... 

안녕하세요. 강사님지금 sleact db를 생성하였고 table도 다 생성된 상태입니다.nest-typeorm 폴더와 front 폴더 를 둘 다 실행시키면   api/users api를 요청할 때ENOENT: statusCode":404, no such file or directory, stat \public\index.html'이러한 에러가 발생합니다. middlewares/frontend.middleware.ts 파일의 경로가 잘못되어 있나 해서 res.sendFile( path.join(__dirname, '..', '..', '..', 'public', 'index.html'), );를 res.sendFile(path.join(__dirname, '../', 'public', 'index.html'));로 바꿔주었더니api 로그인 페이지로 가지 않고 바로 workspace로 가집니다.response도 html파일로 옵니다. (어떠한 api를 요청해도 마찬가지입니다.) 어떤 부분에서 잘못되었는지 감이 안 잡히네요...힌트라도 주시면 감사하겠습니다! 

안녕하세요? 강의 계속 잘 듣고 있습니다.아래 그림같이 도커강의 듣던중 docker-compose.yaml 파일에서 포트번호가 주석처리된 것을 취소하는 수정작업뒤, 다시 빌드를 하지않고 실행을 해도 된다고 하셨는데 잘 이해가 가지않습니다.Dockerfile안에서 COPY . /myfolder/ 명령어를 실행할 때 docker-compose.yaml 파일도 같이 카피되는 것 아닌가요? 그러면 다시 빌드 해줘야 할것같은데 js파일만 해당하는 건가요? 아직 빌드 개념이 잘 안잡히네요.. 2. 아래 코드는 몽고DB에서 데이터 조회와 등록하는 코드입니다. 여기서 get 메서드에서는 Board.find에 await를 붙이는 것은 이해했습니다. 그런데 post 메서드에서 board.save()에 await를 붙이는 것이 잘 이해가 안갑니다. board.save()에서 response값을 받아오는것도 아니고 단순히 저장작업만 하는 것처럼 보이는데요. 실제로 await를 안 써줘도 정상적으로 저장이 되었습니다. async/await를 어떤 상황에 써야할지 좀 헷갈리네요아 그리고 퀴즈9 하다가 질문합니다.1) 밑에 코드에서 116번줄 Phone.findOne({ phone })에서 Phone.findOne({ phone }).token 이런 식으로 뒤에 .token을 붙이면 userToken에 값이 저장이 안되고 밑에 if문에서 userToken.token 으로하면 token값이 제대로 나오는데 왜 그런가요?2) 다음 질문은 위에 2번질문과 비슷할 수도 있는데 120번줄 await Phone.updateOne({ phone: phone }, { isAuth: true }) 에서 await를 안 붙였더니 db에서 isAuth가 true로 바뀌지 않더라구요. response는 제대로 왔습니다. db에 업데이트하는 과정과 response하는 과정이 독립적일줄 알았는데 그게 아닌가요? -과제하느라 머리가 어질어질해서 질문이 좀 정돈된 것 같지 않은데 양해부탁드립니다. ㅠ ^^;;