무료
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
Postman Error: read ECONNRESET
이렇게 나옵니다ㅜㅜ 왜 연결이 안되는 걸까요 런스타트는 잘 됩니다. ㅜㅜ
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
Vscode 자동완성
버전이 차이로 인해 에러나는 부분들은찾아가며 잘 보고있습니다 그런데 똑같이 따라하는데 자동완성이 되는게 있고 안되는게 있더라구요그차이가 vecode버전차이일까요? process.env.NODE_ENV예를들어 NODE_ENV 를 자동완성이 되시던데 저같은경우는 안되네요
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
Please use the 'setupMiddlewares' option. 경고
Concurrently 적용 후 npm run dev를 실행하면[1] (node:6792) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.[1] (Use node --trace-deprecation ... to show where the warning was created)[1] (node:6792) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.경고가 발생했습니다.서버는 작동되지만 경고가 거슬려서 찾아보고 방법 공유드립니다.클라이언트 node_modules/react-scripts/webpackDevServer.config.js 에서 수정해주시면 됩니다. 수정 전 onBeforeSetupMiddleware(devServer) { // Keep evalSourceMapMiddleware // middlewares before redirectServedPath otherwise will not have any effect // This lets us fetch source contents from webpack for the error overlay devServer.app.use(evalSourceMapMiddleware(devServer)); if (fs.existsSync(paths.proxySetup)) { // This registers user provided middleware for proxy reasons require(paths.proxySetup)(devServer.app); } }, onAfterSetupMiddleware(devServer) { // Redirect to PUBLIC_URL or homepage from package.json if url not match devServer.app.use(redirectServedPath(paths.publicUrlOrPath)); // This service worker file is effectively a 'no-op' that will reset any // previous service worker registered for the same host:port combination. // We do this in development to avoid hitting the production cache if // it used the same host and port. // https://github.com/facebook/create-react-app/issues/2272#issuecomment-302832432 devServer.app.use(noopServiceWorkerMiddleware(paths.publicUrlOrPath)); },수정 후 setupMiddlewares: (middlewares, devServer) => { if (!devServer) { throw new Error('webpack-dev-server is not defined') } if(fs.existsSync(paths.proxySetup)) { require(paths.proxySetup)(devServer.app) } middlewares.push( evalSourceMapMiddleware(devServer), redirectServedPath(paths.publicUrlOrPath), noopServiceWorkerMiddleware(paths.publicUrlOrPath) ) return middlewares; },
- 해결됨따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
npm run dev 실행 시 오류
PS C:\boiler-plate> npm run dev> boiler-plate@1.0.0 dev> concurrently "npm run backend" "npm run start --prefix client"[0] [0] > boiler-plate@1.0.0 backend[0] > nodemon server/index.js[0] [1] [1] > client@0.1.0 start[1] > node server/index.js[1] [1] node:internal/modules/cjs/loader:1042[1] throw err;[1] ^[1] [1] Error: Cannot find module 'C:\boiler-plate\client\server\index.js'[1] at Module._resolveFilename (node:internal/modules/cjs/loader:1039:15)[1] at Module._load (node:internal/modules/cjs/loader:885:27)[1] at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)[1] at node:internal/main/run_main_module:23:47 {[1] code: 'MODULE_NOT_FOUND',[1] requireStack: [][1] }[1][1] Node.js v18.13.0[1] npm run start --prefix client exited with code 1[0] [nodemon] 3.0.1[0] [nodemon] to restart at any time, enter rs[0] [nodemon] watching path(s): .[0] [nodemon] watching extensions: js,mjs,cjs,json[0] [nodemon] starting node server/index.js[0] node:internal/modules/cjs/loader:1042[0] throw err;[0] ^[0][0] Error: Cannot find module '../models/User'[0] Require stack:[0] - C:\boiler-plate\auth.js[0] - C:\boiler-plate\server\index.js[0] at Module._resolveFilename (node:internal/modules/cjs/loader:1039:15)[0] at Module._load (node:internal/modules/cjs/loader:885:27)[0] at Module.require (node:internal/modules/cjs/loader:1105:19)[0] at require (node:internal/modules/cjs/helpers:103:18)[0] at Object.<anonymous> (C:\boiler-plate\auth.js:1:16)[0] at Module._compile (node:internal/modules/cjs/loader:1218:14)[0] at Module._extensions..js (node:internal/modules/cjs/loader:1272:10)[0] at Module.load (node:internal/modules/cjs/loader:1081:32)[0] at Module._load (node:internal/modules/cjs/loader:922:12)[0] at Module.require (node:internal/modules/cjs/loader:1105:19) {[0] code: 'MODULE_NOT_FOUND',[0] requireStack: [ 'C:\\boiler-plate\\auth.js', 'C:\\boiler-plate\\server\\index.js' ][0] }[0][0] Node.js v18.13.0[0] [nodemon] app crashed - waiting for file changes before starting... 다 찾아보고 적용하는데 해결이 안되고 있습니다.
- 해결됨따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
missing script: "backend"
{ "name": "client", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", "add": "^2.0.6", "axios": "^1.5.0", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.16.0", "react-scripts": "5.0.1", "web-vitals": "^2.1.4" }, "scripts": { "start": "node server/index.js", "backend": "nodemon server/index.js", "test": "react-scripts test", "dev": "concurrently \"npm run backend\" \"npm run start --prefix client" }, "eslintConfig": { "extends": [ "react-app", "react-app/jest" ] }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] } } 이게 클라이언트쪽입니다
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
logout시 token이 삭제되지 않습니다.
postman에서 logout을 시도해도 mongoDB에서는 token이 삭제가 되지 않아 콘솔로 req.user._id를 찍어보니 undefined가 나와auth를 확인해보니 req.user 값이 제대로 들어가질 않는 거 같습니다. 혹시 어느 부분을 바꿔야 req.user에서 제대로 값이 출력되고 logout시 token도 삭제 될까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
git ssh 연동해서 remote add origin 정상적으로 됬는데
왜 깃 웹 페이지에서는 자꾸 아무것도 안뜰까요 ?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
몽고db 연결이 안됩니다..
이런 에러 뜨는데 왜 그럴까요..몽고db 연결안하면 수업에 지장이 있을까요? 수업이랑 실제 몽고db 사이트랑 달라서 많이 어렵네요
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
ssh agent 오류
git agent 설치 확인을 위해 다음과 같이 명령어를 터미널에서 입력했는데, 오류가 뜨네요.. 어떻게 해결할 수 있을까요..
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
ERROR Invalid hook call. Hooks can only be called inside of the body of a function component.
안녕하세요, react 5 -> 6으로 바껴서 navigate 등 문법을 바 꾸고 디비에 저장된 아이디와 패스워드로 로그인 하려하는데 계쏙 아래와 같은 에러가 발생합니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
index.js 랜딩페이지로 가지 않음
index.js에서import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot(document.getElementById('root')); root.render( <React.StrictMode> <App /> </React.StrictMode> ); // If you want to start measuring performance in your app, pass a function // to log results (for example: reportWebVitals(console.log)) // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals reportWebVitals();이렇게 랜딩 페이지로 잘 가는데,import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; import { Provider } from 'react-redux'; import 'antd/dist/reset.css'; import { legacy_createStore as createStore, applyMiddleware } from 'redux'; import promiseMiddleware from 'redux-promise'; import ReduxThunk from 'redux-thunk'; import rootReducer from './_reducers'; //'./_reducers/index.js'라고 안 해도 알아서 index.js인 줄 알고 해 줌. const createStoreWithMiddleware = applyMiddleware(promiseMiddleware, ReduxThunk)(createStore); //원래는 createStore만 해서 store를 redux에서 생성하는건데, 그냥 store는 객체밖에 못 받기 때문에 //promise와 function도 받게 해주기 위해 이 middleware와 함께 이렇게 만들어 주는 것. //그래서 store 만든 것을 이렇게 store에다가 넣어주는 것. //이렇게까지 하면 우리 application에 redux를 연결 시킨 것. ReactDOM.render( <Provider store={createStoreWithMiddleware(rootReducer , window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() )} > <App /> </Provider> , document.getElementById('root') ); // If you want to start measuring performance in your app, pass a function // to log results (for example: reportWebVitals(console.log)) // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals reportWebVitals(); 이렇게 redux 부분을 추가한 코드로 하면 랜딩페이지로 가지 않고 컴파일은 되나 localhosst:3000도, localhosst:3000/login도, localhosst:3000/register도 다 이렇게 흰 화면만 뜨고 해당 페이지로 가지 않습니다.. 해결 방법 아시는 분 알려주시면 감사하겠습니다😭
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
Mongo DB 연결 오류
다음과 같은 에러가 뜨는데 어떻게 해결할 수 있을까요..??
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
깃허브
PS C:\Users\user\Documents\boiler-plate> git push -u origin mainfatal: failed to load library 'libcurl-4.dll'이럴 경우엔 어떻게 깃허브 연결 할 수 있을까요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
async/await 적용 성공 ㅎㅎ
async/await 적용한다고 저를 위해 AI들이 욕봤네요 ㅎㅎㅎ 성공~
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
postman에 /login으로 send 시 무한 로딩 에러
postman에서는 이런 오류가 뜨구요..위에는 index.js 파일이고User.js 파일입니다!몇일을 열심히 구글링해봐도 답을 찾을 수가 없네요,, register은 잘 작동합니다. 어떤 문제가 있는지 부탁드려요,,,
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
우와 12강 완료 했어요~~ ㅎㅎㅎ
우와 우와
- 해결됨따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
false 나오시는분 이렇게 해보세요.
user.save((err, userInfo) => { if (err) return res.json({ success: false, err }) return res.status(200).json({ success: true }) }) 위 코드를 아래와 같이 바꾸니 잘되네요~ user.save() .then((userInfo) => res.status(200).json({ success: true })) .catch((err) => res.json({ success: false, err }));
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
뭘해도 에러날때 Uncaught Error: useNavigate() may be used only in the context of a <Router> component.
App.js에 있는 <BrowserRouter>태그를 Index.js의 Provider위로 감싸주세요 그러니 Loginpage.js등에서 navigate가 정상작동하네요참고하세요.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
로그인시 /api/users/login,~~/login 404에러 뜨시는분들
/client/src/user_action.js에 const request = axios.post('/api/users/login', dataToSubmit) // DB (server/index.js)주소와 /sever/index.js에 app.post('/api/users/login',(req, res) =>{주소를 같게 맞춰 주시면 될듯합니다. 참고해주세요.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
provider에서 에러가 납니다.
import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; import 'antd/dist/antd.min.css' import { Provider } from 'react-redux'; import {applyMiddleware, createStore} from 'redux'; import PromiseMiddleware from 'redux-promise'; import reduxThunk from 'redux-thunk'; //import Reducer from './_reducers'; const createStoreWidthMiddleware=applyMiddleware(); const root = ReactDOM.createRoot(document.getElementById('root')); root.render( <React.StrictMode> <Provider> <App /> </Provider> </React.StrictMode> ); reportWebVitals();Provider를 제거하면 에러가 나지 않고 넣으면 위와같이 에러가납니다 혹시 아시는분 계실까요? 상위버젼에서 Provider 태그가 필요 없다고 하시는데 그럼 store는 어찌쓰는지요?