바위 뚫는중

[Node.js] Express와 MongoDB를 이용한 CRUD 프로젝트 - (1) 본문

Nodejs

[Node.js] Express와 MongoDB를 이용한 CRUD 프로젝트 - (1)

devran 2022. 10. 21. 18:13
반응형

Express와 MongoDB를 이용한 CRUD 프로젝트

https://zellwk.com/blog/crud-express-mongodb/

위를 참고했다!

개발환경 👩🏻‍💻

Macbook M1

node.js, Express 설치되어있음

CRUD 란?

차례로 만들기, 읽기, 수정, 삭제로 생각하면 편하다.

  • Create : Post - Make something
  • Read: Get - Get Something
  • Update: Put - Change something
  • Delete: Delete - Remove something

뭔들, 직접 만들어보면서 느껴보자.

환경설정 및 준비

  1. CRUD 프로젝트를 위한 디렉토리 만들기
  2. npm init을 통해 package.json 파일 생성 (모두 enter)
  3. node 실행 파일 ‘server.js’ 만들어주기
touch server.js

  4.  server.js에 console.log 입력해주기

// server.js
console.log('May Node be with you')

  5.  server.js 실행해주기

node server.js

Express 설치 및 사용

Express 설치

npm install express --save

server.js 수정

console.log('May Node be with you')

// express를 사용할 것이다
const express = require('express');
const app = express();

// 포트 3000번에 server를 만들어주기 
app.listen(3000, function() {
  console.log('listening on 3000')
})

수정 후, node server.js를 재실행!

다음과 같이 뜬다면 완벽! CRUD를 위한 모든 준비가 완료되었다.

CRUD - READ

아까 전 띄운 서버는 브라우저로 아무것도 보내지 않았기 때문에

cannot GET / 이렇게 뜸.

Express 에서의 Get 사용법은 다음과 같다.

app.get(endpoint, callback)

endpoint: (=requested endpoint) 도메인 네임 뒤에 따라오는 주소들

사실 우리가 localhost:3000 을 방문한다는 것은,

localhost:3000/ 을 방문한다는 소리다

예시로는, ‘내 블로그 주소/이 글이름’ 여기서 ‘/이 글이름’이 requested endpoint 이다

callback: requested endpoint에 도달했을때 서버가 해야할 것

localhost:3000/ 으로 따지자면, endpoint인 ‘/’ 에 도달했을때 서버가 해야할 것을 말한다.

callback은 두가지 인수를 가짐: request 객체, response 객체

// We normally abbreviate `request` to `req` and `response` to `res`.
app.get('/', function (req, res) {
  // do something here
})

자, 그렇다면 아까 띄운 웹에 말이라도 써보자

app.get('/', function(req, res) {
  res.send('안녕 CRUD를 배워볼게!')
})

좀 더 응용해서, html을 띄워보자

디렉토리에 index.html을 만들어주고 그냥 아무말이나 써보고, 연동해주자.

(참고로 원문의 글은 자바스크립트 ES6를 기반으로 쓰여졌기에, 나도 그냥 그렇게 함,,

자바스크립트ES6 책 사둔거 언제 독파하지?)

app.get('/', (req, res) => {
  res.sendFile(__dirname + '/index.html')
  // Note: __dirname is the current directory you're in. Try logging it and see what you get!
  // Mine was '/Users/zellwk/Projects/demo-repos/crud-express-mongo' for this app.
})

마찬가지로 node server.js 빼먹지 않기!

아주 완벽하다.

위와 같은 과정들을 반복하며 그때그때 server를 실행하는 것이 너무 귀찮으니 Nodemon이라는 것을 설치하자. 난 설치되어 있었군

Nodemon : server를 자동으로 다시시작해주는 프로그램

npm install nodemon --save-dev #nodemon 설치

npm run dev #nodemon 실행

실행전에 package.json file에

“dev” : “nodemon server.js”

를 반드시 추가해주고 실행해야 함!!!

다음은 CREATE!

 

https://dev-raeun.tistory.com/27

 

[Server] Express와 MongoDB를 이용한 CRUD 프로젝트 - (2)

https://dev-raeun.tistory.com/26 저번시간이어서 진행! [Server] Express와 MongoDB를 이용한 CRUD 프로젝트 - (1) Express와 MongoDB를 이용한 CRUD 프로젝트 https://zellwk.com/blog/crud-express-mongodb/..

dev-raeun.tistory.com

반응형