node.js react 기초 <유튜버 John Ahn님의 강의를 기반으로 작성>

package.json안에 "scripts"에 start : node앱을 실행시키고, entry point가 index.js가 된다. 그리고 run npm start를 실행하면listen은 지정된 호스트 및 포트에서 연결을 바인딩하고 수신 대기한다.app.listen

이번 강의에서는 MongoDB연결을 위한 MongoDB 회원가입 및 Cluster 생성 mongoose 라이브러리 사용몽고DB는 예전에 회원가입 및 Cluster를 사용해서 pass아 무료 Cluster는 계정 당 1개만 생성이 가능한 것 같다.mongoose???내가

mongoose의 Model과 Schema가 무엇인지 알아보자.Model : Schema를 감싸주는 역할constructors compiled from SchemaSchema : Everything in Mongoose starts with a Schema. Each

Git을 사용하여 내 프로젝트를 올려보자~git --version을 console창에 입력 하면 내가 다운받은 git version이 출력된다.다운이 완료되면 저장소을 만들어야 한다.git init을 내가 만들고 있는 해당 프로젝트 폴더경로에서 입력을 해야한다.지금 g

local repository에 있는 파일들을 remote 해보자~github에서 새로운 repository를 생성 한다.윈도우 기준 git bash를 실행시켜 ls -a ~/.ssh or ls -al ~/.ssh를 입력하면 ssh가 있다면 아래처럼 나올 것이다.없

BodyParser & postman을 이용해보자~Body-parser Dependency를 다운 받는다npm install body-parser --save을 콘솔창에 입력하면 다운로드가 진행된다.body-parser가 뭔지 잘 모르기 때문에 구글링한 결과expres

NodeMon 실시간으로 변경사항을 보여준다. 따로 서버를 내리고 재가동 할 필요가 없음.NodeMon 설치 코드 : npm install nodemon --save-devdev : devlopment용backend : nodemon index.js 추가의 의미는nod

비밀 설정 정보 관리를 해보자~위의 사진처럼 config 폴더를 만들고 하위에 dev.js파일을 생성한다. dev.js에 modeule.exports = { mongoURI :'몽고db 연결을 위한 아이디 및 패스워드를 넣어준다.'}환경 변수 process.env.NO

Bcrypt로 비밀번호 암호화 하기mongoDB에 그냥 데이터를 보내면 패스워드가 그대로 출력된다. 그리고 대한민국 개인정보보호법상 패스워드는 단방향 암호화를 하라고 명시되어 있기에 반드시 암호화!!Bcrypt를 이용하여 비밀번호를 암호화 하는 강의인것이다.vsCode

로그인 기능 with Bcrypt을 알아보자~전 시간에 빠진 코드가 있다라고 한다.그것은 if(user.Modified('password'){}else{ next(); //수정이 안됐더라면, next()를 사용하여 if문을 빠져나가고 user.save()로 이동할 수

전 시간에 이어서 시작!!토큰 생성을 해보자 jsonwebtoken을 활용해서!!콘솔창에 npm install jsonwebtoken --save을 입력하여 다운로드 사용법은 아래 주소 참고https&#x3A;//www.npmjs.com/package/jsonwebto

페이지 이동 때마다 로그인이 되었는지 확인 글을 쓸때나 지울때 권한이 있는지 확인 Token을 만든 뒤 유저정보에 넣어 둔 뒤(쿠키) 서버에서는 유저 Database에다가 넣어준다. middleware라는 폴더를 생성 후 안에 auth.js를 생성한다. 미들웨어란?

로그아웃기능을 만들어보자1.로그아웃 하려는 유저를 DB에서 찾고2.그 유저의 토큰을 지워 준다.아주 간단하다 logout 함수를 만들어준다.findeOneAndUpdate() 함수를 이용해서 해당하는 아이디의 토큰을 초기화 시켜준다. 나는 secreToken이 서로 상

Real DOM1.만약 10개의 리스트가 있다.2.그 중에 한 가지의 리스트만 Update 됨3.전체 리스트를 다시 Reload 해야됨!4.Super Expensive한 작업Virtual DOM1.만약 10개의 리스트가 있다.2.그 중에 한 가지의 리스트만 Update

Babel,Webpack 설정하기create -react - app으로 설정 쌉가능일단 이 두개의 정의를 알아보자~Babel : 최신 자바스크립트 문법을 지원하지 않는 브라우저들을 위해서 최신 자바스크립트 문법을 구형 브라우저에서도 돌 수 있게 변환(es5) 시켜줌.W

프론트, 백 서버를 한꺼번에 실행시켜 어플리케이션을 실행시켜보자.npm(https&#x3A;//www.npmjs.com/package/concurrently\`\`\`"start": "concurrently \\"command1 arg\\" \\"command2 arg

아래와 같이 props.history.push을 사용하여 login페이지로 전환 시켰는데 에러가 발생했다. 내가 해결한 방법은 useNavigate()로 navigate를 만들고 파라미터 값으로 path를 넣어주었다.react-router-dom과 useNavigate

HOC(HigherOrderComponent) : component를 인자를 받아서 new component를 return하는 함수이다.Auth(HOC) Component에 다른 component를 넣어 줄 수 있다.아래와 같은 흐름으로 사용자의 권한을 가져와서 사이트