인턴으로 4개월정도 일하게 되는 곳에서 NodeJS 기반 웹 개발 능력이 필요하다 되어있었는데, 직접 DB 다루고 이런 작업을 해본지가.. 대략 3년 전이라 상기시킨다는 느낌으로 코딩애플 선생님 강의 하나 수강하며 정리를 해보기로 마음먹었다.
-
폴더 하나를 생성하여 vscode로 열어주고,
server.js라는 이름의 파일 하나를 생성한 뒤,
- 새로 터미널 창을 하나 열어
npm init -y입력해보면 아래 이미지처럼 뜰 것이다.
이후 폴더를 확인해보면 package.json파일이 생성되어 있음을 확인할 수 있다.
- 이후, express 라이브러리를 설치하기 위해
npm install express입력하여 설치!
여기까지 진행했으면 폴더 상태는
이렇게 된다.
- 이제 server.js에 몇 줄 적어주자.
const express = require('express')
const app = express()
app.listen(8080, () => {
console.log('http://localhost:8080 에서 서버 실행중')
})
app.get('/', (요청, 응답) => {
응답.send('응답함 반갑다')
})
여기에서
const express = require('express')
const app = express()해당 코드는 express 라이브러리를 사용하기 위해 작성한 것,
app.listen(8080, () => {
console.log('http://localhost:8080 에서 서버 실행중')
})해당 코드는 port 번호를 작성하여 서버를 띄우는 코드,
app.get('/', (요청, 응답) => {
응답.send('응답함 반갑다')
})이 코드는 서버의 기능을 위해 작성하는 코드.
- 이까지 했으면 저장하고 터미널에서 해당 파일을 node를 사용하여 실행시켜준 뒤,
node 실행할파일명
브라우저를 통해 열어보면
요로케 잘 나와있다.
express 라이브러리 사용법(get함수)
위랑 똑같이
const express = require("express");
const app = express();
app.listen(8080, () => {
console.log("http://localhost:8080 에서 서버 실행중");
});해당 코드는 살려두고,
app.get('/URL', (요청, 응답) => {
응답.send('데이터~~~');
});'/URL'에 원하는 url을 넣고,
콜백되는 '데이터~~~'부분에는 보여주고자 하는 데이터를 입력.
참고로 화살표 함수 말고
app.get("/URL", function(요청, 응답){
응답.send("데이터~~~");
});이렇게 작성해도 당연히 콜백함수로 사용 가능..
아무튼 필자는 아래처럼 3가지를 추가해보았다.
app.get("/", (요청, 응답) => {
응답.send("응답함 반갑다");
});
app.get("/news", (요청, 응답) => {
응답.send("오늘의 태풍 온다고 함");
});
app.get("/shop", (요청, 응답) => {
응답.send("쇼핑페이지입니다.");
});만약 앞서 test하느라 서버가 켜져있는 경우라면,
터미널창에 ctrl + c로 서버를 껐다가 다시 켜보면..
잘 적용된다.
데이터로 html 파일 보내는 것도 당연히 가능!
기본 중 기본.. index.html을 만들어서 아래처럼 보내고 확인해본다.
참고로 ! 쓰고 탭버튼 누르면 자동완성 된다..!
자꾸 언어변경 어쩌구 뜨는 거 스트레스받아서 lang만 ko로 바꿔줌!
다시!! server.js로 돌아가서
app.get("/", (요청, 응답) => {
응답.sendFile(__dirname + "/index.html");
});.send대신에 .sendFile을 사용하여 __dirname이후에 보여줄 파일을 넣고 서버를 다시 시작해보자.
잘 보인다~~^^
