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.14 Layouts with Pug Pug를 사용하는 이유 html과 css만으로 작업을 할 때에는 똑같은 것들을 반복하는 경우가 많기 때문에 별로 좋지 않다. html과 css는 프로그래밍 언어가 아니고, 논리적인 작업들을 할 수 없다. 계속 복사-붙여넣기 하는 건 고통스럽다. pug와 같은 것들로 작업을 하면, html을 생성하기 하는 javascript의 위력을 사용할 수 있다. views 폴더 아래에 layouts 라는 이름으로 새 폴더를 만들기 이 폴더 안에 layout 파일들을 만들 것이다. main 레이아웃 먼저 main.pug로 만든다. 이제 여기에 HTML 작성을 시작할 것이다. 이 파일은 모든 페이지들의 토대가 되는 파일이 될 것이다. 예를 들어, 모든 페이지는 header와 foo..

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.12 Recap(복습,중간점검) userRouter와 videoRouter도 완성하기 일단, 지난 시간에 globalRouter를 완성한 것 처럼, userRouter와 videoRouter도 완성한다. userController와 videoController에서 각각 필요한 함수를 작성하고 export해서 userRouter와 videoRouter에서 import하여 사용한다. ↑app.js ↑ userRouter.js 이 때 npm start를 해보면, localhost:4000/users가 아니라 localhost:4000/users/users 해야 접속이 되는 것을 볼 수가 있는데, 이는 app.js에서 routes.users라고 되어 있기 때문이다. 즉, app.js에서 app.use("/u..

2-2 [구현 - 시뮬레이션과 완전 탐색] 문제 풀이 시각 문제 설명 정수 N이 입력되면 00시 00분 00초부터 N시 59분 59초까지의 모든 시간중에서 3이 하나라도 포함되는 모든 경우의 수를 구하는 프로그램을 작성하시오. 예를 들어 1을 입력했을 때 다음은 3이 하나라도 포함되어 있으므로 세어야 하는 시각임. 00시 00분 03초 00시 13분 30초 반면에 다음은 3이 하나도 포함되어 있지 않으므로 세면 안 되는 시각임 00시 02분 55초 01시 27분 45초 문제 조건 문제 해결 아이디어 이 문제는 가능한 모든 시각의 경우를 하나씩 모두 세서 풀 수 있는 문제임 하루는 86,400초이므로, 00시00분00초부터 23시 59분 59초까지의 모든 경우는 86,400가지임. 따라서 단순히 시각을 1..

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