44,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
npm run dev 실행 오류
npm run dev 로 server.ts 실행시, 에러가 발생합니다.찾아보니, db 연결 시 인증에 관련된 오류 같은데... 어떻게 해야할지 잘 모르겠습니다.오타 꼼꼼히 확인하고 docker-compose도 다시 실행 해봤는데 해결이 되지 않네요.제가 수업 듣기 전에 pg-admin을 설치했었는데, 그것과 관련 있는 걸까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
ec2재배포하는법
배포중 서버오류가있어서틀린코드 수정하고 package-lock.json , node_modules 삭제하고 다시 npm i 하고깃 업데이트하고 ec2 가서 재배포하고 싶은데 어떻게 해야될까요cd reddit2git pullsudo apt install npmcd clientnpm installnpm run build:prod 하면Linting and checking validity of types ...가 깜빡거리면서 넘어가지 않아서 그냥 npm run start:prod 하면 포트가 이미실행중이다뜨고pm2 start ecosystem.config.js 하면 돌아가지만 서버에러가 해결되지않습니다.그래서 재배포를 하는법이있을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
배포후 서버연결
선생님 안녕하세요배포후 회원가입, 로그인 페이지는 들어가지는데 회원가입,로그인은 안되요.. 그리고 배포할때client에서 npm run build:prod 할때 너무 오래걸리더라고요
- 해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
BaseEntity는 왜 ./Entity에서 import 해오나요?
안녕하세요, 강사님!Entity 생성 시, BaseEntity를 Entity.ts에서 import하시는데 그 이유가 궁금합니다.typeorm에서 바로 import해도 될 것 같은데, Entity.ts에서 import해오는 이유가 뭔지 잘 모르겠어서요!
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
배포후 에러
{ "extends": ["next"]}선생님 안녕하세요.eslintrc.json 변경후 배포하니 잘되었습니다.그런데 커뮤니티 사진 변경시 오류가나서 "message": "Parsing error: Cannot find module 'next/babel'\nRequire stack:\n- C:\\Users\\DELL\\Desktop\\reddit-clone-app\\client\\node_modules\\next\\dist\\compiled\\babel\\bundle.js\n- C:\\Users\\DELL\\Desktop\\reddit-clone-app\\client\\node_modules\\next\\dist\\compiled\\babel\\eslint-parser.js\n- C:\\Users\\DELL\\Desktop\\reddit-clone-app\\client\\node_modules\\eslint-config-next\\parser.js\n- C:\\Users\\DELL\\Desktop\\reddit-clone-app\\client\\node_modules\\@eslint\\eslintrc\\dist\\eslintrc.cjs", "source": "eslint", "startLineNumber": 1, "startColumn": 1, "endLineNumber": 1, "endColumn": 1node_modules 다시설치해보고 했는데 해결이 안되더라구요그러다터미널에서 client,도커, server 실행은되는데 localhost:3000 들어가니 터미널에서 client 오류뜨고localhost:3000에서 server error 가 떳어요Server Error Error: Invalid <Link> with <a> child. Please remove <a> or use <Link legacyBehavior>. Learn more: https://nextjs.org/docs/messages/invalid-new-link-with-extra-anchor This error happened while generating the page. Any console logs will be displayed in the terminal window.server localhost:3000이어서 그런건가요
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
현재 강의랑은 관련없는 질문이지만
혹시 따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기 이 강의 리뉴얼 한다고 공지를 봤는데 혹시 1. 혹시 언제쯤 리뉴얼 강의를 올리시고 2.가격은 어떻게 될지 궁금합니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
pgadmin
pgadmin 연결하는 자료를 보고 그대로 따라했는데 왜 저는 테이블이 없는 상태로 만들어질까요? pgadmin 마스터비밀번호와 docker postgres 비밀번호가 같아야 한다든지 그런 이유일까요??
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
포스트 생성
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)[sub.tsx] -> create.tsx 이부분에서 작업시 404 에러가 간헐적으로 발생해서 확인하여보니타이틀을 한글로 적을경우post.slug가 넘어가지 않아 404 에러가 발생합니다영어는 잘 뜹니다..!어떻게 처리하면 될까요?
- 해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
nextJs13 강의자료 문의
안녕하세요 선생님! 혹시 pdf자료 중 nextJs13 다이어그램에 대한 PDF자료는 어디에 있는지 알 수 있을까요? 기존 자료에는 빠져있는거 같습니다!
- 해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
[서버 실행해서 지금까지 나오는 에러 해결] 부분 진행 중 에러
import "reflect-metadata";^^^^^^SyntaxError: Cannot use import statement outside a module 해당 에러 발생 후 , package.json 파일에type 을 추가 후 실행 하였더니, 충돌 에러가 발생합니다 ㅠ 어떻게 해결 해야 하는지 조언좀 부탁드립니다.https://github.com/bottlesun/study/tree/master/09-redditClone-nextjs
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
강사님 이 코드에서 백틱과 따옴표들이요..
const subs = await AppDataSource.createQueryBuilder() .select( `s.title,s.name,${imageUrlExp} as "imageUrl", count(p.id) as "postCount"` ) .from(Sub, 's') .leftJoin(Post, 'p', `s.name = p."subName"`) .groupBy('s.title, s.name, "imageUrl"') .orderBy(`"postCount"`, 'DESC') .limit(5) .execute(); 위의 코드에서 백틱 ``과 따옴표들 '', "" 사용방식들에대한 기초적인 지식을 쌓으려면 어떻게 검색해보면될까요?일단 제 나름대로 접근식으로는 .from이나 .orderBy 이런건 typeORM 문법인거같아서 찾아보니 문서에는 백틱은 안적혀있는거같고 따옴표로만 작성해준거같아서요.. 혹시 변수가 들어가있으면 ``를써주는게맞나요?근데 .orderBy부분에서 `"postCount"`, 이부분이 좀 이해가 안가는게 백틱에 또 큰따옴표를 감싸주셔서..
- 해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
getServerSideProps 질문있습니다.
useEffect랑은 다른건가요?useEffect는 컴포넌트에 데이터가 바뀌던가, 렌더링이된던가 혹은 return을 설정해서 컴포넌트가 끝나면 처리해주는 요소를 집어넣어주면 되는데 getServerSideProps 는 페이지에서 데이터가 바뀌면 렌더링 시켜주는 차이점이있는건가요? 그럼 만약에 로그인을 안했는데 sub 만들기페이지로 들어가진다면, useEffect를 사용해서 로직을 처리해줘야하나요 아니면 getServerSideProps 를 사용해줘야하나요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
강사님 메인페이지에서 커뮤니티 만들기 버튼을 클릭할때 버그가있는거같아요.
원래 로그인이 안되있는 상태면, 커뮤니티 만들기 페이지에 못들어가고 바로 로그인 페이지로 가줘야하는데그렇지가않습니다. 새로고침을 한번 해줘야 로그인페이지로 가게되네요https://github.com/jungsikjeong/reddit-clone-inflearn제 깃허브 코드인데요, 혹시 제가 잘못입력한게있을까요?여기에 파일이안올라가서 이곳에 올렸습니다. https://www.youtube.com/shorts/YTTxhf1-Oig
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
강사님 pgadmin 설치이후 클라이언트에서 실행이안됩니다
안녕하세요 데이터를 눈으로 보고싶어서 pgadmin설치후, docker-compose.yml 파일과 data-source.ts 을 아무래도 잘못 만진거같아요.. 서버실행에러는 해결했는데, 클라이언트 실행에러는 이런문구가 나오면서 실행이안되네요..제가 실수한게 뭔지 짚어주실수있을까요? 죄송합니다.이건제 깃허브 코드에요https://github.com/jungsikjeong/reddit-clone-inflearn
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
강사님 req.header.cookie에 언제 쿠키를 담아줬는지 궁금합니다.
export const getServerSideProps: GetServerSideProps = async ({ req, res }) => { try { const cookie = req.headers.cookie; console.log(req.headers.cookie); // 쿠키가 없다면 에러를 보냄 if (!cookie) throw new Error('Missing auth token cookie'); // 쿠키가 있다면 그 쿠키를 이용해서 백엔드에서 인증 처리하기 await axios.get('/auth/me', { headers: { cookie } }); return { props: {} }; } catch (error) { // 백엔드에서 요청에서 던져준 쿠키를 이용해 인증 처리할 때 에러가 나면 // login 페이지로 이동 res.writeHead(307, { Location: '/login' }).end(); return { props: {} }; } }; axios.get에 파라미터로 헤더.쿠키 로 넣어준걸까요?근데 순서대로 코드가 동작하게되면 if문에 걸려서 영원히 쿠키가 없어 페이지가 로그인페이지로 이동될텐데 제가 잘못생각한걸까요?두번쨰로 리턴 props:{}로 해주신 이유에대해서 궁금합니다. 다른식으로 그냥 return; 이렇게 작성하고 끝내도 괜찮을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
강사님 몽고디비처럼
제가 사이트에 등록한 데이터들을 볼 수 있는 방법은 없을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
routes/subs.ts 의 topSubs 쿼리빌더에서 sql 오류가 자꾸 발생합니다.
routes/subs.ts 의 topSubs 쿼리빌더에서 sql 오류가 자꾸 발생합니다.수고 많으십니다수업 잘 듣고 있습니다다름이 아니라const topSubs = async (req: Request, res: Response) => { try { const imageUrlExp = `COALESCE(s."imageUrn",'https://www.gravatar.com/avatar?d=mp&f=y')`; const subs = await AppDataSource.createQueryBuilder() .select( `s.title, s.name, ${imageUrlExp} as "imageUrl", count(p.id) as "postCount"` ) .from(Sub, "s") .leftJoin(Post, "p", `s.name = p."subName`) .groupBy('s.title, s.name, "imageUrl"') .orderBy(`"postCount"`, "DESC") .limit(5) .execute(); } catch (error) { console.log(error); return res.status(500).json({ error: "문제가 발생하였습니다" }); } };위 소스를 실행하기 위해http://localhost:4000/api/subs/sub/topSubs를 실행하면{"error":"문제가 발생하였습니다"}같은 에러가 발생하고세부로그를 보면QueryFailedError: 구문 오류, "s" 부근 at PostgresQueryRunner.query (D:\webwork\nextwork\raddit-clone-test-01\server\src\driver\postgres\PostgresQueryRunner.ts:299:19) at processTicksAndRejections (node:internal/process/task_queues:95:5) at async SelectQueryBuilder.execute (D:\webwork\nextwork\raddit-clone-test-01\server\src\query-builder\QueryBuilder.ts:523:20) { query: `SELECT "s"."title", "s"."name", COALESCE(s."imageUrn",'https://www.gravatar.com/avatar?d=mp&f=y') as "imageUrl", count("p"."id") as "postCount" FROM "subs" "s" LEFT JOIN "posts" "p" ON "s"."name" = p."subName GROUP BY "s"."title", "s"."name", "imageUrl" ORDER BY "postCount" DESC LIMIT 5`, parameters: [], driverError: error: 구문 오류, "s" 부근 at Parser.parseErrorMessage (D:\webwork\nextwork\raddit-clone-test-01\server\node_modules\pg-protocol\src\parser.ts:369:69) at Parser.handlePacket (D:\webwork\nextwork\raddit-clone-test-01\server\node_modules\pg-protocol\src\parser.ts:188:21) at Parser.parse (D:\webwork\nextwork\raddit-clone-test-01\server\node_modules\pg-protocol\src\parser.ts:103:30) at Socket.<anonymous> (D:\webwork\nextwork\raddit-clone-test-01\server\node_modules\pg-protocol\src\index.ts:7:48) at Socket.emit (node:events:513:28) at Socket.emit (node:domain:489:12) at addChunk (node:internal/streams/readable:324:12) at readableAddChunk (node:internal/streams/readable:297:9) at Socket.Readable.push (node:internal/streams/readable:234:10) at TCP.onStreamRead (node:internal/stream_base_commons:190:23) { length: 90, severity: '오류', code: '42601', detail: undefined, hint: undefined, position: '220', internalPosition: undefined, internalQuery: undefined, where: undefined, schema: undefined, table: undefined, column: undefined, dataType: undefined, constraint: undefined, file: 'scan.l', line: '1192', routine: 'scanner_yyerror' }, length: 90, severity: '오류', code: '42601', detail: undefined, hint: undefined, position: '220', internalPosition: undefined, internalQuery: undefined, where: undefined, schema: undefined, table: undefined, column: undefined, dataType: undefined, constraint: undefined, file: 'scan.l', line: '1192', routine: 'scanner_yyerror' } GET /api/subs/sub/topSubs 500 35.980 ms - 43 QueryFailedError: 구문 오류, "s" 부근 at PostgresQueryRunner.query (D:\webwork\nextwork\raddit-clone-test-01\server\src\driver\postgres\PostgresQueryRunner.ts:299:19) at processTicksAndRejections (node:internal/process/task_queues:95:5) at async SelectQueryBuilder.execute (D:\webwork\nextwork\raddit-clone-test-01\server\src\query-builder\QueryBuilder.ts:523:20) { query: `SELECT "s"."title", "s"."name", COALESCE(s."imageUrn",'https://www.gravatar.com/avatar?d=mp&f=y') as "imageUrl", count("p"."id") as "postCount" FROM "subs" "s" LEFT JOIN "posts" "p" ON "s"."name" = p."subName GROUP BY "s"."title", "s"."name", "imageUrl" ORDER BY "postCount" DESC LIMIT 5`, parameters: [], driverError: error: 구문 오류, "s" 부근 at Parser.parseErrorMessage (D:\webwork\nextwork\raddit-clone-test-01\server\node_modules\pg-protocol\src\parser.ts:369:69) at Parser.handlePacket (D:\webwork\nextwork\raddit-clone-test-01\server\node_modules\pg-protocol\src\parser.ts:188:21) at Parser.parse (D:\webwork\nextwork\raddit-clone-test-01\server\node_modules\pg-protocol\src\parser.ts:103:30) at Socket.<anonymous> (D:\webwork\nextwork\raddit-clone-test-01\server\node_modules\pg-protocol\src\index.ts:7:48) at Socket.emit (node:events:513:28) at Socket.emit (node:domain:489:12) at addChunk (node:internal/streams/readable:324:12) at readableAddChunk (node:internal/streams/readable:297:9) at Socket.Readable.push (node:internal/streams/readable:234:10) at TCP.onStreamRead (node:internal/stream_base_commons:190:23) { length: 90, severity: '오류', code: '42601', detail: undefined, hint: undefined, position: '220', internalPosition: undefined, internalQuery: undefined, where: undefined, schema: undefined, table: undefined, column: undefined, dataType: undefined, constraint: undefined, file: 'scan.l', line: '1192', routine: 'scanner_yyerror' }, length: 90, severity: '오류', code: '42601', detail: undefined, hint: undefined, position: '220', internalPosition: undefined, internalQuery: undefined, where: undefined, schema: undefined, table: undefined, column: undefined, dataType: undefined, constraint: undefined, file: 'scan.l', line: '1192', routine: 'scanner_yyerror' } GET /api/subs/sub/topSubs 500 6.997 ms - 43와 같습니다.아무리 봐도 에러 원인을 찾지 못해 이렇게 글을 올립니다해결방법을 알려주셨으면 합니다.db는 postgresql 15.1 입니다감사합니다
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
강사님 쿼리 빌더 이해가 잘 안가서 질문있습니다
먼저, .createQueryBuilder('sub') 는 const sub = ... 에서 sub를 뜻하는걸까요?..그리고 아래의 코드에서 lower와toLowerCase() 에 대한 질문입니다. const sub = await AppDataSource.getRepository(Sub) .createQueryBuilder('sub') .where('lower(sub.name = :name', { name: name.toLowerCase() }) .getOne();lower와 toLowerCase()는 옵션같은건가요?toLowerCase()는 이해가 가능한데 lower은 처음보는거라 낯섭니다ㅠㅠ그 커뮤니티가 생성이되면 날짜?빠른게 아래로오는식의 옵션이라고 이해하면될까요?쿼리빌더라는게 db에 정보를 요청하고 변환한 데이터를 받아오는거라고 이해하면될까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
컨텍스트에서 useeffect를 쓰는 이유를 잘모르겠습니다
컨텍스트에서 useeffect를 쓰는 이유를 잘모르겠습니다 login.tsx에dispatch("LOGIN", res.data?.user)수행하게되면 순차적으로 finally 에 따라 dispatch(stop loading) 되게 하려는건가요? dispatch("LOGIN", res.data?.user)라고 적은 시점부터 컨텍스트에 있는 useeffect가 시작되는건가요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
router.get("/me", userMiddleware, authMiddleware, me);
안녕하세요선생님여기서는 왜 post가 아니고 get인가요? 그리고 /me 라는 패스는 싸이트내에서는 직접 보이지않고클라이언트와 서버끼리 정보교환만 하기 위한 루트인가요?싸이트에선 안보이더라구요