2w_express란 무엇인가.

YoonJu Lee·2021년 7월 21일
0

Express란?

1. 웹서버

  • 우리가 google.com 을 웹브라우저 주소창에 적으면 화면에 구글 검색창이 보이죠? 이 검색창 화면을 우리에게 보내준 것을 웹서버라고 합니다.
  • 웹브라우저의 주소창에 특정 주소를 적으면 브라우저는 해당 주소에 있는 웹서버를 호출하고 웹서버는 해당 홈페이지 내용을 웹브라우저에 보내주는 방식입니다.

2. 기초개념 - 웹 프레임워크

Node.js 에서도 웹서버를 만들 수 있습니다. 하지만 웹서버를 만들기 위해서는 이것저것 매번 해야하는 일들이 있습니다. 예를들면 url 로 넘어온 파라미터들을 분류해서 가져오는 일이라던가, 정적인 이미지나 js 파일들을 관리하는 일, 로그인을 위한 작업 등등 웹서버라면 필요한 기능들을 미리 만들어둔 것을 프레임워크(framework)라고 합니다. 그중 express 는 node에서 웹서버를 만들기 위해 쓸 수 있는 프레임워크 중에 가장 보편적으로 쓰이는 것입니다.

3. package.json 생성

$ npm init -y

뒤의 -y는 npm init 명령 실행시 원래는 프로젝트명이나 버전등을 물어보는데 그런 것들을 물어보지 않고 기본값으로 알아서 설정해주는 옵션입니다. npm init -y를 마치면 아래와 같은 폴더 구조로 package.json파일이 생성되었는지 확인해봅시다.

4. express 설치

$ npm install express

5. index.js

SPA_MALL 폴더 안에 index.js라는 파일을 아래와 같이 만들어봅시다. 폴더 구조는 아래와 같습니다.

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`listening at http://localhost:${port}`)
})

  • package.json 파일을 다시 열어봤을때 express 관련된 내용이 들어있으면 정상적으로 설치가 된 것입니다.
  • package-lock.json은 어떤 패키지들이 어떤 버전으로 설치되었는지 기록해놓은 파일입니다. 나중에 이 파일이 있으면 다른 동료들과 협업할때 같은 환경으로 개발할 수 있게 도와줍니다.
  • node_modules 폴더는 실제로 설치된 패키지들이 들어있는 폴더입니다. 앞으로 다양한 패키지들을 설치할텐데 그런 관련 패키지들이 다 여기에 들어갈 것입니다.

6. 서버 실행

$ node index.js

크롬 브라우저에서 http://localhost:3000/ 를 입력한뒤, Hello World가 잘 보이는지 확인해봅시다.

profile
Coder가 아닌 Engineer를 향해서.

0개의 댓글