Passport 세션을 내부적으로 처리하여 로그인 기능을 대신 해줍니다. 그냥 로그인도 가능하지만, 카카오·구글·페이스북·애플 등 SNS 계정을 통해 로그인 하고자 할 때, 유용하게 사용할 수 있습니다. 먼저 passport 모듈과 서버 자체적으로 로그인할 때 사용하기 위해 로컬 전략을 사용해야 하므로 passport-local 을 설치해줍니다. npm i passport passport-local 이제 passport를 사용하기 위해 루트 디렉터리에서 passport 폴더를 생성합니다. 그리고 메인 파일인 index.js 파일과 로컬 전략을 작성하기 위해 localStrategy.js 를 생성합니다. 먼저 로컬 전략을 세우기 위해 localStrategy.js 파일에 내용을 작성하겠습니다. 이때의 전략..
익스프레스
컨트롤러 각 라우트의 경로와 메서드에 따라서 서버가 실행할 서비스가 다릅니다. 그래서 라우트에 따라서 분류해준 후에 다시 그 라우트에서 사용할 함수들을 정리해줍니다. 이때, 지정된 메서드와 경로에서 실행되는 역할을 해주는 것이 컨트롤러입니다. 유저 인증 라우터에서 컨트롤러 파일을 별로도 두어 연결해보겠습니다. 기존에는 각 메서드와 경로에 따라서 매번 함수를 적어주면서 코드의 가독성이 조금 떨어지는 문제가 있었습니다. 이때 콜백 함수를 따로 저장하기 위해서 루트 디렉터리 하위에 controllers 폴더를 생성하고 user.controller.js 파일을 만들어줍니다. 그 이후, 각 콜백함수를 컨트롤러 파일로 잘라내기 합니다. 잘라낸 후에 기존의 문제점을 보완하면서 함수를 정리했습니다. import Use..
연결 수정 각 path마다 다른 모델의 쿼리를 실행하고자 모델을 새롭게 정의하겠습니다. 그렇기 때문에 기존 pool 말고 모델 생성하는 것을 목표로 코드를 수정했습니다. Sequelize config.json 파일을 작성하여 설정할 것을 저장해주었습니다. 위치는 루트 디렉터리 하위에 config 폴더를 만들어 저장했습니다. . │📄 기타 환경 파일들 ├── .env ├── package.json ├── package-lock.json ├── node_modules │ │💻메인 파일들 ├── app.js ├── config │ └── config.json ├── lib │ └── handler.js ├── models │ └── index.js ├── public │ ├── images │ │└── log..
레이아웃 HTML 구조 작성 레이아웃을 조금 더 확실하게 작성하고자 HTML을 수정하겠습니다. 검색 로그인/회원가입 {{{body}}} CSS 작성 css 를 작성하겠습니다. css 작성이 제일 싫어요... @font-face { font-family: "Pretendard-Regular"; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff") format("woff"); font-weight: 400; font-style: normal; } *, :after, :before { padding: 0; margin: 0; box-sizing: border-box; } header, ma..
