2.16 Local Variables in Pug 미들웨어는 레이어 같은 구조 템플릿에 정보를 추가할 시간이다. 컨트롤러에 있는 정보를 템플릿에 추가하는 법에 대한 것이다. 한 템플릿에만 추가하거나 전체 템플릿에 추가할 수 있다. 템플릿 전체에 추가하는 방법부터 설명하겠다. 헤더가 라우트 객체에 접근하도록 하고 싶다. 미들웨어를 사용해야 한다. 알겠지만, 미들웨어는 레이어 같은 것이다. 위에서 밑으로 한단계씩 내려간다. (top-bottom 구조) 처음에 view engine을 pug로 설정했다. cookie를 파싱하고, body에 담긴 정보를 파싱한다. 그리고 helmet, morgan이 있다. 그 후에 컨트롤러, 라우트들이 있다. helmet을 가장 위에 두도록 하자. localsMiddleware ..

2.15 Partials with Pug views폴더> partials폴더> header.pug, footer.pug 파일 만들기 partials는 페이지의 일부분이다. 조직적인 목적으로만 만들어진다. views 폴더 아래에 partials 폴더를 만들고 header.pug , footer.pug라는 파일을 만든다. footer.pug 만들기 footer 파일에는 footer 태그를 추가하자. 이 안에는 유튜브 아이콘이 들어갈 것이다. fontawesome에서 아이콘을 추가한다. footer 태그에 footer라는 클래스를 추가하고, div에는 footer_icon이라는 클래스를 추가한다. (div는 div라고 안적어주고 클래스이름만 적어줘도 된다) icon 다음에는 footer__text가 클래스명인..

2.13 Installing Pug(퍼그 설치) Pug란? Pug는 view 엔진을 말함 pug 설치하기 콘솔에 npm install pug 로 설치한다. set함수로 application 설정하기 - app.set("view engine", "pug"); https://expressjs.com/ko/4x/api.html#app.set expressjs 공식 홈페이지> API 참조 > application> app.set() set 함수: application의 설정을 하는 함수 name과 value가 필요하다. 우리는 view engine 설정을 바꿀것이다. view engine 설정의 기본 값은 undefined인데 이것을 pug로 바꿀것이다. app.js에 다음과 같은 코드를 추가한다. app.se..

2.11 MVC Pattern - Part. 3 컨트롤러 만들기(Controller) 이제 여기 이 구조에서 자유로워지기 위해 controller를 사용할 차례이다. 컨트롤러는 어떤 일이 어떻게 발생하는지에 관한 로직이다. 여기에 있는 모든 함수들을 말하는 것이다. 여기 이 함수들을 모두 컨트롤러에 담을 것이다. 1) controllers 폴더를 만든다. 그리고 그 안에는 비디오 컨트롤러(videoController.js)와 유저 컨트롤러(userController.js) 이렇게 두 개의 컨트롤러를 만들 것이다. 대게 프로젝트에 있는 각 모델마다 컨트롤러를 만들게 된다. route에는 global , users, videos가 있고 global 안에는 home, join, login,logout, sea..

2.10 MVC Pattern - Part. 2 그냥 별거아닌데 app.js에서 경로만 /users, /videos로 바꾸고 시작! URL 만들기(routes.js) routes.js 파일을 만든다. → 쪼개서 처리하는 것이 좋기 때문, 나중에 다른 곳에서 같은 URL을 사용해야할 수도 있다. 어딘가 다른데서 사용하려면 이 구조를 내가 외워야 한다는 것이다. 좀 더 편하기 위해 URL을 변수로 선언해서 모아놓은 routes.js 파일을 작성한다. routes.js파일을 만들어서, 어디에서든 이 URL을 불러다 쓸것이다. (왜 그런지는 나중에 보게 될 것이다.) // GLobal(전역적인 것들) const HOME = "/"; const JOIN = "/join"; const LOGIN = "/login"..

2.9 MVC Pattern - Part. 1 MVC 패턴 지금까지 미들웨어,라우팅에 대해서 알아봤고 이제 MVC를 알아볼 것이다. - MVC: Model, View, Control을 의미한다. Model: 데이터 View: 데이터가 어떻게 생겼는지 Controller: 데이터를 보여주는 함수(데이터를 찾는 함수) MVC는 패턴이다. 패턴은 일종의 끝내주는 구조 같은 것 userRouter.js , videoRouter.js 만들기(URL과 함수를 분리하기 위해) 1. app.js에서 이 주석 처리한 부분들을 삭제한다.↑(왜냐하면 라우터로 만들어줄 거기 때문에) 2. router.js -> userRouter.js로 이름을 변경하고(뭐 무슨 import창뜨는데 ok함) 3. videoRouter.js도 ..