front-end : HTML5, CSS3, Pug back-end : NodeJS, MongoDB, Express #6 MONGODB AND MONGOOSE 6.0 Array Database part One mixin video(video) div a(href="/videos/" + video.id)=video.title pug는 href, class, id 같은 attribute에는 #{}로 변수를 표시할 수 없다. 더하기 방식이나 백틱을 사용해서 표시해야한다. export const watch = (req, res) => { const { id } = req.params; const video = videos[id - 1]; res.render("watch", { pageTitle: `Watchin..
강의기록
front-end : HTML5, CSS3, Pug back-end : NodeJS, MongoDB, Express #5 TEMPLATES 5.0 Returning HTML HTML을 직접 텍스트로 적어서 리턴할 수 있으나 반복되는 부분을 매번 복붙하는 것은 비효율적이기 때문에 좀 더 편리하게 리턴하기 위해서 PUG 사용 5.1 Configuring Pug Pug = 템플릿을 이용해 뷰를 만드는 걸 도와주는 템플릿 엔진 app.set("view engine", "pug"); pug를 설치한 후 express가 view engine으로 pug를 사용할 수 있게 설정해주어야 한다. express는 views라는 디렉토리에 있는 view를 알아서 보기 때문에 따로 import 해줄 필요는 없다. 디렉토리 안의..
front-end : HTML5, CSS3, Pug back-end : NodeJS, MongoDB, Express #4 ROUTERS 4.0 What are Routers router = url을 좀 더 관리하게 쉽게 해줌 작업 중인 주체를 기반으로 url을 그룹화 해줌 4.1 Making Our Routers 4.2 Cleaning the Code 폴더 안에 router와 controller를 따로 정리하게 관리하는 것이 좋음 router를 끌고 올 때는 반드시 export를 해주고 import해서 사용해야 함 4.3 Exports global router는 url을 깔끔하게 하기 위해 쓸 뿐 별도의 controller는 필요없음 controller를 만들고 router에서 사용하기 위해서 expor..
front-end : HTML5, CSS3, Pug back-end : NodeJS, MongoDB, Express #3 Introduction To EXPRESS 3.0 Your First Server //server.js import express from "express"; const app = express(); => application(server)를 생성한다. 서버는 항상 켜져있고 인터넷에 연결되어있는 컴퓨터라고 볼 수 있다. 서버는 외부 접속인 request를 항상 listening 한다. app.listen(4000, handleListening); => 서버가 포트4000을 listening하고 있다. 3.1 GET Requests 브라우저는 서버에 웹사이트를 request하고 페이지를..
front-end : HTML5, CSS3, Pug back-end : NodeJS, MongoDB, Express #1 Introduction 1.3 What is Node JS Nodejs = 브라우저 밖에서 쓸 수 있는 JS이다. = 확장성이 있는 네트워크 어플리케이션 개발에 사용되는 소프트웨어 플랫폼으로 특히 서버사이트에서 많이 사용한다. Electron = 데스크탑 앱을 만들 수 있다. chromnium과 nodejs을 사용하고 js, html, css를 이용한다. React Native = 안드로이드, ios앱을 만들 수 있다. js와 reactjs를 사용한다. 1.4 What is NPM npm = js를 위한 패키지 매니저이다. = node.js에서 사용하는 모듈들을 패키지로 만들어 npm..
