Show sign up and login pages

Router 관리

routes.js

routes.js라는 파일을 작성해서 모든 URL을 관리한다.

middlewares.js

middlewares.js 파일에서 localMiddleware() 라는 함수를 작성하였다. res.locals를 이용해서 .pug 파일에 변수를 전달할 수 있다. 이 함수는 server.js에서 middleware로 사용했다.

globalRouter.js

globalRouter.js에 sign-up과 관련된 Router를 추가했다.

globalController.js

  get방식이나 post 방식이 왔을 때 getSignUp이나 postSignUp 함수를 실행한다. postSignUp은 회원 가입을 시도했을 때 작동되는 함수이지만, 아직 제대로 구현을 하지 않아서 res.render()를 사용했다.

getSignUp 함수는 사용자가 회원가입 URL로 들어왔을 때 signUp.pug 파일을 랜더링 한다.

view

home.pug

localhost:4000

  loggedUser를 통해서 유저가 로그인을 하지 않았을 경우 .loginBox를 생성한다. loggedUser는 나중에 passport를 이용해서 middlewares.js에서 생성할 것이다. 아직은 생성되지 않았으므로 loggedUSer는 null 값이다. 그러므로 웹 페이지에 .loginBox가 생성될 것이다.

signUp.pug

localhost:4000/sign-up

회원 가입 페이지에 가게 되면 랜더링될 pug 파일이다. 회원가입을 하는데 필요한 form 양식이다.

소스 코드

github.com/zpskek/guessMind-v3/commit/3847bf7878e5728d2f85dcbd66151a0f482d9ea2