월 17,600원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
로그인이 안되는데 백엔드까지 되돌리고 싶어요
[Symbol(kSetNoDelay)]: false, [Symbol(kSetKeepAlive)]: true, [Symbol(kSetKeepAliveInitialDelay)]: 60, [Symbol(kBytesRead)]: 1312, [Symbol(kBytesWritten)]: 198, [Symbol(RequestTimeout)]: undefined }, _header: 'GET /user/login/posts?lastId=0 HTTP/1.1\r\n' + 'Accept: application/json, text/plain, /\r\n' + 'Cookie: \r\n' + 'User-Agent: axios/1.1.2\r\n' + 'Accept-Encoding: gzip, deflate, br\r\n' + 'Host: localhost:3060\r\n' + 'Connection: close\r\n' + '\r\n', _keepAliveTimeout: 0, _onPendingData: [Function: nop], agent: Agent { _events: [Object: null prototype], _eventsCount: 2, _maxListeners: undefined, defaultPort: 80, protocol: 'http:', options: [Object: null prototype], requests: [Object: null prototype] {}, sockets: [Object: null prototype], freeSockets: [Object: null prototype] {}, keepAliveMsecs: 1000, keepAlive: false, maxSockets: Infinity, maxFreeSockets: 256, scheduling: 'lifo', maxTotalSockets: Infinity, totalSocketCount: 21, [Symbol(kCapture)]: false }, socketPath: undefined, method: 'GET', maxHeaderSize: undefined, insecureHTTPParser: undefined, path: '/user/login/posts?lastId=0', _ended: true, res: IncomingMessage { _readableState: [ReadableState], _events: [Object: null prototype], _eventsCount: 4, _maxListeners: undefined, socket: [Socket], httpVersionMajor: 1, httpVersionMinor: 1, httpVersion: '1.1', complete: true, rawHeaders: [Array], rawTrailers: [], aborted: false, upgrade: false, url: '', method: null, statusCode: 404, statusMessage: 'Not Found', client: [Socket], _consuming: false, _dumped: false, req: [Circular *1], responseUrl: 'http://localhost:3060/user/login/posts?lastId=0', redirects: [], [Symbol(kCapture)]: false, [Symbol(kHeaders)]: [Object], [Symbol(kHeadersCount)]: 18, [Symbol(kTrailers)]: null, [Symbol(kTrailersCount)]: 0, [Symbol(RequestTimeout)]: undefined }, aborted: false, timeoutCb: null, upgradeOrConnect: false, parser: null, maxHeadersCount: null, reusedSocket: false, host: 'localhost', protocol: 'http:', _redirectable: Writable { _writableState: [WritableState], _events: [Object: null prototype], _eventsCount: 3, _maxListeners: undefined, _options: [Object], _ended: true, _ending: true, _redirectCount: 0, _redirects: [], _requestBodyLength: 0, _requestBodyBuffers: [], _onNativeResponse: [Function (anonymous)], _currentRequest: [Circular *1], _currentUrl: 'http://localhost:3060/user/login/posts?lastId=0', [Symbol(kCapture)]: false }, [Symbol(kCapture)]: false, [Symbol(kBytesWritten)]: 0, [Symbol(kEndCalled)]: true, [Symbol(kNeedDrain)]: false, [Symbol(corked)]: 0, [Symbol(kOutHeaders)]: [Object: null prototype] { accept: [Array], cookie: [Array], 'user-agent': [Array], 'accept-encoding': [Array], host: [Array] }, [Symbol(kUniqueHeaders)]: null }, response: { status: 404, statusText: 'Not Found', headers: AxiosHeaders { 'cache-control': 'no-store, must-revalidate', 'x-powered-by': 'Next.js', etag: '"97a-kcoLbH4v9/9OC6V5ZJ+Im5f6nEk"', 'content-type': 'text/html; charset=utf-8', vary: 'Accept-Encoding', date: 'Tue, 28 Feb 2023 17:16:27 GMT', connection: 'close', 'transfer-encoding': 'chunked', [Symbol(defaults)]: null }, config: { transitional: [Object], adapter: [Function: httpAdapter], transformRequest: [Array], transformResponse: [Array], timeout: 0, xsrfCookieName: 'XSRF-TOKEN', xsrfHeaderName: 'X-XSRF-TOKEN', maxContentLength: -1, maxBodyLength: -1, env: [Object], validateStatus: [Function: validateStatus], headers: [AxiosHeaders], baseURL: 'http://localhost:3060', withCredentials: true, method: 'get', url: '/user/login/posts?lastId=0', data: undefined }, request: <ref *1> ClientRequest { _events: [Object: null prototype], _eventsCount: 7, _maxListeners: undefined, outputData: [], outputSize: 0, writable: true, destroyed: true, _last: true, chunkedEncoding: false, shouldKeepAlive: false, maxRequestsOnConnectionReached: false, _defaultKeepAlive: true, useChunkedEncodingByDefault: false, sendDate: false, _removedConnection: false, _removedContLen: false, _removedTE: false, strictContentLength: false, _contentLength: 0, _hasBody: true, _trailer: '', finished: true, _headerSent: true, _closed: true, socket: [Socket], _header: 'GET /user/login/posts?lastId=0 HTTP/1.1\r\n' + 'Accept: application/json, text/plain, /\r\n' + 'Cookie: \r\n' + 'User-Agent: axios/1.1.2\r\n' + 'Accept-Encoding: gzip, deflate, br\r\n' + 'Host: localhost:3060\r\n' + 'Connection: close\r\n' + '\r\n', _keepAliveTimeout: 0, _onPendingData: [Function: nop], agent: [Agent], socketPath: undefined, method: 'GET', maxHeaderSize: undefined, insecureHTTPParser: undefined, path: '/user/login/posts?lastId=0', _ended: true, res: [IncomingMessage], aborted: false, timeoutCb: null, upgradeOrConnect: false, parser: null, maxHeadersCount: null, reusedSocket: false, host: 'localhost', protocol: 'http:', _redirectable: [Writable], [Symbol(kCapture)]: false, [Symbol(kBytesWritten)]: 0, [Symbol(kEndCalled)]: true, [Symbol(kNeedDrain)]: false, [Symbol(corked)]: 0, [Symbol(kOutHeaders)]: [Object: null prototype], [Symbol(kUniqueHeaders)]: null }, data: '<!DOCTYPE html><html><head><style data-next-hide-fouc="true">body{display:none}</style><noscript data-next-hide-fouc="true"><style>body{display:block}</style></noscript><meta name="viewport" content="width=device-width"/><meta charSet="utf-8"/><title>: An unexpected error has occurred</title><noscript data-n-css="true"></noscript><link rel="preload" href="/_next/static/chunks/main.js?ts=1677604587215" as="script"/><link rel="preload" href="/_next/static/chunks/webpack.js?ts=1677604587215" as="script"/><link rel="preload" href="/_next/static/chunks/pages/_app.js?ts=1677604587215" as="script"/><noscript id="__next_css__DO_NOT_USE__"></noscript><style data-styled="" data-styled-version="5.3.6"></style></head><body><script src="https://polyfill.io/v3/polyfill.min.js?features=default%2Cdom4%2Ces2015%2Ces2016%2Ces2017%2Ces2018%2Ces2019%2Ces2022%2Ces2021%2Ces2020"></script><div id="__next"><div style="color:#000;background:#fff;font-family:-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif;height:100vh;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center"><div><style>body { margin: 0 }</style><div style="display:inline-block;text-align:left;line-height:49px;height:49px;vertical-align:middle"><h2 style="font-size:14px;font-weight:normal;line-height:inherit;margin:0;padding:0">An unexpected error has occurred<!-- -->.</h2></div></div></div></div><script src="/_next/static/chunks/react-refresh.js?ts=1677604587215"></script><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{"lastId":"0"},"buildId":"development","isFallback":false,"gip":true,"head":[["meta",{"name":"viewport","content":"width=device-width"}],["meta",{"charSet":"utf-8"}],["title",{"children":": An unexpected error has occurred"}]]}</script><script nomodule="" src="/_next/static/chunks/polyfills.js?ts=1677604587215"></script><script src="/_next/static/chunks/main.js?ts=1677604587215"></script><script src="/_next/static/chunks/webpack.js?ts=1677604587215"></script><script src="/_next/static/chunks/pages/_app.js?ts=1677604587215"></script><script src="/_next/static/development/_buildManifest.js?ts=1677604587215"></script><script src="/_next/static/development/_ssgManifest.js?ts=1677604587215"></script></body></html>' } } { type: 'LOAD_USER_POSTS_FAILURE', error: '<!DOCTYPE html><html><head><style data-next-hide-fouc="true">body{display:none}</style><noscript data-next-hide-fouc="true"><style>body{display:block}</style></noscript><meta name="viewport" content="width=device-width"/><meta charSet="utf-8"/><title>: An unexpected error has occurred</title><noscript data-n-css="true"></noscript><link rel="preload" href="/_next/static/chunks/main.js?ts=1677604587215" as="script"/><link rel="preload" href="/_next/static/chunks/webpack.js?ts=1677604587215" as="script"/><link rel="preload" href="/_next/static/chunks/pages/_app.js?ts=1677604587215" as="script"/><noscript id="__next_css__DO_NOT_USE__"></noscript><style data-styled="" data-styled-version="5.3.6"></style></head><body><script src="https://polyfill.io/v3/polyfill.min.js?features=default%2Cdom4%2Ces2015%2Ces2016%2Ces2017%2Ces2018%2Ces2019%2Ces2022%2Ces2021%2Ces2020"></script><div id="__next"><div style="color:#000;background:#fff;font-family:-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif;height:100vh;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center"><div><style>body { margin: 0 }</style><div style="display:inline-block;text-align:left;line-height:49px;height:49px;vertical-align:middle"><h2 style="font-size:14px;font-weight:normal;line-height:inherit;margin:0;padding:0">An unexpected error has occurred<!-- -->.</h2></div></div></div></div><script src="/_next/static/chunks/react-refresh.js?ts=1677604587215"></script><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{"lastId":"0"},"buildId":"development","isFallback":false,"gip":true,"head":[["meta",{"name":"viewport","content":"width=device-width"}],["meta",{"charSet":"utf-8"}],["title",{"children":": An unexpected error has occurred"}]]}</script><script nomodule="" src="/_next/static/chunks/polyfills.js?ts=1677604587215"></script><script src="/_next/static/chunks/main.js?ts=1677604587215"></script><script src="/_next/static/chunks/webpack.js?ts=1677604587215"></script><script src="/_next/static/chunks/pages/_app.js?ts=1677604587215"></script><script src="/_next/static/development/_buildManifest.js?ts=1677604587215"></script><script src="/_next/static/development/_ssgManifest.js?ts=1677604587215"></script></body></html>' } 1. getProps created store with state { user: { loadMyInfoLoading: false, loadMyInfoDone: false, loadMyInfoError: null, loadUserLoading: false, loadUserDone: false, loadUserError: null, followLoading: false, followDone: false, followError: null, unfollowLoading: false, unfollowDone: false, unfollowError: null, logInLoading: false, logInDone: false, logInError: null, logOutLoading: false, logOutDone: false, logOutError: null, signUpLoading: false, signUpDone: false, signUpError: null, changeNicknameLoading: false, changeNicknameDone: false, changeNicknameError: null, loadFollowingsLoading: false, loadFollowingsDone: false, loadFollowingsError: null, loadFollowersLoading: false, loadFollowersDone: false, loadFollowersError: null, removeFollowerLoading: false, removeFollowerDone: false, removeFollowerError: null, me: null, userInfo: null }, post: { mainPosts: [], singlePost: null, imagePaths: [], hasMorePosts: true, likePostLoading: false, likePostDone: false, likePostError: null, unlikePostLoading: false, unlikePostDone: false, unlikePostError: null, loadPostLoading: false, loadPostDone: false, loadPostError: null, loadPostsLoading: false, loadPostsDone: false, loadPostsError: null, addPostLoading: false, addPostDone: false, addPostError: null, removePostLoading: false, removePostDone: false, removePostError: null, addCommentLoading: false, addCommentDone: false, addCommentError: null, uploadImagesLoading: false, uploadImagesDone: false, uploadImagesError: null, retweetLoading: false, retweetDone: false, retweetError: null } } { type: 'LOAD_USER_POSTS_REQUEST', data: 'login' } { type: 'LOAD_MY_INFO_REQUEST' } { type: 'LOAD_USER_REQUEST', data: 'login' } { type: '@@redux-saga/CHANNEL_END' } 4. WrappedApp created new store with withRedux(NodeBird) { initialState: undefined, initialStateFromGSPorGSSR: undefined } 4. WrappedApp created new store with withRedux(NodeBird) { initialState: undefined, initialStateFromGSPorGSSR: undefined } AxiosError: Request failed with status code 404 at settle (C:\JS_workspace\React\js_prepare\front\node_modules\axios\dist\node\axios.cjs:1261:12) at Unzip.handleStreamEnd (C:\JS_workspace\React\js_prepare\front\node_modules\axios\dist\node\axios.cjs:2444:11) at Unzip.emit (node:events:525:35) at endReadableNT (node:internal/streams/readable:1358:12) at processTicksAndRejections (node:internal/process/task_queues:83:21) { code: 'ERR_BAD_REQUEST', config: { transitional: { silentJSONParsing: true, forcedJSONParsing: true, clarifyTimeoutError: false }, adapter: [Function: httpAdapter], transformRequest: [ [Function: transformRequest] ], transformResponse: [ [Function: transformResponse] ], timeout: 0, xsrfCookieName: 'XSRF-TOKEN', xsrfHeaderName: 'X-XSRF-TOKEN', maxContentLength: -1, maxBodyLength: -1, env: { FormData: [Function], Blob: null }, validateStatus: [Function: validateStatus], headers: AxiosHeaders { Cookie: '', 'User-Agent': 'axios/1.1.2', 'Accept-Encoding': 'gzip, deflate, br', [Symbol(defaults)]: [Object] }, baseURL: 'http://localhost:3060', withCredentials: true, method: 'get', url: '/user/login/posts?lastId=0', data: undefined }, request: <ref *1> ClientRequest { _events: [Object: null prototype] { abort: [Function (anonymous)], aborted: [Function (anonymous)], connect: [Function (anonymous)], error: [Function (anonymous)], socket: [Function (anonymous)], timeout: [Function (anonymous)], finish: [Function: requestOnFinish] }, _eventsCount: 7, _maxListeners: undefined, outputData: [], outputSize: 0, writable: true, destroyed: true, _last: true, chunkedEncoding: false, shouldKeepAlive: false, maxRequestsOnConnectionReached: false, _defaultKeepAlive: true, useChunkedEncodingByDefault: false, sendDate: false, _removedConnection: false, _removedContLen: false, _removedTE: false, strictContentLength: false, _contentLength: 0, _hasBody: true, _trailer: '', finished: true, _headerSent: true, _closed: true, socket: Socket { connecting: false, _hadError: false, _parent: null, _host: 'localhost', _closeAfterHandlingError: false, _readableState: [ReadableState], _events: [Object: null prototype], _eventsCount: 6, _maxListeners: undefined, _writableState: [WritableState], allowHalfOpen: false, _sockname: null, _pendingData: null, _pendingEncoding: '', server: null, _server: null, parser: null, _httpMessage: [Circular *1], [Symbol(async_id_symbol)]: 965656, [Symbol(kHandle)]: null, [Symbol(lastWriteQueueSize)]: 0, [Symbol(timeout)]: null, [Symbol(kBuffer)]: null, [Symbol(kBufferCb)]: null, [Symbol(kBufferGen)]: null, [Symbol(kCapture)]: false, [Symbol(kSetNoDelay)]: false, [Symbol(kSetKeepAlive)]: true, [Symbol(kSetKeepAliveInitialDelay)]: 60, [Symbol(kBytesRead)]: 1312, [Symbol(kBytesWritten)]: 198, [Symbol(RequestTimeout)]: undefined }, _header: 'GET /user/login/posts?lastId=0 HTTP/1.1\r\n' + 'Accept: application/json, text/plain, /\r\n' + 'Cookie: \r\n' + 'User-Agent: axios/1.1.2\r\n' + 'Accept-Encoding: gzip, deflate, br\r\n' + 'Host: localhost:3060\r\n' + 'Connection: close\r\n' + '\r\n', _keepAliveTimeout: 0, _onPendingData: [Function: nop], agent: Agent { _events: [Object: null prototype], _eventsCount: 2, _maxListeners: undefined, defaultPort: 80, protocol: 'http:', options: [Object: null prototype], requests: [Object: null prototype] {}, sockets: [Object: null prototype], freeSockets: [Object: null prototype] {}, keepAliveMsecs: 1000, keepAlive: false, maxSockets: Infinity, maxFreeSockets: 256, scheduling: 'lifo', maxTotalSockets: Infinity, totalSocketCount: 23, [Symbol(kCapture)]: false }, socketPath: undefined, method: 'GET', maxHeaderSize: undefined, insecureHTTPParser: undefined, path: '/user/login/posts?lastId=0', _ended: true, res: IncomingMessage { _readableState: [ReadableState], _events: [Object: null prototype], _eventsCount: 4, _maxListeners: undefined, socket: [Socket], httpVersionMajor: 1, httpVersionMinor: 1, httpVersion: '1.1', complete: true, rawHeaders: [Array], rawTrailers: [], aborted: false, upgrade: false, url: '', method: null, statusCode: 404, statusMessage: 'Not Found', client: [Socket], _consuming: false, _dumped: false, req: [Circular *1], responseUrl: 'http://localhost:3060/user/login/posts?lastId=0', redirects: [], [Symbol(kCapture)]: false, [Symbol(kHeaders)]: [Object], [Symbol(kHeadersCount)]: 18, [Symbol(kTrailers)]: null, [Symbol(kTrailersCount)]: 0, [Symbol(RequestTimeout)]: undefined }, aborted: false, timeoutCb: null, upgradeOrConnect: false, parser: null, maxHeadersCount: null, reusedSocket: false, host: 'localhost', protocol: 'http:', _redirectable: Writable { _writableState: [WritableState], _events: [Object: null prototype], _eventsCount: 3, _maxListeners: undefined, _options: [Object], _ended: true, _ending: true, _redirectCount: 0, _redirects: [], _requestBodyLength: 0, _requestBodyBuffers: [], _onNativeResponse: [Function (anonymous)], _currentRequest: [Circular *1], _currentUrl: 'http://localhost:3060/user/login/posts?lastId=0', [Symbol(kCapture)]: false }, [Symbol(kCapture)]: false, [Symbol(kBytesWritten)]: 0, [Symbol(kEndCalled)]: true, [Symbol(kNeedDrain)]: false, [Symbol(corked)]: 0, [Symbol(kOutHeaders)]: [Object: null prototype] { accept: [Array], cookie: [Array], 'user-agent': [Array], 'accept-encoding': [Array], host: [Array] }, [Symbol(kUniqueHeaders)]: null }, response: { status: 404, statusText: 'Not Found', headers: AxiosHeaders { 'cache-control': 'no-store, must-revalidate', 'x-powered-by': 'Next.js', etag: '"97a-oa4gEZ9VQR+Dh2MJsRlW/Zuu95Q"', 'content-type': 'text/html; charset=utf-8', vary: 'Accept-Encoding', date: 'Tue, 28 Feb 2023 17:16:27 GMT', connection: 'close', 'transfer-encoding': 'chunked', [Symbol(defaults)]: null }, config: { transitional: [Object], adapter: [Function: httpAdapter], transformRequest: [Array], transformResponse: [Array], timeout: 0, xsrfCookieName: 'XSRF-TOKEN', xsrfHeaderName: 'X-XSRF-TOKEN', maxContentLength: -1, maxBodyLength: -1, env: [Object], validateStatus: [Function: validateStatus], headers: [AxiosHeaders], baseURL: 'http://localhost:3060', withCredentials: true, method: 'get', url: '/user/login/posts?lastId=0', data: undefined }, request: <ref *1> ClientRequest { _events: [Object: null prototype], _eventsCount: 7, _maxListeners: undefined, outputData: [], outputSize: 0, writable: true, destroyed: true, _last: true, chunkedEncoding: false, shouldKeepAlive: false, maxRequestsOnConnectionReached: false, _defaultKeepAlive: true, useChunkedEncodingByDefault: false, sendDate: false, _removedConnection: false, _removedContLen: false, _removedTE: false, strictContentLength: false, _contentLength: 0, _hasBody: true, _trailer: '', finished: true, _headerSent: true, _closed: true, socket: [Socket], _header: 'GET /user/login/posts?lastId=0 HTTP/1.1\r\n' + 'Accept: application/json, text/plain, /\r\n' + 'Cookie: \r\n' + 'User-Agent: axios/1.1.2\r\n' + 'Accept-Encoding: gzip, deflate, br\r\n' + 'Host: localhost:3060\r\n' + 'Connection: close\r\n' + '\r\n', _keepAliveTimeout: 0, _onPendingData: [Function: nop], agent: [Agent], socketPath: undefined, method: 'GET', maxHeaderSize: undefined, insecureHTTPParser: undefined, path: '/user/login/posts?lastId=0', _ended: true, res: [IncomingMessage], aborted: false, timeoutCb: null, upgradeOrConnect: false, parser: null, maxHeadersCount: null, reusedSocket: false, host: 'localhost', protocol: 'http:', _redirectable: [Writable], [Symbol(kCapture)]: false, [Symbol(kBytesWritten)]: 0, [Symbol(kEndCalled)]: true, [Symbol(kNeedDrain)]: false, [Symbol(corked)]: 0, [Symbol(kOutHeaders)]: [Object: null prototype], [Symbol(kUniqueHeaders)]: null }, data: '<!DOCTYPE html><html><head><style data-next-hide-fouc="true">body{display:none}</style><noscript data-next-hide-fouc="true"><style>body{display:block}</style></noscript><meta name="viewport" content="width=device-width"/><meta charSet="utf-8"/><title>: An unexpected error has occurred</title><noscript data-n-css="true"></noscript><link rel="preload" href="/_next/static/chunks/main.js?ts=1677604587289" as="script"/><link rel="preload" href="/_next/static/chunks/webpack.js?ts=1677604587289" as="script"/><link rel="preload" href="/_next/static/chunks/pages/_app.js?ts=1677604587289" as="script"/><noscript id="__next_css__DO_NOT_USE__"></noscript><style data-styled="" data-styled-version="5.3.6"></style></head><body><script src="https://polyfill.io/v3/polyfill.min.js?features=default%2Cdom4%2Ces2015%2Ces2016%2Ces2017%2Ces2018%2Ces2019%2Ces2022%2Ces2021%2Ces2020"></script><div id="__next"><div style="color:#000;background:#fff;font-family:-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif;height:100vh;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center"><div><style>body { margin: 0 }</style><div style="display:inline-block;text-align:left;line-height:49px;height:49px;vertical-align:middle"><h2 style="font-size:14px;font-weight:normal;line-height:inherit;margin:0;padding:0">An unexpected error has occurred<!-- -->.</h2></div></div></div></div><script src="/_next/static/chunks/react-refresh.js?ts=1677604587289"></script><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{"lastId":"0"},"buildId":"development","isFallback":false,"gip":true,"head":[["meta",{"name":"viewport","content":"width=device-width"}],["meta",{"charSet":"utf-8"}],["title",{"children":": An unexpected error has occurred"}]]}</script><script nomodule="" src="/_next/static/chunks/polyfills.js?ts=1677604587289"></script><script src="/_next/static/chunks/main.js?ts=1677604587289"></script><script src="/_next/static/chunks/webpack.js?ts=1677604587289"></script><script src="/_next/static/chunks/pages/_app.js?ts=1677604587289"></script><script src="/_next/static/development/_buildManifest.js?ts=1677604587289"></script><script src="/_next/static/development/_ssgManifest.js?ts=1677604587289"></script></body></html>' } } { type: 'LOAD_USER_POSTS_FAILURE', error: '<!DOCTYPE html><html><head><style data-next-hide-fouc="true">body{display:none}</style><noscript data-next-hide-fouc="true"><style>body{display:block}</style></noscript><meta name="viewport" content="width=device-width"/><meta charSet="utf-8"/><title>: An unexpected error has occurred</title><noscript data-n-css="true"></noscript><link rel="preload" href="/_next/static/chunks/main.js?ts=1677604587289" as="script"/><link rel="preload" href="/_next/static/chunks/webpack.js?ts=1677604587289" as="script"/><link rel="preload" href="/_next/static/chunks/pages/_app.js?ts=1677604587289" as="script"/><noscript id="__next_css__DO_NOT_USE__"></noscript><style data-styled="" data-styled-version="5.3.6"></style></head><body><script src="https://polyfill.io/v3/polyfill.min.js?features=default%2Cdom4%2Ces2015%2Ces2016%2Ces2017%2Ces2018%2Ces2019%2Ces2022%2Ces2021%2Ces2020"></script><div id="__next"><div style="color:#000;background:#fff;font-family:-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif;height:100vh;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center"><div><style>body { margin: 0 }</style><div style="display:inline-block;text-align:left;line-height:49px;height:49px;vertical-align:middle"><h2 style="font-size:14px;font-weight:normal;line-height:inherit;margin:0;padding:0">An unexpected error has occurred<!-- -->.</h2></div></div></div></div><script src="/_next/static/chunks/react-refresh.js?ts=1677604587289"></script><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{"lastId":"0"},"buildId":"development","isFallback":false,"gip":true,"head":[["meta",{"name":"viewport","content":"width=device-width"}],["meta",{"charSet":"utf-8"}],["title",{"children":": An unexpected error has occurred"}]]}</script><script nomodule="" src="/_next/static/chunks/polyfills.js?ts=1677604587289"></script><script src="/_next/static/chunks/main.js?ts=1677604587289"></script><script src="/_next/static/chunks/webpack.js?ts=1677604587289"></script><script src="/_next/static/chunks/pages/_app.js?ts=1677604587289"></script><script src="/_next/static/development/_buildManifest.js?ts=1677604587289"></script><script src="/_next/static/development/_ssgManifest.js?ts=1677604587289"></script></body></html>' } AxiosError: Request failed with status code 404 at settle (C:\JS_workspace\React\js_prepare\front\node_modules\axios\dist\node\axios.cjs:1261:12) at Unzip.handleStreamEnd (C:\JS_workspace\React\js_prepare\front\node_modules\axios\dist\node\axios.cjs:2444:11) at Unzip.emit (node:events:525:35) at endReadableNT (node:internal/streams/readable:1358:12) at processTicksAndRejections (node:internal/process/task_queues:83:21) { code: 'ERR_BAD_REQUEST', config: { transitional: { silentJSONParsing: true, forcedJSONParsing: true, clarifyTimeoutError: false }, adapter: [Function: httpAdapter], transformRequest: [ [Function: transformRequest] ], transformResponse: [ [Function: transformResponse] ], timeout: 0, xsrfCookieName: 'XSRF-TOKEN', xsrfHeaderName: 'X-XSRF-TOKEN', maxContentLength: -1, maxBodyLength: -1, env: { FormData: [Function], Blob: null }, validateStatus: [Function: validateStatus], headers: AxiosHeaders { Cookie: '', 'User-Agent': 'axios/1.1.2', 'Accept-Encoding': 'gzip, deflate, br', [Symbol(defaults)]: [Object] }, baseURL: 'http://localhost:3060', withCredentials: true, method: 'get', url: '/user', data: undefined }, request: <ref *1> ClientRequest { _events: [Object: null prototype] { abort: [Function (anonymous)], aborted: [Function (anonymous)], connect: [Function (anonymous)], error: [Function (anonymous)], socket: [Function (anonymous)], timeout: [Function (anonymous)], finish: [Function: requestOnFinish] }, _eventsCount: 7, _maxListeners: undefined, outputData: [], outputSize: 0, writable: true, destroyed: true, _last: true, chunkedEncoding: false, shouldKeepAlive: false, maxRequestsOnConnectionReached: false, _defaultKeepAlive: true, useChunkedEncodingByDefault: false, sendDate: false, _removedConnection: false, _removedContLen: false, _removedTE: false, strictContentLength: false, _contentLength: 0, _hasBody: true, _trailer: '', finished: true, _headerSent: true, _closed: true, socket: Socket { connecting: false, _hadError: false, _parent: null, _host: 'localhost', _closeAfterHandlingError: false, _readableState: [ReadableState], _events: [Object: null prototype], _eventsCount: 6, _maxListeners: undefined, _writableState: [WritableState], allowHalfOpen: false, _sockname: null, _pendingData: null, _pendingEncoding: '', server: null, _server: null, parser: null, _httpMessage: [Circular *1], [Symbol(async_id_symbol)]: 965660, [Symbol(kHandle)]: null, [Symbol(lastWriteQueueSize)]: 0, [Symbol(timeout)]: null, [Symbol(kBuffer)]: null, [Symbol(kBufferCb)]: null, [Symbol(kBufferGen)]: null, [Symbol(kCapture)]: false, [Symbol(kSetNoDelay)]: false, [Symbol(kSetKeepAlive)]: true, [Symbol(kSetKeepAliveInitialDelay)]: 60, [Symbol(kBytesRead)]: 1307, [Symbol(kBytesWritten)]: 177, [Symbol(RequestTimeout)]: undefined }, _header: 'GET /user HTTP/1.1\r\n' + 'Accept: application/json, text/plain, /\r\n' + 'Cookie: \r\n' + 'User-Agent: axios/1.1.2\r\n' + 'Accept-Encoding: gzip, deflate, br\r\n' + 'Host: localhost:3060\r\n' + 'Connection: close\r\n' + '\r\n', _keepAliveTimeout: 0, _onPendingData: [Function: nop], agent: Agent { _events: [Object: null prototype], _eventsCount: 2, _maxListeners: undefined, defaultPort: 80, protocol: 'http:', options: [Object: null prototype], requests: [Object: null prototype] {}, sockets: [Object: null prototype], freeSockets: [Object: null prototype] {}, keepAliveMsecs: 1000, keepAlive: false, maxSockets: Infinity, maxFreeSockets: 256, scheduling: 'lifo', maxTotalSockets: Infinity, totalSocketCount: 22, [Symbol(kCapture)]: false }, socketPath: undefined, method: 'GET', maxHeaderSize: undefined, insecureHTTPParser: undefined, path: '/user', _ended: true, res: IncomingMessage { _readableState: [ReadableState], _events: [Object: null prototype], _eventsCount: 4, _maxListeners: undefined, socket: [Socket], httpVersionMajor: 1, httpVersionMinor: 1, httpVersion: '1.1', complete: true, rawHeaders: [Array], rawTrailers: [], aborted: false, upgrade: false, url: '', method: null, statusCode: 404, statusMessage: 'Not Found', client: [Socket], _consuming: false, _dumped: false, req: [Circular *1], responseUrl: 'http://localhost:3060/user', redirects: [], [Symbol(kCapture)]: false, [Symbol(kHeaders)]: [Object], [Symbol(kHeadersCount)]: 18, [Symbol(kTrailers)]: null, [Symbol(kTrailersCount)]: 0, [Symbol(RequestTimeout)]: undefined }, aborted: false, timeoutCb: null, upgradeOrConnect: false, parser: null, maxHeadersCount: null, reusedSocket: false, host: 'localhost', protocol: 'http:', _redirectable: Writable { _writableState: [WritableState], _events: [Object: null prototype], _eventsCount: 3, _maxListeners: undefined, _options: [Object], _ended: true, _ending: true, _redirectCount: 0, _redirects: [], _requestBodyLength: 0, _requestBodyBuffers: [], _onNativeResponse: [Function (anonymous)], _currentRequest: [Circular *1], _currentUrl: 'http://localhost:3060/user', [Symbol(kCapture)]: false }, [Symbol(kCapture)]: false, [Symbol(kBytesWritten)]: 0, [Symbol(kEndCalled)]: true, [Symbol(kNeedDrain)]: false, [Symbol(corked)]: 0, [Symbol(kOutHeaders)]: [Object: null prototype] { accept: [Array], cookie: [Array], 'user-agent': [Array], 'accept-encoding': [Array], host: [Array] }, [Symbol(kUniqueHeaders)]: null }, response: { status: 404, statusText: 'Not Found', headers: AxiosHeaders { 'cache-control': 'no-store, must-revalidate', 'x-powered-by': 'Next.js', etag: '"96e-3UMFuq1OQMITCj8aIaMUGQiLzzU"', 'content-type': 'text/html; charset=utf-8', vary: 'Accept-Encoding', date: 'Tue, 28 Feb 2023 17:16:27 GMT', connection: 'close', 'transfer-encoding': 'chunked', [Symbol(defaults)]: null }, config: { transitional: [Object], adapter: [Function: httpAdapter], transformRequest: [Array], transformResponse: [Array], timeout: 0, xsrfCookieName: 'XSRF-TOKEN', xsrfHeaderName: 'X-XSRF-TOKEN', maxContentLength: -1, maxBodyLength: -1, env: [Object], validateStatus: [Function: validateStatus], headers: [AxiosHeaders], baseURL: 'http://localhost:3060', withCredentials: true, method: 'get', url: '/user', data: undefined }, request: <ref *1> ClientRequest { _events: [Object: null prototype], _eventsCount: 7, _maxListeners: undefined, outputData: [], outputSize: 0, writable: true, destroyed: true, _last: true, chunkedEncoding: false, shouldKeepAlive: false, maxRequestsOnConnectionReached: false, _defaultKeepAlive: true, useChunkedEncodingByDefault: false, sendDate: false, _removedConnection: false, _removedContLen: false, _removedTE: false, strictContentLength: false, _contentLength: 0, _hasBody: true, _trailer: '', finished: true, _headerSent: true, _closed: true, socket: [Socket], _header: 'GET /user HTTP/1.1\r\n' + 'Accept: application/json, text/plain, /\r\n' + 'Cookie: \r\n' + 'User-Agent: axios/1.1.2\r\n' + 'Accept-Encoding: gzip, deflate, br\r\n' + 'Host: localhost:3060\r\n' + 'Connection: close\r\n' + '\r\n', _keepAliveTimeout: 0, _onPendingData: [Function: nop], agent: [Agent], socketPath: undefined, method: 'GET', maxHeaderSize: undefined, insecureHTTPParser: undefined, path: '/user', _ended: true, res: [IncomingMessage], aborted: false, timeoutCb: null, upgradeOrConnect: false, parser: null, maxHeadersCount: null, reusedSocket: false, host: 'localhost', protocol: 'http:', _redirectable: [Writable], <h2 style="font-size:14px;font-weight:normal;line-height:inherit;margin:0;padding:0">An unexpected error has occurred<!-- -->.</h2></div></div></div></div><script src="/_next/static/chunks/react-refresh.js?ts=1677604587296"></script><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{},"buildId":"development","isFallback":false,"gip":true,"head":[["meta",{"name":"viewport","content":"width=device-width"}],["meta",{"charSet":"utf-8"}],["title",{"children":": An unexpected error has occurred"}]]}</script><script nomodule="" src="/_next/static/chunks/polyfills.js?ts=1677604587296"></script><script src="/_next/static/chunks/main.js?ts=1677604587296"></script><script src="/_next/static/chunks/webpack.js?ts=1677604587296"></script><script src="/_next/static/chunks/pages/_app.js?ts=1677604587296"></script><script src="/_next/static/development/_buildManifest.js?ts=1677604587296"></script><script src="/_next/static/development/_ssgManifest.js?ts=1677604587296"></script></body></html>' }}무한 콘솔창 뜨는거 중간에 강제로 끊었습니다 back-jsonfront-jsonapp.jsconst express = require('express'); const cors = require('cors'); const session = require('express-session'); const cookieParser = require('cookie-parser'); const passport = require('passport'); const dotenv = require('dotenv'); const morgan = require('morgan'); const path = require('path'); const hpp = require('hpp'); const helmet = require('helmet'); const postRouter = require('./routes/post'); const postsRouter = require('./routes/posts'); const userRouter = require('./routes/user'); const hashtagRouter = require('./routes/hashtag'); const db = require('./models'); const passportConfig = require('./passport'); dotenv.config(); const app = express(); db.sequelize.sync() .then(() => { console.log('db 연결 성공'); }) .catch(console.error); passportConfig(); if (process.env.NODE_ENV === 'production') { app.use(morgan('combined')); app.use(hpp()); app.use(helmet()); } else { app.use(morgan('dev')); } app.use(cors({ origin: ['http://localhost:3060', 'nodebird.com'], credentials: true // cookie 전달 })); app.use('/', express.static(path.join(__dirname, 'uploads'))); app.use(express.json()); // app.use(express.urlencoded({ extended: true })); app.use(cookieParser('nodebirdsecret')); app.use(session()); app.use(passport.initialize()); app.use(passport.session({ saveUninitialized: false, resave: false, secret: process.env.COOKIE_SECRET })); app.get('/', (req, res) => { res.send('hello express'); }); app.use('/posts', postsRouter); app.use('/post', postRouter); app.use('/user', userRouter); app.use('/hashtag', hashtagRouter); app.listen(3065, () => { console.log('서버 실행중!'); }); 이전에 했던거 되돌리고싶어요백엔드까지 했던곳으로 되돌리고 다시하고 싶은데 로그인하면 이렇게 무한로딩 되면서 이상한 콘솔창 무한으로 뜹니다 서버 에러 같은데 어딘지 모르겠습니다port ? 404 에러 , asios 에러 ?로그인 안되는데 찾을수가 없습니다
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
시퀄라이즈 관계성 맺은 테이블 수정 질문
안녕하세요 선생님.시퀄라이즈에서 모델 끼리 관계성을 맺어서 route에서 const post = await Post.create({'이하 생략'}); 이런 식으로 하면 Post가 Hashtag와 관계성이 있을 때 post.addHashtags를 할 수 있다는건 알겠는데..이건 create시에만 쓸 수 있는 건가요?이런 질문을 드리는 이유는 게시글에서 해시태그를 수정하려 하니까 일단 Post.update를 해야 하는데, 그러면 따로 Hashtag테이블에 있는 해시태그를 수정하려니까 중간 테이블이 있어서 쉽지 않을것 같아 그냥 row query로 Hashtag중간테이블에서 게시글 아이디를 지워버리고 다시 해시태그를 생성하려고 post.addHashtags를 사용하고 싶어서 그렇습니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
로그인 회원가입 404 (Not Found)
로그인 회원가입시 이런 오류코드가 뜨는데, DB와 백엔드 연결에서 문제가 나는 건가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
deserializeUser 에서 user 사용 req.user 언디파인드
routes/post.js 게시글 등록 요청시User객체에 id값을 req.user.id로 설정하려하는데에러나서 req.user 콘솔 찍어보면 undefined 가 출력됩니다.passport/index.js 에서 deserializeUser 를 통해 user값이 req.user로 세팅되는걸로 들었는데 반환값이 없네요 ..passport.deserializeUser()에 console.log 찍어보면 아무것도 출력되는게 없습니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
passport.initialize not function 에러 ..
const express = require('express'); const session = require('express-session'); const cookieParser = require('cookie-parser'); const cors = require('cors'); const postRouter = require('./routes/post'); const userRouter = require('./routes/user'); const db = require('./models'); const passport = require('./passport'); const dotenv = require('dotenv'); const passportConfig = require('./passport'); dotenv.config(); const app = express(); db.sequelize.sync() .then(() => { console.log('db 연결 성공'); }) .catch(console.error); passportConfig(); app.use(cors({ origin: '*', credentials: false, })); app.use(express.json()); app.use(express.urlencoded({extended: true})); app.use(session({ saveUninitialized: false, resave: false, secret: process.env.COOKIE_SECRET, })); app.use(cookieParser(process.env.COOKIE_SECRET)); app.use(passport.initialize()); app.use(passport.session()); app.use('/post', postRouter); app.use('/user', userRouter); app.listen(3065, () => { console.log('서버 실행 중...'); }); 5년전 누가 같은 질문을 블로그 댓글로 했었는데 수정했다고만 답변을 달아주셔서 ,, 뭐가 문젠지 잘 모르겠습니다.작성된 코드이고 아래와 같이 에러가 발생합니다. /Users/WebstormProjects/nodebird/prepare/back/app.js:36app.use(passport.initialize()); ^TypeError: passport.initialize is not a function at Object.<anonymous> (/Users/jeondaewon/WebstormProjects/nodebird/prepare/back/app.js:36:18) at Module._compile (node:internal/modules/cjs/loader:1218:14) at Module._extensions..js (node:internal/modules/cjs/loader:1272:10) at Module.load (node:internal/modules/cjs/loader:1081:32) at Module._load (node:internal/modules/cjs/loader:922:12) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:82:12) at node:internal/main/run_main_module:23:47Node.js v19.3.0[nodemon] app crashed - waiting for file changes before starting...
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
retweet 취소하기
배포단계와 보너스 강좌를 보면서 댓글 리트윗 , 좋아요 , 삭제 , 수정 및 리트윗한 게시글 다시 리트윗버튼을 클릭했을 때 해당 게시글을 지우려고 기능을 추가하려고 하고 있습니다그래서 구조를 해당 리트윗 게시글을 me.Posts 안에서 리트윗한 아이디와 해당 게시글의 post.id가 일치하는 게시글을 삭제하려고하는데 해당 구조로 짜게 되면 맨처음 페이지가 로딩되고 나서 데이터를 받아오는 Post를 인식해서 그런지 리트윗 되어있던걸 삭제하는건 가능한데 삭제 후 다시 리트윗 하고 삭제하려면 id가 그 처음 리트윗되어있던 id를 찾습니다.(기존 리트윗 되어있던 post.id) (리트윗 삭제 후 다시 리트윗 하고 나서 리트윗 버튼 클릭시 나오는 post.id) 리트윗 제거하고 다시 리트윗 하면 DB와 me.Posts 와 mainPosts 안에 데이터가 새롭게 추가되는건 확인이 되는데 왜 초기 데이터값만을 읽는건지 모르겠습니다. 항상 늦은 시간에도 답변해주셔서 감사합니다.(그리고 워낙 질문이 많아서 죄송해요)
- 해결됨[리뉴얼] 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 하면 되는 걸까요?
- 해결됨[리뉴얼] 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 사용에 관련해서 과금이 많이 나올까봐 걱정이 되는데 혹시 보안적으로 안전하게 사용하는 방법 있을까요?
- 해결됨[리뉴얼] 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. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
svg 파일 관련 질문드립니다.
svg 파일을 사용하기 위해서 @svgr/webpack 설정하고 import 해서 컴포넌트처럼 사용하고있는데요.이미지 파일을 public에 두고 사용중인데 svg 파일은 제가 찾아본바로는 이미지 파일이라기보다 html/css에 가깝고 컴포넌트처럼 import 해서 사용하면 이미지가 아니기때문에 public 폴더가 아닌 다른 폴더로 빼서 파일을 관리해야될것같은데 svg 파일은 어디에 두는게 좋은가요? public 폴더에 놔두고 사용하는게 좋은지 아니면 따로 assests 폴더등을 만들어서 따로 관리하는게 좋은지 궁금합니다. !
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
loadPosts 에러
안녕하세요 선생님.무한스크롤링 강의까지 수강 했습니다. faker로 dummydata 만들어서 무한 스크롤링 구현했는데 중간에 뭘 잘못 건드렸는지 에러가 뜨네요..제 생각에는 아래의 에러 부분 문제 인거 같아서 post saga 부분과 reducer를 오랜 시간 봤는데 어디가 잘못 된건지 모르겠습니다... react_devtools_backend.js:2655 The above error occurred in task loadPosts created by throttle(LOAD_POSTS_REQUEST, loadPosts) created by watchLoadPosts created by postSaga created by rootSagaTasks cancelled due to error:throttle(LOAD_POSTS_REQUEST, loadPosts)watchAddPostwatchRemovePostwatchAddCommentuserSaga
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
ADD_COMMENT_FAILURE 에러
error - ./sagas/post.jsAttempted import error: 'ADD_COMMENT_FAILURE' is not exported from '../reducers/post'.와 같이 오류 코드가 뜹니다. 간단한 문제인거 같은데 해결이 안되네요.아래는 두 코드입니다. ./reducer/post.jsimport shortId from 'shortid'; import faker from 'faker'; import produce from '../util/produce'; export const initialState = { mainPosts: [], imagePaths: [], hasMorePosts: true, loadPostsLoading: false, loadPostsDone: false, loadPostsError: null, addPostLoading: false, addPostDone: false, addPostError: null, removePostLoading: false, removePostDone: false, removePostError: null, addCommentLoading: false, addCommentDone: false, addCommentError: null, }; // -> index.js export const generateDummyPost = (number) => Array(number).fill().map(() => ({ id: shortId.generate(), User: { id: shortId.generate(), nickname: faker.name.findName(), }, content: faker.lorem.paragraph(), //아무런 글자 Images: [{ src: faker.image.image(), //공간만 차지할꺼면 placeholder }], Comments: [{ User: { id: shortId.generate(), nickname: faker.name.findName(), }, content: faker.lorem.sentence(), }], })); export const LOAD_POSTS_REQUEST = 'LOAD_POSTS_REQUEST'; export const LOAD_POSTS_SUCCESS = 'LOAD_POSTS_SUCCESS'; export const LOAD_POSTS_FAILURE = 'LOAD_POSTS_FAILURE'; export const ADD_POST_REQUEST = 'ADD_POST_REQUEST'; export const ADD_POST_SUCCESS = 'ADD_POST_SUCCESS'; export const ADD_POST_FAILURE = 'ADD_POST_FAILURE'; export const REMOVE_POST_REQUEST = 'REMOVE_POST_REQUEST'; export const REMOVE_POST_SUCCESS = 'REMOVE_POST_SUCCESS'; export const REMOVE_POST_FAILURE = 'REMOVE_POST_FAILURE'; export const ADD_COMMENT_REQUEST = 'ADD_COMMENT_REQUEST'; export const ADD_COMMENT_SUCCESS = 'ADD_COMMENT_SUCCESS'; export const ADD_COMMENT_FAILURE = 'ADD_COMMENT_FAILURE'; export const addPost = (data) => ({ type: ADD_POST_REQUEST, data, }); export const addComment = (data) => ({ type: ADD_COMMENT_REQUEST, data, }); const dummyPost = (data) => ({ id: data.id, content: data.content, User: { id: 1, nickname: '제로초', }, Images: [], Comments: [], }); const dummyComment = (data) => ({ id: shortId.generate(), content: data, User: { id: 1, nickname: '제로초', }, }); // 이전 상태를 액션을 통해 다음 상태로 만들어내는 함수(불변성은 지키면서) const reducer = (state = initialState, action) => produce(state, (draft) => { switch (action.type) { //state를 draft로 case LOAD_POSTS_REQUEST: draft.loadPostsLoading = true; //리퀘스트가 갔을때는 로딩 draft.loadPostsDone = false; draft.loadPostsError = null; break; case LOAD_POSTS_SUCCESS: draft.loadPostsLoading = false; draft.loadPostsDone = true; draft.mainPosts = action.data.concat(draft.mainPosts); //데이터합치기 draft.hasMorePosts = draft.mainPosts.length < 50; //50개로 제한 게시글 50개만 보겠다. break; case LOAD_POSTS_FAILURE: draft.loadPostsLoading = false; draft.loadPostsError = action.error; break; case ADD_POST_REQUEST: draft.addPostLoading = true; draft.addPostDone = false; draft.addPostError = null; break; case ADD_POST_SUCCESS: draft.addPostLoading = false; draft.addPostDone = true; draft.mainPosts.unshift(dummyPost(action.data)); break; case ADD_POST_FAILURE: draft.addPostLoading = false; draft.addPostError = action.error; break; case REMOVE_POST_REQUEST: draft.removePostLoading = true; draft.removePostDone = false; draft.removePostError = null; break; case REMOVE_POST_SUCCESS: draft.removePostLoading = false; draft.removePostDone = true; draft.mainPosts = draft.mainPosts.filter((v) => v.id !== action.data); break; case REMOVE_POST_FAILURE: draft.removePostLoading = false; draft.removePostError = action.error; break; case ADD_COMMENT_REQUEST: draft.addCommentLoading = true; draft.addCommentDone = false; draft.addCommentError = null; break; case ADD_COMMENT_SUCCESS: { const post = draft.mainPosts.find((v) => v.id === action.data.postId); post.Comments.unshift(dummyComment(action.data.content)); draft.addCommentLoading = false; draft.addCommentDone = true; break; // const postIndex = state.mainPosts.findIndex((v) => v.id === action.data.postId); // const post = { ...state.mainPosts[postIndex] }; // post.Comments = [dummyComment(action.data.content), ...post.Comments]; // const mainPosts = [...state.mainPosts]; // mainPosts[postIndex] = post; // return { // ...state, // mainPosts, // addCommentLoading: false, // addCommentDone: true, // }; } case ADD_COMMENT_FAILURE: draft.addCommentLoading = false; draft.addCommentError = action.error; break; default: break; } }); export default reducer;./sagas/post.jsimport axios from 'axios'; import shortId from 'shortid'; import { all, delay, fork, put, takeLatest, throttle } from 'redux-saga/effects'; import { ADD_COMMENT_FAILURE, ADD_COMMENT_REQUEST, ADD_COMMENT_SUCCESS, ADD_POST_FAILURE, ADD_POST_REQUEST, ADD_POST_SUCCESS, generateDummyPost, LOAD_POSTS_FAILURE, LOAD_POSTS_REQUEST, LOAD_POSTS_SUCCESS, REMOVE_POST_FAILURE, REMOVE_POST_REQUEST, REMOVE_POST_SUCCESS, } from '../reducers/post'; import { ADD_POST_TO_ME, REMOVE_POST_OF_ME } from '../reducers/user'; function loadPostsAPI(data) { return axios.get('/api/posts', data); } function* loadPosts(action) { try { // const result = yield call(loadPostsAPI, action.data); yield delay(1000); yield put({ type: LOAD_POSTS_SUCCESS, data: generateDummyPost(10), }); } catch (err) { console.error(err); yield put({ type: LOAD_POSTS_FAILURE, data: err.response.data, }); } } function addPostAPI(data) { return axios.post('/api/post', data); } function* addPost(action) { try { // const result = yield call(addPostAPI, action.data); yield delay(1000); //서버를 구현하기 전까지 딜레이로 구현하는 효과 const id = shortId.generate(); yield put({ type: ADD_POST_SUCCESS, data: { id, content: action.data, }, }); yield put({ type: ADD_POST_TO_ME, data: id, }); } catch (err) { console.error(err); yield put({ type: ADD_POST_FAILURE, data: err.response.data, }); } } function removePostAPI(data) { return axios.delete('/api/post', data); } function* removePost(action) { try { // const result = yield call(removePostAPI, action.data); yield delay(1000); yield put({ type: REMOVE_POST_SUCCESS, data: action.data, }); yield put({ type: REMOVE_POST_OF_ME, data: action.data, }); } catch (err) { console.error(err); yield put({ type: REMOVE_POST_FAILURE, data: err.response.data, }); } } function addCommentAPI(data) { return axios.post(`/api/post/${data.postId}/comment`, data); } function* addComment(action) { try { // const result = yield call(addCommentAPI, action.data); yield delay(1000); yield put({ type: ADD_COMMENT_SUCCESS, data: action.data, }); } catch (err) { yield put({ type: ADD_COMMENT_FAILURE, data: err.response.data, }); } } //takeevery function* watchLoadPosts() { yield throttle(5000, LOAD_POSTS_REQUEST, loadPosts); //5초동안은 post request 한 번만 실행 } function* watchAddPost() { //클릭 실수 2번했을때(동시에 로딩 중일때) 마지막 클릭만 실행되게 every는 두 번 다 실행 yield takeLatest(ADD_POST_REQUEST, addPost); } function* watchRemovePost() { yield takeLatest(REMOVE_POST_REQUEST, removePost); } function* watchAddComment() { yield takeLatest(ADD_COMMENT_REQUEST, addComment); } export default function* postSaga() { yield all([ fork(watchAddPost), fork(watchLoadPosts), fork(watchRemovePost), fork(watchAddComment), ]); }제로초님 강의와 깃허브 보면서 제 코드에 문제가 있는지 찾아보고 수정도 해봤습니다.import export둘다 잘 들어 갔는데 다른 문제 일까요? 아니면 install이 안된게 있는 걸까요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
중복된 닉네임
중복된 닉네임할때 const exUser = await User.findOne({ where: { email: req.body.email, nickname: req.body.nickname, }, });이렇게 추가 해주면 되나요? 아니면 따로 만들어줘야하나요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
프론트쪽에서 env 나누나요?
현재 강의 front쪽에서 env 로컬 배포 일떄도 나누나요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
함께 아는 친구 기능 구현
다른 유저와 공통적으로 팔로잉을 하고 있는 유저 숫자를 구하고 싶은데 혹시 api를 어떤 방식으로 코딩하면 될까요? 항상 좋은강의 감사합니다