월 17,600원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
테이블 관련
해당 강의 여러번 돌려봤지만 npx sequelize db:create 과 관련된 부분이 나오지 않습니다. 그래서 config.json 설정후 npx sequelize db:create 해봤는데 mysql workbench 에 노드버드 테이블 부분에 아무것도 뜨지 않습니다.. 원래 이런건지 아직 안만들어서 그런건지 잘 모르겠습니다..
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
saga 사이드이펙트 질문
1. 예를 들어 로그인이나 로그아웃을하고 로컬스토리지를 삭제하는 로직을 리듀서는 무조건 순수함수여야 하니 saga에서 yield call로 작성하면 될까요? 2. 로컬스토리지로 jwt 토큰을 저장하였을 때 만료기한을 설정할수 없다고 알고있는데 그렇다면 토큰의 만료기한 정보만을 가지고 지우는 등의 제어를 하는건가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
테이블 구조 설정 질문 있습니다.
강좌에서는 hashtag 테이블이 따로 있는데 제가 현재 진행중인 프로젝트에는 게시글을 작성(create)할때 카테고리 설정을 따로 해주어 게시글을 설정하려 합니다. 이후 게시글 목록을 불러올 때는 title 제목 앞에 카테고리가 붙고상단 바에서 카테고리를 클릭하면 해당 카테고리 글들만 불러올수 있게 하려합니다. 그러면 여기서 카테고리 테이블(model)을 따로 만들어야 할지 아니면 게시글 table(model)에 담아야 할지 고민입니다. 조언 주실수 있을까요? [질문 정리] 1. 게시글 작성 시 제목, 카테고리, 글작성 목록이 있음- 각각 title, category, content 테이블을 따로 만들어야 하나요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
로그인을 눌러도 프로필창으로 넘어가지 않아 질문드립니다.
AppLayout.js LoginForm.js 의도대로 잘 작성된 것 같은데 로그인버튼을 클릭해도 프로필로 넘어가지 않아서 뭐가 문제인지 감도 잡히지 않아 질문 올려봅니다..
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
swr... 저장소...
안녕하세요 제로초님 swr이 redux를 대체할수 있다는 것은 swr로 상태관리를 할수 있다는 것인가요? swr이 redux와같이 중앙저장소가 있어서 상태값을 따로 저장해두는 건지... 궁금합니다.useSWR(key, fetcher); 에서 key값이 같을때 같은 데이터를 불러오는 부분이 이해가 안가는데key값은 api url 주소가 될것이고 a 컴포넌트와 b 컴포넌트가 같은 key(url)로 useSWR를 사용한다 하였을 때 결국 a와 b 컴포넌트는 각각 api call을 해주는것 같고 이렇게되면 매번 서버와 통신을 하게되면서 낭비일거같은데 문제가 되지 않는지.. 상태를 저장한다는 개념 보다는 그때 그때 api 통신한다로 이해하면 될까요? 2. redux의 dispatch와 같이 useSWR로 api 콜 시점을 정할수도 있을까요 ? 3. 실무에서 next.js가 아닌 react.js로 프로젝트를 진행한다면 redux(saga), swr, react-query 중에 제로초님이라면 어느것을 선택하시나요?redux를 사용하는것보다 react-query를 사용하는게 요즘 트렌드일까요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
Post 정보에서 태그 정보를 같이 받아오려고 합니다..
안녕하세요 제로초님 노드버드 강좌를 보면서 열심히 공부 중이며 노드버드에서 배운 부분을 조금씩 응용해보려고 하는 중에 질문이 있어서 이렇게 글을 쓰게 되었습니다. 우선 수업과 동일하게 Post table, Tag table이 M:N 다대다 관계를 설정하여 PostTag 라는 테이블이 생성되었습니다. 이것을 이용해서 게시글(Post) 정보를 한번에 불러올때 각 게시글마다 존재하는 태그들도 같이 받아오고 싶습니다. 제가 시도한 방법으로는 findAll 에서 include를 이용해서 받아오려고 했지만 실패했습니다. 제가 설정한 관계와는 맞지 않는 코드의 형태로 에러 메세지가 나오는 것 같습니다. sql 쿼리문의 조인에 대해 지식이 부족하다고 생각하여 조인 부분을 찾아보고 공부를 해도 sequelize 로 어떤식으로 풀어가야 할 지 모르겠습니다 ㅠㅠ 먼저 테이블 정보 입니다. 제가 작성한 코드 부분입니다. 마지막으로 에러메세지 입니다
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
고차함수와 loadFollowers 관련 질문 드립니당
제가 이해한게 맞나 싶어서 질문 드립니다 여기 onCancel 에서 고차함수를 쓴 이유가, 고차함수를 쓰지 않고서 바로 id 를 인자로 넣어주면,<Card onClick={() => onCancel(item.id)} >처럼 되어서 최적화가 안 되어서 그런 건가요? 두 번째 질문은,만일 인스타처럼 다른 사용자의 팔로잉과 팔로워를 보려고 한다면, 해당 사용자의 id를 axios.get() 요청을 보낼 때 params 로 넣어서 조회하는 방법으로도 하면 되는 걸까요? 지금 방법으로는 로그인한 본인의 팔로잉과 팔로워만 불러오는 것만 가능한 것 같아서 여쭤봅니다!
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
백엔드 다중 DB 연결 질문입니다.
쇼핑몰 클론 코딩중에 다중 데이터베이스 연결 방법이 궁금해 질문 드립니다. 하나의 데이터베이스는 Customer용 데이터베이스, 다른 하나의 데이터베이스는 Seller용 데이터 베이스를 나눠서 관리를 해보려 하는데, 실무에서는 위와같이 데이터베이스를 분리해서 사용을 하는지, 아니면 하나의 데이터베이스에서 모두 작동하게 하는지 궁금합니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
게시글 리스트 클릭 시 해당 게시글 불러오기 질문
해당 게시글 리스트 중 하나를 클릭 할 때 정보를 가져와 읽을 수 있는 페이지를 하나 만들었습니다 그런데 여기서 클릭 시 읽기 페이지로 가려면 다이나믹 라우팅을 적용해야 할 지 아니면 다른 방법이 있는건지 조금 헷갈립니다. 현재 백엔드는 구성이 되어 있지않고 더미 데이터만 있는 상황입니다. 그래도 다이나믹 라우팅을 구현할 수 있나요...? 만일 두개다 가능하다면 구글링을 어떻게하고 참고해야 할지 조언 주실수 있나요... <PostWrapper> {mainPosts.length === 0 && <h3>존재하는 게시글이 없습니다.</h3>} {mainPosts.map((data, index) => { return ( <> <Link href="/postFrom"> <div> <ul> <li> <Num>{index + 1}</Num> <Title> <span>[{data.category}]</span> <p>{data.title}</p> </Title> <Count>조회수: {data.count}</Count> <Id>작성자: {data.User.nickname}</Id> </li> </ul> </div> </Link> </> ); })} </PostWrapper> 현재 게시글 리스트 코드입니다..
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
mainPosts in reducer 질문 있습니다
// reducer export const initialState = { mainPosts: [], // 메인 게시글들 imagePaths: [], // 이미지 url hasMorePosts: true, // 가져오려는 시도 loadPostsLoading: false, loadPostsDone: false, loadPostsError: null, addPostLoading: false, addPostDone: false, addPostError: null, }; case LOAD_POSTS_SUCCESS: return { ...state, loadPostsLoading: false, loadPostsDone: true, mainPosts: state.mainPosts.concat(action.data), hasMorePosts: state.mainPosts.length < 50 ? true : false, }; function loadPostsAPI(data) { return axios.get(`http://localhost:3000/posts`, data); } // saga function* loadPosts(action) { try { // const result = yield call(loadPostsAPI, action.data); // console.log('result', result); yield delay(1000); yield put({ type: LOAD_POSTS_SUCCESS, data: action.data, }); } catch (err) { yield put({ type: LOAD_POSTS_FAILURE, data: err.response.data, }); } } LoadPostRequest 시 전체 게시글을 불러오는데 생성된 글이 없습니다. 그럼 mainPost: []가 빈 배열이어야 하는데 ...console.log에 찍힌 결과로는 아래와 같이 undefined가 찍혀 나옵니다. LOAD_POSTS_REQUEST_MainPosts: [undefined] 떄문에 배열에 값이 들어있는 것으로 인식되어 이렇게 에러가 나옵니다. loadPosts 시 데이터가 없을 땐 빈배열로 하고싶은데 도무지 파악이 되질 않습니다. 일부러 immer를 도입하지 않고 불변성을 지키려하는데 혹시 제가 불변성 관련하여 잘 못하고 있는것인지 조언 부탁드립니다.. PS. 게시글을 추가 시 ... mainPosts: dummyPost(action.data).concat(state.mainPosts), ADD_POST_REQUEST 부분은 불변성을 잘 지킨 것인지도 궁금합니다. 질문이 서툴러 죄송합니다. 좀 더 학습해서 질문 수준도 올릴수 있도록 하겠습니다... 참고 github 링크: https://github.com/ko7452/e-Library
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
post 작성하고 백엔드에서 res.status(201).json(fullPost) 하면 프론트로 데이터가 안옵니다.
안녕하세요 선생님. 제가 지금 post를 작성해서 데이터를 백엔드에 보내고 다시 만들어진 데이터를 res.status(201).json(fullPost) 통해서 프론트로 데이터를 받아올려고 하는데 데이터가 받아오질 않습니다. 에러 지금 에러가 아마도 result 값이 'undefined' 여서 45번째줄 result.data 하면 data 라는 프로퍼티 가 없기 때문에 발생한 에러 같습니다. 하지만 백엔드에서는 모든게 정상적으로 처리가 되는걸 확인을 했습니다. 데이터베이스에서 post 데이터가 잘 생성되는것도 확인되고 fullPost 콘솔찍어보면 값도 잘 나오는것을 확인했습니다 . 근데 res.status(201).json(fullPost) 이렇게 프런트로 데이터를 보내도 fullPost가 보내지질 않습니다. ㅜㅜ 몇시간째 헤메고 있습니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요 제로초님 _app.js에서 설정 도중 알 수 없는 에러가 떠서 질문드립니다
구글링도 해보고 찾아보는 중에 있는데 이러한 에러가 떠서 더이상 진행이 되고있지 않습니다 ㅜㅜ Antd/dist/antd.css 임포트 했을때부터 발생한 문제입니다 무슨문제 일까요 ㅜ Browserslist: caniuse-lite is outdated. Please run: npx browserslist@latest --update-db ready - started server on http://localhost:3000 Unknown error from PostCSS plugin. Your current PostCSS version is 7.0.27, but autoprefixer uses 6.0.23. Perhaps this is the source of the error below. error - ./node_modules/antd/dist/antd.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-5-1!./node_modules/next/dist/compiled/postcss-loader??__nextjs_postcss!./node_modules/antd/dist/antd.css) BrowserslistError: Unknown browser query `dead` at Array.reduce (<anonymous>) event - build page: /next/dist/pages/_error wait - compiling... Unknown error from PostCSS plugin. Your current PostCSS version is 7.0.27, but autoprefixer uses 6.0.23. Perhaps this is the source of the error below. error - ./node_modules/antd/dist/antd.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-5-1!./node_modules/next/dist/compiled/postcss-loader??__nextjs_postcss!./node_modules/antd/dist/antd.css) BrowserslistError: Unknown browser query `dead` at Array.reduce (<anonymous>) Error: Cannot find module 'C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\.next\build-manifest.json' Require stack: - C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\next-server\server\load-components.js - C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\next-server\server\api-utils.js - C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\next-server\server\next-server.js - C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\server\next.js - C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\server\lib\start-server.js - C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\cli\next-dev.js - C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\bin\next at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15) at Function.Module._load (internal/modules/cjs/loader.js:725:27) at Module.require (internal/modules/cjs/loader.js:952:19) at require (internal/modules/cjs/helpers.js:88:18) at loadComponents (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\next-server\server\load-components.js:1:886) at DevServer.findPageComponents (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\next-server\server\next-server.js:57:296) at DevServer.renderErrorToHTML (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\next-server\server\next-server.js:108:120) at DevServer.renderErrorToHTML (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\server\next-dev-server.js:34:974) at processTicksAndRejections (internal/process/task_queues.js:93:5) at async DevServer.render (C:\Users\moonj\OneDrive\문서\test-project\practice\react-nodebird\front\node_modules\next\dist\next-server\server\next-server.js:55:236) { code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\\Users\\moonj\\OneDrive\\문서\\test-project\\practice\\react-nodebird\\front\\node_modules\\next\\dist\\next-server\\server\\load-components.js', 'C:\\Users\\moonj\\OneDrive\\문서\\test-project\\practice\\react-nodebird\\front\\node_modules\\next\\dist\\next-server\\server\\api-utils.js', 'C:\\Users\\moonj\\OneDrive\\문서\\test-project\\practice\\react-nodebird\\front\\node_modules\\next\\dist\\next-server\\server\\next-server.js', 'C:\\Users\\moonj\\OneDrive\\문서\\test-project\\practice\\react-nodebird\\front\\node_modules\\next\\dist\\server\\next.js', 'C:\\Users\\moonj\\OneDrive\\문서\\test-project\\practice\\react-nodebird\\front\\node_modules\\next\\dist\\server\\lib\\start-server.js', 'C:\\Users\\moonj\\OneDrive\\문서\\test-project\\practice\\react-nodebird\\front\\node_modules\\next\\dist\\cli\\next-dev.js', 'C:\\Users\\moonj\\OneDrive\\문서\\test-project\\practice\\react-nodebird\\front\\node_modules\\next\\dist\\bin\\next' ] } Unknown error from PostCSS plugin. Your current PostCSS version is 7.0.27, but autoprefixer uses 6.0.23. Perhaps this is the source of the error below. error - ./node_modules/antd/dist/antd.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-5-1!./node_modules/next/dist/compiled/postcss-loader??__nextjs_postcss!./node_modules/antd/dist/antd.css) BrowserslistError: Unknown browser query `dead` at Array.reduce (<anonymous>)
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
node 프론트 서버 질문입니다.
node가 서버가 아닌 자바스크립트 실행 및 http를 통하여 서버 통신을 가능하게 해주는 걸로 배웠습니다. 그러면 node가 3065 서버의 포트를 열리게 해준다면 프론트 서버를 열리게 해주는 곳은 어디인가요? 대부분 npm run start 명령어를 통해 웹사이트가 뜨게 되는데 npm 내장된 어떤거에 열리는건가요? spring에서는 아파치/톰캣을 통해 서버가 열리고 DB에 접근할 수 있는걸로 알고있습니다 지금까지 제가 알고 있는 것에 틀린 부분이 있을까요..?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
next cach가 계속 changes에 뜹니다
안녕하세요 노드버드 강의를 듣고 혼자 next 프로젝트를 만들고 있는데요 항상 changes에 엄청나게 많은 caches 및 static의 파일들도 수정이 되고 있습니다 왜 그런지 궁금하며 어떻게 없앨 수 있는건지 궁금합니다 패키지의 스크립트는 아래와 같습니다 "scripts": { "dev": "next dev", "build": "next build", "start": "next start" },
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
faker.js 자체에 무슨 문제가 있는 걸까요?
faker 를 설치했고 package.json 에도 설치가 완료되었고 딱히 오타도 없는 것 같은데 에러가 떴습니다. 분명 package.json 에도 있는데 import 오류가 왜 날까 싶어서 검색을 해보니 무언가 문제가 있는 것 같아요 아니면 제가 찾은 faker.js 가 아니라 다른 걸까요..?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
toolkit과 saga
안녕하세요 제로초님 질문들의 답변중에 saga를 버리고 toolkit으로 넘어가셨다고 하셨는데 saga와 toolkit은 별개 아닌가요?redux- toolkit을 씀으로써 saga를 redux-toolkit에 내장된 redux-thunk로 대체한다로 이해하면 될까요!?앞장에서는 thunk보다 saga를 추천하셔가지고 위에 가정은 아닌것 같고 toolkit에 비동기 미들웨어를 담당하는 다른 부분이 있는건가요!?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
로그인이 왜 유지되는지 궁금합니다.
현재 강의를 응용하여 프론트는 s3, 백엔드는 ec2에 배포한 뒤 도메인 연결까지 하였습니다. 제 코드가 강의와 차이가 있는데, 왜 그래도 로그인 유지가 잘 되는지 궁금합니다. 제 코드에는 app.use(session({ httoOnly: .., secure:.., domain:.. })) 위 코드를 추가하지 않았습니다. 그래서 인지 애플리케이션 탭의 쿠키에서도 connect.sid가 없습니다. 왜 그런데도 로그인이 유지될까요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
혹시 faker 라이브러리 이슈가생긴거같은데 버전을 낮춰서 쓰는방법이있나요?
npm i @5 faker로 설치해도 6.6.6버전이 설치되면서 오류가 생겨요 https://www.youtube.com/watch?v=KD9NutaY8a4
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
재빌드 및 redux 질문입니다.
1. 재빌드 현재 코드를 수정하고 저정하기 단축키를 누르면 페이지가 자동적으로 새로고침이 안돼서 ctrl + r 로 한번씩 새로고침 하고있습니다 만약 자동적으로 새로고침을 할려면 어떻게 해야하나요? 2. redux 질문 현재 게시물을 작성하면 user와 post 데이터가 sage에서 yield put({ ... }) yield put({ ... }) 데이터가 변경되는 것을 볼 수 있는데요 만약 sage 없으면 다른 reducer의 데이터를 변경할 수 없게되는건가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
에러 문의 드립니다 ㅠㅠ
좋은 강의 잘 듣고 있습니다!! 현재 아래의 에러때문에 이틀째 진도를 나가지 못하고 있습니다. 조언 좀 부탁드립니다. 상황: user의 posts 를 다이나믹 라우팅으로 불러오는 과정에서 에러가 발생합니다. 브라우저 post_saga.js user/[id].js의 SSR 부분 post_action.js 서버 로그 1. 서버의 로그를 보면 데이터는 스토어에 UserInfo와 mainPosts에 데이터는 채워지는 것 같은데 user/[id].jsx의 id에 타입에러가 발생해서 렌더링이 완료되지 못하는 것 같습니다. 찾아봐도 id에 큰 문제가 없어보이는데 어떤 문제인지 조언 주실 수 있나요? 2. Error: "MyDocument.getInitialProps()" should resolve to an object. But found "undefined" instead. 위 에러는 SSR 과정에서 문제가 생기면 대부분 위의 에러로그가 발생하는데 이 로그가 내부적으로 뭘 의미하는 지 궁금합니다. 3. 추가로 SSR을 적용한 후부터 서버로그에 의존할 수 밖에 없어서 디버깅이 좀 힘들어지는데 이 부분도 조언 부탁드립니다! 관련된 코드가 많아서 모두 캡쳐하지는 못해서 필요하시다면 아래의 깃허브 주소로 참고 해주시면 감사하겠습니다. https://github.com/Leo-Xee/react-nodeBird