묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨mongoDB 기초부터 실무까지(feat. Node.js)
리팩토링 강의에서 라우터 리팩토링 전개연산자(...)
선생님 안녕하세요. 좋은강의 정말로 감사드립니다.리팩토링 강의에서 라우터들을 Index.js로 통합시켜줄 때 module.exports = { ...require("./userRouter"), ...require("./blogRouter"), ...require("./commentRouter"), }; 이렇게 전개연산자(...)를 작성해주셨는데요. 이유가 뭘까요? 이렇게 안하고 그냥 module.exports = { require("./userRouter"), require("./blogRouter"), require("./commentRouter"), }; 이렇게 해주려고 하니 에러가 발생하더라구요. 이유가 뭘까요??
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 영화 사이트 만들기
504 Gateway Timeout Error
저같은 경우는 오타 문제였습니다ㅠㅠ 비슷한 질문들 보이는데 서버 에러로그 잘 살펴보세요보면 ReferenceError에 falase라고 false 오타여서 오류났었어요
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
async 함수 중복선언 문제 관련
안녕하세요. 리액트 04-01-rest-get강의를 보다가 export default function RestGetPage() { function onClickAsync() { const result = axios.get("https://koreanjson.com/posts/1"); console.log(result); //Promise } // async function onClickSync() { // const result = await axios.get("https://koreanjson.com/posts/1"); => 함수 중복 선언 문제 // console.log(result); //제대로 된 결과 // }아랫부분의 주석 코드에서 함수 중복 선언 문제가 발생할 수 있으니 화살표 함수를 쓰라고 하셨는데요.함수 중복 선언의 예제를 설명하시는건 이해가 됐는데왜 저 코드가 함수 중복 선언인지 이해가 안가요.위에 함수랑 주석된 함수 이름은 다른데왜 중복선언인가요?챗지피티한테 물어봤더니 자기도 모르겠대요ㅠ그리고 여태 들었던 강의들보다 강사님 강의가 퀄리티가 너무 좋은 거 같아요
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
강의 5분경 내용인 "메인 페이지" 글자가 뜨지 않습니다.
이전 메인페이지가 뜨지 않는다는 질문과 답변들을 통해 App.js파일과 index.js 파일 상단에 import React from 'react'; 를 넣기도 해보고 node와 npm 삭제 > 재설치 후 진행해 보아도 메인페이지에 글자가 뜨지 않아 질문드립니다ㅜㅜ또한 각 파일의 vscode내 터미널 로그를 보아도 딱히 에러가 보이지 않아 문의드립니다..!
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
삭제하기 버튼은 왜 없나요?
DiaryEditor에서 뒤로가기랑 취소하기 버튼 2개가 있는데 "취소하기를 삭제하기로 바꿔야 하는 것 아닌가?"라는 의문이 들었습니다. 강의를 모든 페이지 구성까지 들었는데 어디에서 일기 삭제하기가 없어서요..혹시 책이나 뒷 강의에 나올진 모르겠지만..
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
따로 커밋을 하거나 재배포를 하지 않았는데, DB가 자동으로 초기화 됩니다.
fly.io에 server 프로젝트를 deploy 단계까지 마쳤다.web 프로젝트까지 배포가 완료 되어 모든 동작이 잘 이뤄지고 있다.하지만, 일정 시간이 지나면 자동으로 fly.io에 배포된 DB가 초기화가 된다.초기화가 된 것인지, local의 데이터가 자동 업로드 되면서 덮어씌여진 것인지는 잘 모르겠다.이전 질문의 답변을 보면, Commit을 하면서 fly.io가 자동으로 덮어씌여진다는 것을 보았다.-> 하지만, 실험 결과 Commit을 따로 하지 않아도 초기화가 된다.만약 git과 연관이 있다면6-1. 배포 이후 별다른 작업을 하지 않았지만, 일정시간이 지나면, vercel와 같이 자동으로 git의 repository 최신 내용 바탕으로 업데이트 되어, git에 이미 올라가 있던 DB가 fly.io에 반영이 되는것인가가 궁금합니다.6-2. 또한, 그렇다면 애초에 vercel은 레포지토리 주소를 참고하여 배포하였다면, fly.io는 그저 플랫폼 로그인 수단으로만 git을 연동하였는데, 최신 커밋을 참고하는 기능이 있는지도 궁금합니다.결론적으로 현재 반복적으로 DB가 초기화 되는 현상을 고치고 싶습니다. 추가적인 실험 결과, 로컬의 nodemon server.js가 돌고 있는 server 프로젝트를 종료를 하여도, 일정 시간이 지나면 fly.io의 DB가 초기화 되는 것으로 보아, server의 내용이 바뀌면서 자동으로 로컬 내용이 fly.io로 넘어가는 것도 아닌 것 같습니다.
-
해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
10.6 사용량 제한 구현하기파트 질문
nodebird-api 미들웨어 index.js코드 const jwt = require("jsonwebtoken"); const rateLimit = require("express-rate-limit"); const User = require("../models/user"); exports.isLoggedIn = (req, res, next) => { if (req.isAuthenticated()) { next(); } else { res.status(403).send("로그인 필요"); } }; exports.isNotLoggedIn = (req, res, next) => { if (!req.isAuthenticated()) { next(); } else { const message = encodeURIComponent("로그인한 상태입니다."); res.redirect(`/?error=${message}`); } }; exports.verifyToken = (req, res, next) => { try { res.locals.decoded = jwt.verify( req.headers.authorization, process.env.JWT_SECRET ); return next(); } catch (error) { if (error.name === "TokenExpiredError") { return res.status(419).json({ code: 419, message: "토큰이 만료되었습니다.", }); } return res.status(401).json({ code: 401, message: "유효하지 않은 토큰입니다.", }); } }; exports.apiLimiter = async (req, res, next) => { let user; if (res.locals.decoded) { user = await User.findOne({ where: { id: res.locals.decoded.id } }); } rateLimit({ windowMs: 60 * 1000, max: user?.type === "premium" ? 1000 : 10, handler(req, res) { res.status(this.statusCode).json({ code: this.statusCode, message: "1분에 열 번만 요청할 수 있습니다.", }); }, }); }; exports.deprecated = (req, res) => { res.status(410).json({ code: 410, message: "새로운 버전이 나왔습니다. 새로운 버전을 사용하세요", }); }; nodebird-api routes v2.js 코드 const express = require("express"); const { verifyToken, apiLimiter } = require("../middlewares"); const { createToken, tokenTest, getMyPosts, getPostsByHashtag, } = require("../controllers/v2"); const router = express.Router(); router.post("/token", apiLimiter, createToken); router.get("/test", verifyToken, apiLimiter, tokenTest); router.get("/posts/my", verifyToken, apiLimiter, getMyPosts); router.get("/posts/hashtag/:title", verifyToken, apiLimiter, getPostsByHashtag); module.exports = router; 프리미엄으로 클라이언트 비밀키 발급하고 프리미엄만 사용량제한 구현했는데 터미널에 GET/search/%EA%B3%A0%EC%96%91%EC%9D%B4 - - ms - - 이렇게 나오고 사이트로딩만 뜹니다 ㅜㅜ
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
날짜 형식
const getStringDate = (date) => { return date.toISOString().slice(0, 10); } const New = () => { const [date, steDate] = useState(getStringDate(new Date())); const navigate = useNavigate(); return ( <div> <MyHeader headText={"새 일기쓰기"} leftChild={<MyButton text={'< 뒤로 가기'} onClick={()=> navigate(-1)}/>} /> <div> <section> <h4>오늘은 언제인가요?</h4> <div className="input-box"> <input value={date} type="date" onChange={(e) => steDate(e.target.value)} /> </div> </section> </div> </div> ) }왜 저는 yyyy-mm-dd 형식이 아니라 yyyy.mm.dd로 나올까요? ㅠㅠ
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
yarn install 했는데 node_modules가 설치 안됐어요
이건 class 파일에서 작업한 내용이고 아래는 freeboard-frontend에서 작업한 내용입니다. 파일 지우고 똑같이 따라서 설치 했는데 안돼요..안에 내용도 다른 것 같아요 ㅠㅠ
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
디폴트 아바타 이미지 url에서 404 에러가 뜹니다.
https://www.gravatar.com/avatar?d=mp&f=y 에서 404 에러가 뜨네요
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
date 설정을 바꿀 수 없을까요?
date를 나타내기 위해const getStringDate = (date) => { return date.toISOString().slice(0, 10); }사용헤서 date를 설정하니까밤에 작성하건 낮에 작성하건 Home페이지에서모두 같은 시간으로 저장되서 시간순으로 저장되는 느낌이 안사는 것 같아요.toISOstring을 안하고 onCreate에 데이터를 넣는 코드 구조도 알려주실 수 있나요? --------------------------------------스스로 생각을 해보았는데 혹시const handleSubmit = () => { if (content.length < 1) { contentRef.current.focus(); return; } onCreate({ date, content, emotion }); navigate("/", { replace: true }); };에서 onCreate 함수에 date대신 new Date().getTime()를 넣으면 제가 생각한 문제가 해결될까요? --------------------------------------다시 생각을 해보았는데 이렇게 하면 시간이 지났을때 전날 일기를 작성할 수가 없네요..
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
설치과정에서 불필요한 부분을 삭제하는데 저장을 하지 못한다고 떠요
저장을 눌렀는데 위 화면이 뜨길래 sudo로 다시 시도를 눌렀습니다. 그런데 저장하지 못함 화면이 뜨고 다시 시도를 눌러도 저장이 되지 않습니다.
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
왜 src폴더 위치에서 images가 불러와 지는 지 모르겠습니다
<img src="images/icons/logo.png" /> 만으로 사진이 불러와 지는데요 엄밀히 따지면 images 파일은 public 폴더 아래 있으니<img src="../public/images/icons/logo.png" /> 처럼 상위 폴더로 이동 후 public에서 images에 접근할 수 있는 것 아닌가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
logoutUser 질문입니다
이렇게 떠서 구글링, 유튜브를 보는데 안나와가지고 혹시 방법을 여쭤봐도 될까요 ㅠ
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
포트폴리오 프로젝트
안녕하세요,선생님 강의를 보며 열심히 백엔드 공부중입니다.혹시 포트폴리오 과제같은 경우는 프론트엔드 코스도 봐야 하나요? 아니면 백엔드 커리큘럼 한에서 만들기가 가능할까요?
-
미해결Node.js로 웹 크롤링하기
아래 noscript 내용입니다.
const puppeteer = require('puppeteer'); const dotenv = require('dotenv'); dotenv.config(); const crawler = async () => { try { const browser = await puppeteer.launch({ headless: false, args: ['--window-size=1920,1080', '--disable-notifications'] }); const page = await browser.newPage(); await page.setViewport({ width: 1080, height: 1080, }); await page.goto('https://search.naver.com/search.naver?where=nexearch&sm=top_hty&fbm=0&ie=utf8&query=서울+지게차'); await page.waitFor(3000); await page.evaluate(() => { window.scrollBy(0, 1500); document.querySelector('#loc-main-section-root > section > div > div.api_more_wrap > a').click(); }); await page.waitFor(3000); await page.waitFor(3000); await page.evaluate(() => { document.querySelector('#_pcmap_list_scroll_container > ul > li:nth-child(1) > div.qbGlu > div.ouxiq.icT4K > div > div > span > a > span.hClKF').click(); }); await page.waitFor(3000); await page.evaluate(() => { document.querySelector('#_pcmap_list_scroll_container > ul > li:nth-child(1) > div.qbGlu > div.ouxiq.icT4K > div > div > div > div:nth-child(1) > span.RUjqr > a').click(); }); } catch (e) { console.error(e); } }; crawler(); Error: Evaluation failed: TypeError: Cannot read properties of null (reading 'click') at __puppeteer_evaluation_script__:2:151 at ExecutionContext._evaluateInternal (/Users/youssi/Downloads/nodejs-crawler-master/lecture/node_modules/puppeteer/lib/ExecutionContext.js:122:13) at processTicksAndRejections (node:internal/process/task_queues:96:5) at async ExecutionContext.evaluate (/Users/youssi/Downloads/nodejs-crawler-master/lecture/node_modules/puppeteer/lib/ExecutionContext.js:48:12) at async crawler (/Users/youssi/Downloads/nodejs-crawler-master/lecture/index.js:53:5) -- ASYNC -- at ExecutionContext.<anonymous> (/Users/youssi/Downloads/nodejs-crawler-master/lecture/node_modules/puppeteer/lib/helper.js:111:15) at DOMWorld.evaluate (/Users/youssi/Downloads/nodejs-crawler-master/lecture/node_modules/puppeteer/lib/DOMWorld.js:112:20) -- ASYNC -- at Frame.<anonymous> (/Users/youssi/Downloads/nodejs-crawler-master/lecture/node_modules/puppeteer/lib/helper.js:111:15) at Page.evaluate (/Users/youssi/Downloads/nodejs-crawler-master/lecture/node_modules/puppeteer/lib/Page.js:833:43) at Page.<anonymous> (/Users/youssi/Downloads/nodejs-crawler-master/lecture/node_modules/puppeteer/lib/helper.js:112:23) at crawler (/Users/youssi/Downloads/nodejs-crawler-master/lecture/index.js:53:16) 에러가 납니다. 구글 개발자도구에서 select an element~~~ 누르고 나서야 document.querySelector('#_pcmap_list_scroll_container > ul > li:nth-child(1) > div.qbGlu > div.ouxiq.icT4K > div > div > span > a > span.hClKF').click(); });위 소스가 정상적으로 작동을 합니다. 찾아보니 Javascript를 사용하여 브라우저에서 렌더링하는 웹 페이지를 가져오려고 합니다. 즉, Http Request Node를 사용하여 수신하는 초기 응답에 현재 검색 중인 데이터가 포함되지 않습니다. 당신의 데이터는 자바스크립트 안에 로드되어 브라우저에 의해 html에 삽입될 것입니다.이것과 비슷한 거 같습니다. 크롤링이 안되는 것일까요??
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
31 댓글 등록 삭제 포트폴리오 문제
안녕하세요 ! 포트폴리오 댓글,등록 삭제 과제 풀고있 었는데요 삭제 만드는중에 왜 포폴용 서버 문서에는 저렇게 리턴값을 명시해줘야한다고 돼있는데 코드는export const DELETE_BOARD_COMMENT = gql` mutation deleteBoardComment($password: String, $boardCommentId: ID!) { deleteBoardComment(password: $password, boardCommentId: $boardCommentId) } `; 왜 이렇게 작성해야하는건가요? 풀다보니 저렇게 해야 댓글삭제할때 오류가 나지않더라구요처음에는export const DELETE_BOARD_COMMENT = gql` mutation deleteBoardComment($password: String, $boardCommentId: ID!) { deleteBoardComment(password: $password, boardCommentId: $boardCommentId) { ID } } `;이렇게 작성했는데 오류가 떠서 혹시나 삭제해보니 오류가 나지 않아서 궁금합니다. 점점 복잡해지네요 ㅠㅠ일단 이해는 다 못하지만 댓글삭제, 등록 기능을 구현하긴했는데 다음챕터로 넘어가도될까요 ? 아니면 처음부터 다시 31챕터까지 복습해야할까요?
-
해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
화살표 함수 자동완성이 궁금합니다
안녕하세요 선생님강의를 보다보니 그림판에서 텍스트로 코딩을 하시는데 화살표함수 작성시 뒤에 구문이 자동으로 입력이 되던데 그림판에 어떤 플러그인을 설치하셨길래 이런 기능이 되는건지 궁금합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
Docker Compose Volumes - postman 조회 오류
"Docker Compose Volumes" 강의를 통해 local의 코드를 수정하면 docker 내 image가 nodemon으로인해 refresh되는 것을 cat 명령어로 파일을 열어 확인했습니다.그런데 코드를 변경 후 13:54에 나온것처럼 local의 콘솔창에 refresh에 대한 로그가 나타나지를 않으며,local에서 postman으로 확인할 때도 코드가 변경되지 않은 것처럼 작동합니다. 뭐가 문제일까요?
-
미해결MERN STACK 커뮤니티 : 시작부터 배포까지 알려주는 React
useEffect 두번 사용하는 것
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.두번사용한 이유가axios요청을하고 setPostInfo로 데이터를 저장했지만화면은 렌더링이 끝난 뒤니까 데이터는 가져왔지만화면에는 안띄워져서 useEffect를 두번 사용하신게 맞나요?? 첫번째 useEffect에서 서버 요청후에 만약 PostInfo 데이터가 변한다면 두번째 useEffect가 실행되어 렌더링되므로 데이터를 화면에 띄울 수 있게 되는 것이다.제가 이해한게 맞을까요?? 그렇다면 아래와 같이 처음 useEffect에 PostInfo를 중괄호에 넣으면 왜 안되는지 알 수 있을 까요??넣으니까 서버에 무한 요청만하고 데이터를 화면에 못띄우네요..ㅠㅠ 제가 이해를 잘한 건지 알려주시면 감사드리겠습니다!