[Inflearn][JohnAhn] 노드 리액트 기초

맥의 터미널 -> 윈도우 power shell 사용. 또는 git bash를 설치하면 편함 #2 원하는 디렉터리에서 npm init으로 파일 생성 원하는 텍스트 편집기에서 해당 디렉터리 오픈 후 터미널 루트 디렉터리에서 npm install express --save로 express 라이브러리 다운 #3 mongodb atlas에서 new project...

body parser dependency 설치 npm install body-parser --save 코드 오류 를 다음으로 바꿈

nodemon 설치 설치 이유 : 서버를 다운시켰다 다시 올리는 것을 반복하지 않기 위해서 npm install nodemon --save-dev -dev를 붙인 이유는, 개발 모드와 배포 모드가 있는데 개발 모드에서만 사용하겠다는 의미 루트디렉터리의 package.json의 일부가 이렇게 됨 따라서 서버를 실행시킬 때 터미널에 npm r...

github에 커밋할 때 내 mongodb 주소 안보이게 하기 process.env.NODE_ENV가 local인 development일 때와 deploy(배포)한 후의 production일 때로 나눠야함 local일 때는 직접 mongoUrl에 접속 가능하지만 배포한 버전으로는 heroku 서비스를 통해서 접속이 가능하게 됨 config 폴더에...

schema로 mongodb에 받은 password 암호화 하기 npm install bcrypt --save 설치 (bcrypt 공식문서 링크텍스트) 이때 models/User.js의 userSchema.pre 안의 bcrypt는 const bcrypt = require('bcrypt')로 불러와야 하고, bcrypt는 특정 길이의 salt를...

npm install jsonwebtoken --save 설치 npm install cookie-parser --save 설치 modles/User.js에서 userSchema.methods.generateToken 중에 user.id.toHexString()를 그냥 user.id()로 쓰게 되면 Error: Expected "payload" to be ...

callback함수 없이 then과 catch를 사용

#15 React JS는 프레임워크가 아니라 library이다. Components로 이루어져서 module과 비슷하고 재사용성이 뛰어나다. Virtual DOM 형식이다. Real DOM은 매번 전부 reload를 하는 반면, Virtual DOM은 바뀐 부분만 Real DOM에서 reload를 한다. #16 Babel은 최신 javascript가 ...

#19 폴더 정리 Redux를 위한 폴더 _actions _reducer Page들을 넣는 폴더 components/views 해당 페이지에 관련된 css파일이나, components들을 넣는 폴더 components/views/Sections Routing 관련 일을 처리 App.js 환경 변...

#20 cd client에서 npm install react-router-dom --save 설치 npm list로 react-router-dom 버전 확인 후 (나의 경우에는 v6이지만 강의가 v5를 사용하기 때문에) 링크로 들어가서 v5의 Relative Routes and Links의 v6를 참고하였다. import로 사용할 페이지 불러와주고 App ...

#21 지금까지는 request를 할 때 client 부분이 없었기 때문에 POSTMAN을 이용했다. 하지만 이제는 client가 있으니 React JS 부분에서 request를 보내면 된다. 그때 사용할 것은 AXIOS인데, jQuery를 사용할 때의 AJAX라고 보면 된다. client 디레터리로 이동해서 npm install axios --save ...

#24 루트 디렉터리에서 npm install concurrently --save 설치 루트 디렉터리의 package.json의 scripts에 다음을 작성 "dev": "concurrently \"npm run backend\" \"npm run start --prefix client\"" #25 ant design을 이용할 것이다. client 폴...