묻고 답해요
156만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
리액트의 기초 동작중 props로 값전달이 궁금합니다
부모컴포넌트에서 리덕스를 사용하지않고 props로 값을 전달할때에 자식 컴포넌트에서 props.state를 사용하여 앞에 프롭스를 항상붙여 써도 동작하는경우가있고 프롭스 없이 state를 바로사용할수있는경우가 있는데 어떤 차이가있고 어떤걸 사용해야하는지 궁금합니다 만약 프롭스를 붙이지않고 정상적으로 동작하여도 props. 형태를 매번 사용하는것이 좋을까요? 아래는 예시 상황입니다 // 부모에게서 randomstate 를 전달받아 바로 사용하는 자식컴포넌트 const Child1 = ( randomstate ) => { console.log(randomstate); return 자식 컴포넌트 ; }; ... // props를 매번 이용하여 사용하는 컴포넌트 const Child2 = ( props, randomstate ) => { console.log(props.randomstate); return 자식 컴포넌트 ; }; ...
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
onCreate 및 dispatch 함수 내에서 data값 확인은 어떻게 할 수 있을까요?
안녕하세요! 해당 강의를 다 마치고, 사진과 같이 onCreate 함수 내부에서 data를 콘솔로 출력해보니 data 값을 읽어오지 못하는데 그 이유가 뭘까요?? data.length와 같은 작업을 진행하고 싶은데 어떻게 접근해야 할지 모르겠어서 질문 남깁니다 !
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
소켓 프로그래밍 이란
질문있습니다. 소켓프로그래밍이라 하면 어떤것을 제작하는 것을 의미하나요 어렴풋이 서버 프로그래밍을 얘기하는 것 같은데.... 그리고 서버 어플리케이션을 만드는 것으 이야기하는지 서버의 운영체제를 만드는 것을 이야기하는지 잘 모르겠습니다. 도움말씀 부탁드려요..
-
미해결[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지
api추가 질문입니다
api 추가 질문입니다. router.get('/search/:hashtag', async (req, res, next) => { try { const result = await request( req, `/posts/hashtag/${encodeURIComponent(req.params.hashtag)}`,// 문자를 UTF-8로 인코딩 ); res.json(result.data); } catch (error) { if (error.code) { console.error(error); next(error); } } }); 이 코드에서 :hashtag는 인코드 되어서 request함수에 넣었습니다. router.get('/posts/hashtag/:title', verifyToken, async (req, res) => { try { const hashtag = await Hashtag.findOne({ where: { title: req.params.title } }); if (!hashtag) { return res.status(404).json({ code: 404, message: '검색 결과가 없습니다', }); } const posts = await hashtag.getPosts(); return res.json({ code: 200, payload: posts, }); } catch (error) { console.error(error); return res.status(500).json({ code: 500, message: '서버 에러', }); } }); request함수는 헤더의 authorization에 토큰을 넣어서 이 라우터에 요청합니다. 그렇다면 이 코드의 :title 속성은 인코드된 문자열이지 않나요? Hashtag모델에 인코드된 문자열이 저장되는 것도 아니던데 왜 인코드된 문자열을 다시 디코드하지 않나요? const posts = await hashtag.getPosts(); return res.json({ code: 200, payload: posts, }); 또 Post에 있는 hashtag를 가져와 posts에 넣어서 json형식으로 출력했더니 이런 형태의 데이터가 나왔는데 Post모델에서 조건에 맞는 hashtag를 가져온것은 이해 했습니다. 그러나 PostHashtag테이블과 UserId컬럼은 왜 가져온것인가요? 혹시 관계 메서드 add set remove get에 대해 정확히 어떠한 인과관계가 나타는지 설명해주실수 있나요? 대충 느낌은 오지만 긴가민가 합니다 ㅜㅜ
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 영화 사이트 만들기
#2강 npm install
npm ERR! code 1 npm ERR! path C:\Users\지은\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\bcrypt npm ERR! command failed npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node-pre-gyp install --fallback-to-build npm ERR! Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\지은\AppData\Roaming\nvm\v16.15.0\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\Users\지은\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node --module_name=bcrypt_lib --module_path=C:\Users\지은\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v93' (1) npm ERR! node-pre-gyp info it worked if it ends with ok npm ERR! node-pre-gyp info using node-pre-gyp@0.14.0 npm ERR! node-pre-gyp info using node@16.15.0 | win32 | x64 npm ERR! node-pre-gyp WARN Using needle for node-pre-gyp https download npm ERR! node-pre-gyp info check checked for "C:\Users\지은\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node" (not found) npm ERR! node-pre-gyp http GET https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp http 404 https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp WARN Tried to download(404): https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp WARN Pre-built binaries not found for bcrypt@3.0.8 and node@16.15.0 (node-v93 ABI, unknown) (falling back to source compile with node-gyp) npm ERR! node-pre-gyp http 404 status code downloading tarball https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! gyp info it worked if it ends with ok npm ERR! gyp info using node-gyp@9.0.0 npm ERR! gyp info using node@16.15.0 | win32 | x64 npm ERR! gyp info ok npm ERR! gyp info it worked if it ends with ok npm ERR! gyp info using node-gyp@9.0.0 npm ERR! gyp info using node@16.15.0 | win32 | x64 npm ERR! gyp ERR! find Python npm ERR! gyp ERR! find Python Python is not set from command line or npm configuration npm ERR! gyp ERR! find Python Python is not set from environment variable PYTHON npm ERR! gyp ERR! find Python checking if "python3" can be used npm ERR! gyp ERR! find Python - "python3" is not in PATH or produced an error npm ERR! gyp ERR! find Python checking if "python" can be used npm ERR! gyp ERR! find Python - "python" is not in PATH or produced an error npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python39\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python39\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python39\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python39\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python39-32\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python39-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python39-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python39-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python39-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python39-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python38\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python38\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python38\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python38\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python38-32\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python38-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python38-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python38-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python38-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python38-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python37\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python37\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python37\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python37\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python37-32\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python37-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python37-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python37-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python37-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python37-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python36\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python36\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python36\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python36\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python36-32\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python36-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python36-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python36-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python36-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python36-32\python.exe" could not be run npm ERR! C:\Users\지은\AppData\Local\npm-cache\_logs\2022-05-25T05_57_34_949Z-debug-0.lognpm ERR! code 1 npm ERR! path C:\Users\지은\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\bcrypt npm ERR! command failed npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node-pre-gyp install --fallback-to-build npm ERR! Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\지은\AppData\Roaming\nvm\v16.15.0\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\Users\지은\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node --module_name=bcrypt_lib --module_path=C:\Users\지은\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v93' (1) npm ERR! node-pre-gyp info it worked if it ends with ok npm ERR! node-pre-gyp info using node-pre-gyp@0.14.0 npm ERR! node-pre-gyp info using node@16.15.0 | win32 | x64 npm ERR! node-pre-gyp WARN Using needle for node-pre-gyp https download npm ERR! node-pre-gyp info check checked for "C:\Users\지은\Downloads\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node" (not found) npm ERR! node-pre-gyp http GET https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp http 404 https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp WARN Tried to download(404): https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp WARN Pre-built binaries not found for bcrypt@3.0.8 and node@16.15.0 (node-v93 ABI, unknown) (falling back to source compile with node-gyp) npm ERR! node-pre-gyp http 404 status code downloading tarball https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! gyp info it worked if it ends with ok npm ERR! gyp info using node-gyp@9.0.0 npm ERR! gyp info using node@16.15.0 | win32 | x64 npm ERR! gyp info ok npm ERR! gyp info it worked if it ends with ok npm ERR! gyp info using node-gyp@9.0.0 npm ERR! gyp info using node@16.15.0 | win32 | x64 npm ERR! gyp ERR! find Python npm ERR! gyp ERR! find Python Python is not set from command line or npm configuration npm ERR! gyp ERR! find Python Python is not set from environment variable PYTHON npm ERR! gyp ERR! find Python checking if "python3" can be used npm ERR! gyp ERR! find Python - "python3" is not in PATH or produced an error npm ERR! gyp ERR! find Python checking if "python" can be used npm ERR! gyp ERR! find Python - "python" is not in PATH or produced an error npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python39\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python39\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python39\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python39\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python39-32\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python39-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python39-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python39-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python39-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python39-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python38\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python38\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python38\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python38\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python38-32\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python38-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python38-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python38-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python38-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python38-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python37\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python37\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python37\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python37\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python37-32\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python37-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python37-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python37-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python37-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python37-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python36\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python36\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python36\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python36\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Users\지은\AppData\Local\Programs\Python\Python36-32\python.exe npm ERR! gyp ERR! find Python - "C:\Users\지은\AppData\Local\Programs\Python\Python36-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python36-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files\Python36-32\python.exe" could not be run npm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python36-32\python.exe npm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python36-32\python.exe" could not be run npm ERR! C:\Users\지은\AppData\Local\npm-cache\_logs\2022-05-25T05_57_34_949Z-debug-0.log 루트 디렉토리에서 npm install 오류가 계속뜹니다ㅠ 버전의 문제인가요...? 이 강의 꼭 듣고싶은데 해결방법이 있을까요..?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
로그인할때 쿠키가 안들어갑니다.
배포했는데 회원가입도 되고, 로그인도 되는데, 쿠키가 안넘어갑니다. 개발모드일때는 쿠키가 넘어갔는데, 어디서 문제인지 모르겠습니다. 아이디 부분만 닉네임으로 바꿨습니다.
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
TypeError: Cannot read properties of undefined (reading 'findOne') 질문
안녕하세요 제로초님! 현재 백엔드 파트 게시물 좋아요 기능을 구현하다가 갑자기 회원가입과 로그인 기능에서 오류가 떠서 질문드립니다. 회원가입을 하게 되면, TypeError: Cannot read properties of undefined (reading 'findOne') 라는 오류가 발생하면서 데이터베이스에 데이터가 전송되지 않고 있습니다. 제가 생각하기에는 User모델에 문제가 발생하여 데이터가 들어가지 않아 findOne이 에러가 뜨는 것 같은데,,, 문제가 된다고 생각하는 코드 올리겠습니다. models/index.js const Sequelize = require("sequelize"); const env = process.env.NODE_ENV || "development"; const config = require("../config/config")[env]; const db = {}; const sequelize = new Sequelize( config.database, config.username, config.password, config, ); db.Comment = require("./comment")(sequelize, Sequelize); db.Hashtag = require("./hashtag")(sequelize, Sequelize); db.Post = require("./post")(sequelize, Sequelize); db.User = require("./user")(sequelize, Sequelize); db.Image = require("./image")(sequelize, Sequelize); Object.keys(db).forEach((modelName) => { if (db[modelName].associate) { db[modelName].associate(db); } }); // 반복문을 이용하여 각 데이터베이스의 관계를 설정해줌. db.sequelize = sequelize; db.Sequelize = Sequelize; module.exports = db; models/user.js const DataTypes = require("sequelize"); const { Model } = DataTypes; module.exports = (sequelize, DataTypes) => { const User = sequelize.define( "User", // id가 기본적으로 들어가있기 때문에 만들지 않아도 됨. { email: { type: DataTypes.STRING(30), allowNull: false, //필수 unique: true, //고유한 값 }, nickname: { type: DataTypes.STRING(30), allowNull: false, //필수}, }, password: { type: DataTypes.STRING(100), allowNull: false, //필수}, }, }, { charset: "utf8", collate: "utf8_general_ci", // 한글 저장 }, ); User.associate = (db) => { db.User.hasMany(db.Post); db.User.hasMany(db.Comment); db.User.belongsToMany(db.Post, { through: "Like", as: "Liked" }); db.User.belongsToMany(db.User, { through: "Follow", as: "Followers", foreignKey: "FollowingId", }); db.User.belongsToMany(db.User, { through: "Follow", as: "Followings", foreignKey: "FollowerId", }); }; return User; }; routes/user.js const express = require("express"); const bcrypt = require("bcrypt"); const passport = require("passport"); const { User, Post } = require("../models"); const { isLoggedIn, isNotLoggedIn } = require("./middlewares"); const router = express.Router(); router.get("/", async (req, res, next) => { // GET /user try { if (req.user) { const fullUserWithoutPassword = await User.findOne({ where: { id: req.user.id }, attributes: { exclude: ["password"], }, include: [ { model: Post, attributes: ["id"], }, { model: User, as: "Followings", attributes: ["id"], }, { model: User, as: "Followers", attributes: ["id"], }, ], }); res.status(200).json(fullUserWithoutPassword); } else { res.status(200).json(null); } } catch (error) { console.error(error); next(error); } }); router.post("/login", isNotLoggedIn, (req, res, next) => { passport.authenticate("local", (err, user, info) => { if (err) { console.error(err); return next(err); } if (info) { return res.status(401).send(info.reason); } return req.login(user, async (loginErr) => { if (loginErr) { console.error(loginErr); return next(loginErr); } const fullUserWithoutPassword = await User.findOne({ where: { id: user.id }, attributes: { exclude: ["password"], }, include: [ { model: Post, attributes: ["id"], }, { model: User, as: "Followings", attributes: ["id"], }, { model: User, as: "Followers", attributes: ["id"], }, ], }); return res.status(200).json(fullUserWithoutPassword); }); })(req, res, next); }); router.post("/", isNotLoggedIn, async (req, res, next) => { // async await을 이용하여 비동기 문제 해결 try { const exUser = await User.findOne({ where: { email: req.body.email, }, }); // 같은 이메일을 사용하고 있는 사람이 있는지 if (exUser) { return res.status(403).send("이미 사용중인 아이디입니다."); } // return이 없으면 아래있는 res도 실행이 됨. const hashedPassword = await bcrypt.hash(req.body.password, 13); await User.create({ email: req.body.email, nickname: req.body.nickname, password: hashedPassword, }); res.send("ok"); } catch (error) { console.error(error); next(error); } }); //post /user/ router.post("/user/logout", isLoggedIn, (req, res, next) => { req.logout(); req.session.destroy(); res.send("ok"); }); module.exports = router; 오류 사진
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
css 시작하면서 "오늘의 감정점수 : " 가 추가되었네요
기본적인 CSS를 추가하실 때 갑자기 <select> 옆에 "오늘의 감정점수 : " 가 추가되어서 제가 놓쳤나 싶었네요 ㅎㅎ.. 다른 분들도 헷갈리시지 않게 강의 밑 소스코드를 참고하시거나 아래 코드를 넣어주시면 편하게 하실듯합니다~ <div> <span>오늘의 감정점수 : </span> <select name="emotion" value={state.emotion} onChange={handleChangeState} > <option value={1}>1</option> <option value={2}>2</option> <option value={3}>3</option> <option value={4}>4</option> <option value={5}>5</option> </select> </div>
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
삭제한 아이템까지 id를 카운트 하는게 정상인가요?
만든걸로 이것저것 해보다가 알게되었는데요. 21번째 아이템을 삭제한 후 다시 아이템을 추가하면 22번째 아이템이라고 뜹니다. chapt 15 소스코드는 아예 콘솔에 출력이 안되서 chapt14 소스코드에서 해보니 제목과 같은 현상이 발생해서요. 21번째 아이템을 삭제한후 다시 아이템을 추가하면 21번째 아이템이어야 되는거 아닌가요?
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
화면에 콘솔이 두개씩 찍히는 상황
화면에 새로고침 할때마다 콘솔 찍은 부분들이 2개씩 항상 찍히던데.. 뭔 이유인지를 모르겠네요..
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
강의 재생 오류
The media could not be loaded, either because the server or network failed or because the format is not supported. 이런 에러가 나오는데 어떻게 해야하나요? 앞부분 이미 들었는데 이러네요.
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
10분 즈음에 더미데이터 filter 안 되시는 분
diaryList[0].filter 이렇게 하시면 콘솔창에서 필터가 되어 있는 모습을 볼 수 있습니다. 한 30분동안 왜 필터가 안 되는지 forEach로 찍어봤는데 배열 하나 안에 객체가 여러개 있는거기 때문에 저렇게 해야하는거 같긴 한데, 또 강사님은 그냥 하셔도 출력이 되시네요. 무튼 저는 위의 방식으로 해결했습니다.
-
미해결프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..)
webpack5부터 optimize-css-assets-webpack-plugin 말고 css-minimizer-webpack-plugin 사용
제목처럼 webpack5부터는 css-minimizer-webpack-plugin이 사용한다고 합니다 https://www.npmjs.com/package/optimize-css-assets-webpack-plugin npm 문서확인해보시면 css-minimizer-webpack-plugin 를 이용하라고 권고하네요 webpack5로 실습 진행하시는분들은 참고해주세요 ~
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
HOC auth.js에 관한 오류 발생 시 참고 사항
강사님 강의 내용과 똑같은 코드를 작성했으나 오류가 계속 생성됬는데 어찌저찌 풀어서 참고하실 분들을 위해 남깁니다 제가 오류가 발생한 상황(hoc/auth.js) [강사님과 같은 코드를 작성 후 서버/클라이언트 실행 시 빈 화면이 나옴] (오류 내용 : unctions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.) - 해결책 : AuthenticationCheck 리턴 시 함수로 리턴하는 것이 아닌 JSX 컴포넌트로 리턴하라고 합니다 (참고 : https://www.inflearn.com/questions/357383) - 실제로 auth.js의 마지막 부분인 을 return AuthenticationCheck -> return <AuthenticationCheck />로 변경 시 정상적으로 작동함을 확인할 수 있었습니다. [hoc/auth.js 코드] import React, { useEffect } from "react"; import { useDispatch } from "react-redux"; import { auth } from "../_action/user_action"; import { useNavigate } from "react-router-dom"; export default function (SpecificComponent, option, adminRoute = null) { //option : null = anyone, true = login user only, false = logout user only function AuthenticationCheck(props) { const dispatch = useDispatch(); const navigate = useNavigate(); useEffect(() => { dispatch(auth()).then((response) => { console.log("auth? ", response); if (!response.payload.isAuth) { // login yet if (option) { navigate("/login"); } } else { // login if (adminRoute && !response.payload.isAdmin) { navigate("/"); } else { if (option === false) { navigate("/"); } } } }); }, []); return ( <SpecificComponent /> // component return이 없으면 React 실행이 안됨. ); } return <AuthenticationCheck />; }
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
안녕하세요 useEffect deps질문입니다.
안녕하세요. 10분28초쯤 일기 수정 중에 useEffect에서 isEdit과 originData를 배열에 넣어주는데요 isEdit과 originData는 바뀌지 않는 값인데 추가하는 이유가 있을까요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
Localstorage에 정상적으로 저장되었지만 새로고침시 로딩되지 않습니다.
다른기능들은 모두 정상적으로 작동을하는데 새로고침시 Localstorage에 저장된 값을 불러오지 못합니다. 정상적으로 Localstorage에 저장되는것으로 보여지는데 id값의 문제인지 date의 문제인지 아님 리스트렌더링 문제인지 아무리보아도 어떤부분에서 문제가 발생하는지 찾지 못하겠어서 질문남깁니다. https://codesandbox.io/s/currying-bash-b45zku?file=/src/App.js 코드샌드박스 링크 첨부합니다. (Edit페이지의 emotion이 깨지는 문제는 VScode에서는 발생하지 않는문제입니다. 무시해주세요) 정말 좋은강의 만들어 주셔서 감사합니다.
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
eslint의 extends쪽 질문이 있습니다.
안녕하세요 현영님. 에러는 해결을 한 상태인데 궁금한 점이 생겨 질문드립니다. const fs = require('fs'); 백쪽에 fs모듈을 쓰면서 부터 시작됐는데, 강의 마지막 부분에 와서 프론트 서버를 새로고침하니 저런 에러가 발생했습니다. 스택오버플로우를 찾아보니, https://github.com/vercel/next.js/issues/7755 프론트쪽에 next.config.js라는 폴더를 생성한 후 module.exports = { webpack: (config, { isServer }) => { // Fixes npm packages that depend on `fs` module if (!isServer) { config.node = { fs: 'empty' } } return config } }이런식으로 넣어주라는데, 프론트 서버에서는 fs모듈에 관련된 작업을 한 게 없어 여러가지 테스트를 하다가, 프론트 폴더의 .eslintrc파일에 extends를 airbnb가 아닌 주석처리된 부분으로 바꾸니 또 해결이 되었습니다.(다른 프론트나 백쪽의 코드는 수정이 없었습니다)1. 혹시 extends랑 상관이 있는건지? 아니면 그냥 일시적인 에러라고 생각을 하면 될까요?2. 관련이 없다고 하면 혹시나 알 수 없는 에러가 나올 경우 현영님의 경우 어떻게 대처를 하시나요? (에러가 생길 때마다 기록을 해두는 편인데 생각보다 찾기가 힘든? 에러들이 종종 나오더라고요.. 짬의 차인지..?)++ 어제 업데이트 하신 정보들 확인했습니다. 바로바로 업데이트 해주셔서 불편함이 없네요 감사합니다
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
react-redux 버전 관련 질문입니다.
리덕스로 로그인을 구현한 후 로그인 되지않는 문제가 생겼었습니다. dispatch 함수가 실행되지만 rootReducer에서 LOG_IN 부분이 실행이 안됐습니다(console.log로 확인) 그래서 useDispatch를 불러온 부분이 문제라고 생각해, react-redux버전을 강의에 맞게 7로 바꾸니 문제가 해결됐습니다. 왜 이런 문제가 발생한건가요..? 추가로 이 강의를 다 들은 후, react-redux를 8버전으로 올리고 싶으면 어디서 변경내역을 확인해야 하나요..?
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
프론트, 백엔드 서로 다른 도메인 간 쿠키 공유
안녕하세요. 현재 프론트는 mysiteurl.site 라는 도메인으로 firebase 호스팅을 하고 있고 백엔드는 mysiteurl.shop 으로 다른 도메인으로 정할 예정인데요. 강의에선 프론트와 백엔드가 동일하게 nodebird.com 이 들어가 있고 route53에서 서로 다른 ip를 가르키게 했는데 제가 하려고 하는 방식에도 쿠키가 전달이 가능할까요? (nginx proxy_set_header 세팅은 동일하다는 가정)
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
자바스크립트 오타 검사 질문
안녕하세요 vscode 설정 관련 질문입니다. 지금 막 vscode를 설치했는데 js파일에서 오타 검사가 안되는데 그 이유를 알 수 있을까요???