socialLogin.pug

Project using node.js/Cloning Youtube 2020. 8. 24. 09:11

이제 기능별로 하나씩 html(form 형식)을 짜고 Controller 부분을 완성할 것이다. Back-end의 모든 기능을 마친 후에 CSS로 꾸미고 Front-end JS로 기능을 구현할 것이다.

partials/socialLogin.pug

.social-login
  button.social-login--github
    a(href=routes.github)
      span.social-login__icon
        i.fab.fa-github
      span.social-login__title Continue with Github
  button.social-login--kakao
    a(href=routes.kakao)
      span.social-login__icon
        i.fas.fa-comment
      span.social-login__title Continue with Kakao

회원가입을할 때 웹 페이지 자체에서 하는 방법도 있지만 구글, 페이스북, Github 혹은 카카오톡으로도 로그인하는 경우를 많이 봤을 것이다. 이 부분은 passportjs로 구현할 수 있다. join.pug에 만들지않고 따로 만든 이유는 login.pug에서도 사용할 것이기 때문이다.