묻고 답해요
167만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Next.js 시작하기(feat. 지도 서비스 개발)
마커 클러스터링 도입
안녕하세요, 강의 보면서 많은 도움 받았습니다. 제가 추가로 마커클러스터링을 도입하려고 하는데 네이버에서 제공하는 깃헙 예제 코드를 봐도 도무지 이해가 안가서요.. 혹시 어떤식으로 풀어나가면 될지 궁금합니다... ㅠㅠ
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
import express 하는 부분에서
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 혹시 아래와 같이 자동완성 사용하는 거랑 같을까요??
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
프리캠프 섹션 2 "CSS 의 기본과 싸이월드 실습 1탄 > CSS 정렬" 강의 질문입니다
CSS 정렬 강의 마지막 숙제에서 회원 가입 화면을 아래 피그마처럼 만들라고 숙제를 주셨는데요. 숙제 다하고 예시(답안?) 코드는 없는 건가요?제가 코드를 만들고 참고하려고 답안 코드를 찾으려고 하니 없네요. 설마 없지는 않겠지요?
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
nextJS 설치 시 설정하는게 생겼는데
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. Eslint는 뭔지 알겠는데 밑에 3개는 처음보네요.. 업데이트 되면서 생긴건가요??마지막은 @components/* 이렇게 설정하라고 하던데 맞나요?? 무슨뜻인가요?? 구글링했습니다
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
portfolio section08 과제 내용 관련 질문입니다!
노션에 나와있는 내용 중 댓글과제가이드 파일에는 댓글 등록, 조회, 수정에 대한 가이드라인이 포함되어있으나 페이지 글에 대해서는 등록, 조회 기능만 구현하라고 나와있습니다. 혹시 댓글 수정 기능은 지금 말고 나중에 구현하는 건가요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
안녕하세요 강사님 오류문의드립니다.
lllll@172 server % npm run dev> server@1.0.0 dev> env-cmd -f .env.development nodemon --exec ts-node ./src/server.ts[nodemon] 2.0.20[nodemon] to restart at any time, enter rs[nodemon] watching path(s): .[nodemon] watching extensions: ts,json[nodemon] starting ts-node ./src/server.ts/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:859return new TSError(diagnosticText, diagnosticCodes, diagnostics);^TSError: ⨯ Unable to compile TypeScript:src/routes/subs.ts:139:16 - error TS2339: Property 'file' does not exist on type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.139 if (!req.file?.path) {~~~~src/routes/subs.ts:144:22 - error TS2339: Property 'file' does not exist on type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.144 unlinkSync(req.file.path);~~~~src/routes/subs.ts:154:26 - error TS2339: Property 'file' does not exist on type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.154 sub.imageUrn = req.file?.filename || "";~~~~src/routes/subs.ts:157:27 - error TS2339: Property 'file' does not exist on type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.157 sub.bannerUrn = req.file?.filename || "";~~~~at createTSError (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:859:12)at reportTSError (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:863:19)at getOutput (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:1077:36)at Object.compile (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:1433:41)at Module.m._compile (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:1617:30)at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)at Object.require.extensions.<computed> [as .ts] (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:1621:12)at Module.load (node:internal/modules/cjs/loader:1117:32)at Function.Module._load (node:internal/modules/cjs/loader:958:12)at Module.require (node:internal/modules/cjs/loader:1141:19) {diagnosticCodes: [ 2339, 2339, 2339, 2339 ]}[nodemon] app crashed - waiting for file changes before starting... client에서는 rpm run dev가 정상적으로 실행되는데 server에서는 npm run dev를 실행하면 상기와 같은 오류가 발생하네요.구글링해보니 server 디렉토리 내의 tsconfig.json 파일이 문제인 것 같은데 여러 세팅을 바꾸어보아도 해결되지않아 문의드립니다.(tsconfig.json 파일은 강사님이 올려주신 소스코드 파일과 같은 파일 사용중입니다)
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
시퀄라이즈 order에 대해
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 속성을 작성해야 하나요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
mysqlworkbench 에서 table 불러오기
시퀄라이즈 모델 만들기 강의 부분 듣고 있습니다.user.js 부분 기본 뼈대 만들고 mysqlworkbench 에서 확인하려면 백서버를 실행시켜야 할거 같은데 백서버 실행시킬때 node app.js 하면 되는 걸까요?
-
미해결따라하며 배우는 리액트 A-Z[19버전 반영]
액세스 키가 활성화 되지 않는다 라고 나옵니다.
강의 6분 정도 부터 진행이 안되고 있습니다ㅠㅠ 액세스 키를 찾을 수 없어요..
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
mutation 복붙할때 문제
http://practice.codebootcamp.co.kr/graphql 에서 mutation을 가져올때 백틱 안에 들어가면서 강사님과는 다른 포맷으로 입력됩니다. 데이터를 받아오는 과정에서 문제가 생기진 않는데뒤의 수업에서 자동완성이 되지 않거나,# 주석도 표현되지않고 죄다 연두색으로 표현되는 문제가 있습니다. 왜 다르게 표현되는거죠?강사님처럼 쉼표를 붙이고 자리를 똑같이 만들어도 변하지 않네요,,,
-
미해결만들면서 배우는 프론트엔드 DO IT 코딩 (Next.js, Typescript)
강의 소제목
메시지 거절(Deny) 뷰 작업 강의와 메시지 거절(Deny) API 구현 강의 제목이 서로 변경되었어요!강의 제목 - 뷰 작업. 강의 내용 - API 구현강의 제목 - API 구현. 강의 내용 - 뷰 작업다시 한번 듣고 있는데 발견했습니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
section05. Q3 어떻게 접근하나요
1번부터 난관이네요ㅜcreateBoard 생성하는데 무엇이 문제일까요?오류는 boardAddress부분인것같습니다.
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
[공유목적] nginx 설정 후 쿠키가 전달되지 않을 경우
작성한 이유(저는 이 문제로 골머리를 앓았어서..)도메인 설정 후 쿠키가 전달되지 않아 로그인이 되지 않았다가 해결되었습니다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.confserver { 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 killnpm start (혹은 sudo npm start)pm2 재시작sudo npx pm2 reload all
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
add, edit, delete 할때마다 db에서 re-fetch 하면 어떻게 될까요?
안녕하세요 수업 듣던 중 궁금한 게 생겼습니다.현재 request action을 dispatch할 때, reducer도 바꾸고, saga도 바꿔서예를들어 post를 add 할땐 unshift()를 쓴다던지, delete할땐 filter()를 쓴다던지 해서 db 뿐만 아니라 post들을 프론트 단에서도 계속 상태를 업데이트 해주고 있잖아요. 근데 만약에, add, edit 또는 delete를 해주는 request action의 경우에는saga로만 request action을 dispatch하고, 비동기 요청이 성공했을 때마다, 그것에 대한 follow up request로 다시 처음부터 변경된 모든 post들을 db로부터 가져오면 어떨까요? 이미 db에서 post들의 상태가 업데이트 됐는데, 프론트에서도 post들의 상태를 업데이트 하게 되면 일을 2번 하게 되는 거니까 코드만 더 길어지는 거 아닐까? 궁금하고요.프론트에서 한번 더 post들의 상태를 업데이트 했을 때 얻는 이점이 무엇인지도 모르겠습니다. 제가 드리고 싶은 질문이 글로 잘 전달이 됐는지 모르겠는데, 만약 제 질문이 이해가 되셨다면 둘의 장단점을 알려주시면 감사하겠습니다!
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
게시글 개별 조회 첫 렌더링 시null 문제
안녕하세요 선생님. 게시글 개별조회를 할 때 처음에는 singlePost가 null이라고 했다가 새로고침을 하면 데이터가 로드되는 부분은 어디를 봐야 하나요?개별 게시글 조회 컴포넌트에서 getServerSideProps로 dispatch type은 개별 게시글 조회, data는 context.params.id를 보내서 받아오고 있습니다.에러가 뜰 때 콘솔 창에서는 개별 게시글 조회 컴포넌트 다음으로 _app.js를 가리키는데, 이 컴포넌트는 모양도 단순하고 노드버드와 차이가 없어서 어딜 봐야 하는지 모르겠습니다..조언 부탁드립니다 선생님
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
Aws s3
배포를 하려고 하는 와중에 Aws s3 사용에 관련해서 과금이 많이 나올까봐 걱정이 되는데 혹시 보안적으로 안전하게 사용하는 방법 있을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
작성자 비밀번호 레이아웃이 깨져요
_app.js에 글로벌 적용시켜서 전체 레이아웃은 잡았는데 작성자랑 비밀번호 구역이 들어가는 부분에서 justify-content: space-between; 명령어가 먹질 않아요ㅠㅠ뭐가 문젠가 해서 justify-content: center 해봐도 먹히지않아 문제가 다른곳에 있는것같은데 도통 알수가 없습니다..아래에 코드 첨부합니다ㅠ index.jsemotion.js
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
npx sequelize db:create
npx sequelize db:create를 하면 제로초님 처럼 Access denied for user 'root'@'localhost' (using password: YES) 이게 뜹니다 그래서 mysql로 들어가서 root 비밀번호를 바꿨습니다. 이렇게 뜨고 잘 바꿨는데도 계속 에러가 뜹니다. 구글에도 쳐보고 했지만 mysql_native_password 로 바꾸는 안내만 봐서... 어떻게 조치를 더 해야될까요 ?
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
npm run dev 에러
[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
antd 별점 라이브러리 및 antd.css import 관련 질문
안녕하세요, 멘토님이 질문이 하나쯤은 있을 줄 알고 찾아봤는데 없어서 올립니다.antd 별점과 모달을 듣고 섹션9 퀴즈 부분을 진행 중인데섹션9 퀴즈 1번인 별점 클릭 시 별점 가져오기를 진행하는데 점수가 이상하게 출력됩니다.4점 위치에서 클릭하면 2점이 나온다던가,3점 위치에서 클릭하면 뒤이어 아까 선택했던 4점이 나오는 등이전에 선택했던 별점들이 한 차례 뒤로 밀려서 출력되는 느낌입니다.추후에 해당 부분 리뷰가 있을진 모르겠으나, 먼저 퀴즈와 포폴을 다 만들고 보려고 하는 것도 있고 해당 부분은 왜 이런지.. 추후에 포폴에 적용할 때도 문제가 될듯 싶어서 질문올립니다. 그리고 어떨 때는 강의에서 알려주신 것 처럼import "antd/dist/antd.css";를 import해야 정상 렌더링 되는 때가 있고, 어떨 때(어떤 것?)는 해당 CSS를 import하지 않아도 정상 렌더링 되는 현상도 있습니다.이것은 또 왜 경우가 나뉘는지 궁금합니다. 감사합니다.