일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- react
- 보조저장장치
- 후위표기법변환
- 유튜브클론코딩
- 유튜브 클론코딩
- 자바스크립트 배열
- MongoDB
- pug
- Nodemon
- CPU
- 모던 자바스크립트 Deep Dive
- Session
- 자료구조
- mongoose
- 프론트엔드
- 자바스크립트
- 표현식과 문
- 컴퓨터 구조론
- 리액트
- 연결자료구조
- 제어유닛
- 마이크로명령어
- JavaScript
- 후위표기법연산
- 컴퓨터 구조
- node.js
- Express
- 제어유니트
- cookie
- 깃허브 로그인
- Today
- Total
목록토이 프로젝트/유튜브 클론코딩 (11)
909 Devlog
1. Array Database 데이터 베이스에 대해 배우기 전에, 백엔드에 데이터를 어떻게 보내는지 먼저 보고 넘어갑시다. 이때까지 작성했던 Router.js 파일들을 보면 get 함수만 사용하고 있었습니다. 이제 post를 통해 데이터를 보내봅시다. 그전에, 이전 포스팅에서 videoController.js 파일의 trending 함수 내부에 const videos 배열을 작성했었습니다. 모든 controller에 배열을 사용하기 위해 배열을 밖으로 꺼내고 let으로 바꿔줍니다. // videoController.js let videos = [ { title: "First Video", rating:5, commnets:2, createdAt:"2 minutes ago", views:59, id:1,..
1. Returning HTML 지금까지 response를 보낼 때, res.end()를 사용하여 response를 끝내버리거나, res.send()를 사용하여 간단한 문자열을 보내기만 했었습니다. 이제 HTML을 보내서 진짜 웹 페이지를 구성해 봅시다. HTML을 보내는 세 가지 방법이 있습니다. 첫 번째 방법은 아래와 같이 res.send()에 HTML의 문자열을 써서 보내는 방법입니다. res.send("Hello World!"); 이 방법을 사용하면 DOCTYPE부터 html, head, body 등등 모든 태그를 다 써서 보내야 합니다. 이 작업을 모든 res.send()에다가 전부 다 한다는 생각을 하기만 해도 끔찍합니다. 매우 귀찮고, 시간이 오래 걸리며, 어려운 작업입니다. 두 번째 방법은..
1. Router router는 앞에서 보았던 컨트롤러와 URL의 관리를 쉽게 해주는 개발자를 위한 구조입니다. router를 만들기 전에 간단한 기획을 생각해 두고 시작합니다. 프로젝트에 대해 생각할 때 가장 먼저 생각해야 하는 건 데이터입니다. 예를 들어 유튜브 클론코딩에서는 영상 데이터, 유저 데이터를 사용합니다. // global router / -> 홈페이지 /join -> 회원가입 /login -> 로그인 /search -> 영상 검색 // user router /users/edit -> 유저 정보 수정 /users/delete -> 유저 삭제 // video router /videos/watch -> 영상 시청 /videos/edit -> 영상 수정 /videos/delete -> 영상 삭제..
1. import express import express from 'express'; // express 패키지 가져오기 const app = express(); // express application 만들기 node_modules에서 express 패키지를 가져오고 application을 생성했습니다. 앱이 작동하려면 사용자의 요청(Request)을 받아 그에 대한 응답(Response)을 보내야 합니다. 사용자가 뭔가를 요청할 때까지 앱을 기다리게 하기 위해서 listen() 함수를 사용합니다. 1.2 listen app.listen(); listen() 함수는 listening 할 port 번호와 콜백함수를 받습니다. port는 컴퓨터의 문이나 창문과 같은 것이며 수많은 port가 있는데 보통 ..
1. 폴더 생성 원하는 곳에 폴더를 생성합니다. 1.1 GitHub 연결 1에서 생성한 폴더에서 터미널을 열고 git init 명령어를 입력해 줍니다. 다음으로 GitHub에 접속하여 repository를 만들고 repository URL을 복사하여 git remote add origin [복사한 URL] [ ]을 빼고 입력해 줍니다. 2. package.json 파일 생성 (Node.js가 설치되어 있어야 합니다.) 1에서 생성한 폴더에서 터미널을 열고 npm init 명령어를 입력하면 npm이 package.json을 만드는 걸 도와줍니다. package name: (폴더 이름) version: (1.0.0) description: entry point: (index.js) test command: ..