172만명의 커뮤니티!! 함께 토론해봐요.
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
화살표 함수 질문드립니다. const a = (a ) => {a *b } 보통 이렇게 가는데 어떤건 const a = (a ) => { ( a* b ) } 으로 괄호가 들어가더라구요 어떤 경우에 괄호가 들어가고 어떤 경우에는 빠지는지가 궁금합니다 .
미해결
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
데이터 베이스에도 기록이 잘 들어가고 사이트 홈화면에도 잘 뜨는데 화면의 이미지가 안뜹니다. uploads파일에도 이미지 다 잘 들어갑니다. 인강과 데이터베이스를 비교해봤을 때 경로문제인것같긴한데 어떻게 수정을 해야할까요? 근데 DB경로의 역슬래시를 슬래시로 바꾸어도 안뜨고 uploads에는 사진도 잘 들어가고 사진의 경로를 봤을때도 동일해서... 왜 안뜨는걸까요? 단순히 한사진의 오류라고생각했었는데 등록한 것 모두 이렇게 되어서... 어딜 어떻게 수정해야할지모르겠어서... 일단은 깃허브링크 함께올려봅니다... 홈사이트 화면 개발자 툴 상품넣고 난뒤 DB데이터 베이스 물건 등록 후 vscode에 뜨는것 깃허브 링크: https://github.com/Dalrae03/webstudy/commit/7a5981dafabdbf009b40c0c5814e7e7c6f3ea9de https://github.com/Dalrae03/webstudy/commit/c9106654b1d6badba9ae64ce744a11da46b719a5
해결됨
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
강의에서 사용하고 있는 next 버전이 궁금합니다. 12버전인가요?
미해결
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
압축을 푼뒤 진행해도 에러가 납니다 The file is not displayed in the text editor because it is either binary or uses an unsupported text encoding.라고 나오고요 hexeditor를 깔아도 해결이 안됩니다 찾아보니 50mb를 넘는 자료를 vs코드에서 지원을 못한다고 하는데요 참고로 집에 컴퓨터가 없어 pc방 컴퓨터로 배우는 중입니다
해결됨
탄탄한 백엔드 NestJS, 기초부터 심화까지
'첫 시작' 챕터 영상 레이아웃의 하단에 '수업 노트를 확인해 주세요 :)'가 있는데 해당하는 수업노트가 어디 있는건가요?
미해결
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 22:03 초 부분 에 cors 설치하시는데 요거는 안하셨는데 해야되는거 맞나요?? 저는 안하니까 오류나서 설치하라고 뜨더라구요.. 영상에서는 설치안했는데도 오류 안뜨는 거같아서.. 아님 제가 잘 못본걸 수도 있어서 알려주시면 감사드립니다!
미해결
탄탄한 백엔드 NestJS, 기초부터 심화까지
위에 이미지처럼 클라이언트에서 emit을 발생시켰을 때 서버에서 2번이 찍히고, username을 클라이언트로 전달해줄 때도, 클라이언트에서 2번이 찍힙니다. afterInit()함수 내부의 로거도 두번 작동하는데 왜 이럴까요?
미해결
따라하며 배우는 노드, 리액트 시리즈 - 챗봇 사이트 만들기
버전 바꾸려면 어떤 식으로 해야하나요?
미해결
따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
따라치며 공부하다 문득 궁금해서 질문남깁니다! DB 토큰을 공백으로 바꾸는 것까진 이해가 되었는데 클라이언트에 존재하는 쿠키는 안 지워도 되는건가요??
미해결
따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
https://create-react-app.dev/docs/proxying-api-requests-in-development/
해결됨
탄탄한 백엔드 NestJS, 기초부터 심화까지
안녕하세요 현재 수강중입니다.. 계속해서 에러가 발생하네요.. 지치네요.......ㅠㅠㅠ 똑같이 한거같은데 다음과 같은 에러가 발생합니다.. 무엇이 문제일까요??
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
const post = await Post.findOne({ where: { id: parseInt(req.query.postId) }, order: [ [{ model: Comment }, "createdAt", "ASC"], [{ model: Nested_Comment }, "createdAt", "ASC"], ], include: [ { model: Image, attributes: ["id", "src"] }, { model: User, attributes: ["id", "nickname", "profile_img"], }, { model: Comment, include: [ { model: User, attributes: ["id", "nickname", "profile_img"], }, { model: Nested_Comment, include: [ { model: User, attributes: ["id", "nickname", "profile_img"], }, ], }, ], }, { model: User, as: "Likers", }, { model: Image }, ], }); 강좌를 듣고 게시판을 하나 만들고 있는 중인데요 Comment를 createdAt 기준으로 ASC 정렬, Nested_Comment를 createdAt 기준으로 ASC정렬 하고 싶은데 Comment 까지는 정렬이 되지만 아무리 고쳐봐도 Nested_Comment는 적용이 안되네요. 공식문서도 자세하게 나오지는 않고.. 도저히 안되겠어서 질문드립니다. Nested_Comment까지 정렬하고 싶으면 어떻게 order 속성을 작성해야 하나요?
미해결
[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
안녕하세요! 어제 유투브에서도 질문드렸었는데 잘 이해가 가지 않아 다시 질문드립니다. 184p server1-1.js const http = require('http'); const server = http.createServer((req, res) => { res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' }); res.write('<h1>Hello Node!</h1>'); res.end('<p>Hello Server!</p>'); }); server.listen(8080); server.on('listening', () => { console.log('8080번 포트에서 서버 대기 중입니다!'); }); server.on('error', (error) => { console.error(error); }); 어제 이 부분 에러처리를 try/catch로 하면 안되는건지 질문드렸었는데 server함수가 비동기로 진행되는거라 try/catch 적용하면 안된다고 답변받았었습니다. 186p server2.js const http = require('http'); const fs = require('fs').promises; http.createServer(async (req, res) => { try { const data = await fs.readFile('./server2.html'); res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' }); res.end(data); } catch (err) { console.error(err); res.writeHead(500, { 'Content-Type': 'text/plain; charset=utf-8' }); res.end(err.message); } }) .listen(8081, () => { console.log('8081번 포트에서 서버 대기 중입니다!'); }); 그런데 바로 뒤에서 async를 사용하여 비동기임이 확실한데도 try/catch로 에러처리를 하신 부분이 나와서 잘 이해가 안갑니다.. 뒷부분에서는 왜 try/catch를 적용해도 되는건지 궁금합니다!
미해결
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
안녕하세요! 현재 올려주신 강의 내용을 바탕으로 쇼핑몰 상품의 정품 등록을 하는 서비스를 구현하려고 하고 있습니다. 정품 등록 과정에서 사용자가 정품 인증 코드를 입력하면, API 서버를 통해 데이터베이스에 해당 코드가 존재하는지 찾은 후, 존재한다면 해당 코드와 사용자를 매칭시키는 방식으로 우선 구현하고자 합니다. (약간 문화상품권 등록 같기도 하네요 ㅎㅎ) 물론 위 내용에 관련된 코드 질문은 아니구요 ㅎㅎ 위와 같은 내용이 구현되었을 때 악의를 가진 사용자가 postman 등 툴을 통해 API 서버에 무작위로 정품 인증 코드를 보낸 후, 정말 우연히 존재하는 코드를 찾은 경우에 그 코드를 사용해서 정품 등록을 할 수 있을 것 같은데, 이를 어떻게 대비하는게 좋을지 궁금합니다. rate limit이 생각나긴 하지만... 그리 완벽한 방법은 아닐 것 같아서요..!! 그리고 API 서버 주소가 외부에 노출이 되지 않는 경우엔 무차별 대입 공격을 하기도 힘들텐데, 개발자도구에서 소스를 확인하면 결국 API 서버 주소가 나오잖아요~ 그래서 API 서버 주소를 쉽게 알아내지 못하게 하는 방법이 있을지도 궁금합니다. 또 하나 구현해야 하는 기능이 사용자 본인이 정품 등록한 제품을 조회할 수 있도록 하는 기능인데요, userID가 API 서버에 전송되면 데이터베이스에서 해당 userID로 등록된 제품들을 찾아서 보여주도록 구축하려고 합니다. 다만 이 경우에도 위와 비슷하게 API 서버 주소를 알고있는 사람이 다른 사람 ID를 API 서버에 전송해서 그 사람의 정품 등록된 제품을 조회할 수 있는 문제점이 있을 것 같은데요, 이를 어떻게 해결하는게 좋을지도 의견 여쭤보고 싳습니다. 요약하자면 다음과 같습니다.: API 서버에 무작위 정품인증 코드를 보내는걸 어떻게 막는게 좋을까요? 제가 생각한 방법은 rate limit인데, 더 좋은 방법이 있을까요? API 서버 주소를 개발자도구 등을 통해 쉽게 알아내지 못하게 하는 방법이 있을까요? userID를 통해 API 서버에서 해당 사용자의 정보를 가져오는 경우, 타인이 API 서버와 통신해서 다른 사용자의 정보를 가져오는걸 어떻게 막을 수 있을지 궁금합니다. 제 짧은 생각으로는 ID를 암호화해서 API 서버와 통신해야 될 것 같은데, 조금 막막한 감이 있네요.. 현재 제가 사용하는 프론트엔드가 react가 아니라 순정 html+JS인지라... 약간 질문이 두서없고 강의 주제랑 조금 벗어난 것 같지만... 잘 부탁드리겠습니다..ㅎㅎ 지금 질문드리는 내용이 결국 API 서버 보안과 관련된 내용인 것 같은데, 혹시나 해당 내용과 관련해서 말씀해주고 싶으신 내용이 있으시다면 설령 TMI라고 생각드실지라도 얼마든 알려주세요!! 열심히 배우겠습니다. 💪 좋은 강의 감사드립니다. 좋은 하루 되세요!
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
작성한 이유(저는 이 문제로 골머리를 앓았어서..) 도메인 설정 후 쿠키가 전달되지 않아 로그인이 되지 않았다가 해결되었습니다 session 설정 뿐만 아니라 nginx 설정도 확인해야 합니다 혹시라도 이 문제로 고통받으시는 분이 있다면 해결책이 되길 바랍니다 back 쪽 session 설정 if (process.env.NODE_ENV === "production") { app.use(morgan("combined")); app.use(hpp()); app.use(helmet()); app.set("trust proxy", 1); //배포 시 추가 app.use( cors({ origin: "https://engword.shop", //local "http://localhost:3000" credentials: true, }) ); } else { app.use(morgan("dev")); app.use( cors({ origin: true, credentials: true, }) ); } passportConfig(); app.use(express.json()); app.use(express.urlencoded({ extended: true })); app.use(cookieParser(process.env.COOKIE_SECRET)); app.use( session({ saveUninitialized: false, resave: false, secret: process.env.COOKIE_SECRET, proxy: true, //배포 시 추가 cookie: { httpOnly: true, secure: process.env.NODE_ENV === "production" ? true : false, //https 적용 시 true sameSite: process.env.NODE_ENV === "production" ? "none" : false, domain: process.env.NODE_ENV === "production" && ".engword.shop", }, }) ); nginx 설정 back 에서 설정한 nginx입니다 sudo vim /etc/nginx/nginx.conf server { server_name api.engword.shop; location / { proxy_set_header HOST $host; //추가 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_set_header X-Real-IP $remote_addr; proxy_pass http://127.0.0.0:3000 //http로 설정할 것 proxy_redirect off; } //아래는 certbot 내용 } 위와 같이 설정을 바꾼 후 nginx를 다시 실행합니다 sudo systemctl restart nginx pm2 로 진행 시 pm2 를 껏다 키거나, pm2 재시작을 하시면 됩니다. pm2 껏다 키는 경우 sudo npx pm2 kill npm start (혹은 sudo npm start) pm2 재시작 sudo npx pm2 reload all
해결됨
탄탄한 백엔드 NestJS, 기초부터 심화까지
공식문서 힌트에서, Prefer applying filters by using classes instead of instances when possible. It reduces memory usage since Nest can easily reuse instances of the same class across your entire module. 와 같이, 인스턴스 대신에 클래스를 사용하라고 나와있는데요, 클래스를 사용하는 것이 UseFIlter(HttpExceptionFilter) 가 아니라, UseFIlter(new HttpExceptionFilter()) 이렇게 사용하는 건가요..? 공식문서에서 클래스를 사용하는 것이 권장된다고 나와 있고 클래스로 사용하는 것이 1번인줄 이해했는데, 그 문장 이후에도 2번 과 같이 쓰여서 헷갈려서 질문 올립니다!
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
hyunwooji@jihyeon-uui-MacBook-Air emotiondiary % npm install -g serve npm WARN config global --global , --local are deprecated. Use --location=global instead. npm ERR! code EACCES npm ERR! syscall mkdir npm ERR! path /usr/local/lib/node_modules/serve npm ERR! errno -13 npm ERR! Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/serve' npm ERR! [Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/serve'] { npm ERR! errno: -13, npm ERR! code: 'EACCES', npm ERR! syscall: 'mkdir', npm ERR! path: '/usr/local/lib/node_modules/serve' npm ERR! } npm ERR! npm ERR! The operation was rejected by your operating system. npm ERR! It is likely you do not have the permissions to access this file as the current user npm ERR! npm ERR! If you believe this might be a permissions issue, please double-check the npm ERR! permissions of the file and its containing directories, or try running npm ERR! the command again as root/Administrator. npm ERR! A complete log of this run can be found in: npm ERR! /Users/hyunwooji/.npm/_logs/2023-02-19T07_24_53_420Z-debug-0.log 구글링 해봣을때는 npm 업데이트 문제인거같다고로 찾아서 npm update 도 해봣는데 전혀 해결되지 않고 더 꼬이고 있는거같습니다.. 완강을 앞두고 좌절중이네요ㅠ 오늘 다 완강하고 싶었는데 도저히 해결이 안되어 질문남깁니다 감사합니다!!
해결됨
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
리액트는 어느정도 프로젝트도 해보고 웬만한건 구현이 가능한 정도인데 노드에 관해서 전혀 모르는데 수강해도 괜찮을까요? 혹시 노드 지식이 필요하다면 어떤 강의를 듣고 와서 수강을 해야할까요?
해결됨
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
8080으로 안되서 검색해서 이것저것 해봐도 안되길래 8090으로 하니까 되는데 8090을 써도 상관 없나요?
해결됨
탄탄한 백엔드 NestJS, 기초부터 심화까지
테스트를 잠깐 해 보았는데요. 다른 모듈에있는 Service를 사용하기 위해서는 (지금까지 배운 내용에 한해서) 1. B Module 에 A Module , A Service 등록하기. 2. B Module 에 A Service 만 등록하기 3. A Module 에서 A Service 를 exports 에 등록하고, B Module에서는 A Module 을 등록하기 정도 생각이 들었고 테스트 해 보았습니다. 강사님꼐서는 1번과 3번을 예시로 들어주셨는데요, 좋지않은 예시(1번) 에서 CatsModule 까지 import 한 이유가 있을까요? AppModule에 CatsModule을 import 하지 않고, CatsService 만 providers 에 등록해 준 것과 다른가요? 아니면, 2번 에서 암시적으로 A Module이 import된다거나 하는게 있는건가요? ++ 인스턴스 가 새로 생성되는 것이라면, 서버사이드에서 는 굳이 싱글톤이 아니어도 될 인스턴스 객체들이 많을 것이라 보이는데, 다른 이유가 있나요?
