
Express์์ ์ ์ ํ์ผ ์ ๊ณต
์ด๋ฏธ์ง, CSS ํ์ผ ๋ฐ JavaScript ํ์ผ๊ณผ ๊ฐ์ ์ ์ ํ์ผ์ ์ ๊ณตํ๋ ค๋ฉด Express์ ๊ธฐ๋ณธ ์ ๊ณต ๋ฏธ๋ค์จ์ด ํจ์์ธ express.static
์ ์ฌ์ฉํ์ญ์์ค.
์ ์ ์์ฐ์ด ํฌํจ๋ ๋๋ ํ ๋ฆฌ์ ์ด๋ฆ์ express.static
๋ฏธ๋ค์จ์ด ํจ์์ ์ ๋ฌํ๋ฉด ํ์ผ์ ์ง์ ์ ์ธ ์ ๊ณต์ ์์ํ ์ ์์ต๋๋ค. ์๋ฅผ ๋ค๋ฉด, ๋ค์๊ณผ ๊ฐ์ ์ฝ๋๋ฅผ ์ด์ฉํ์ฌ public
์ด๋ผ๋ ์ด๋ฆ์ ๋๋ ํ ๋ฆฌ์ ํฌํจ๋ ์ด๋ฏธ์ง, CSS ํ์ผ ๋ฐ JavaScript ํ์ผ์ ์ ๊ณตํ์ญ์์ค.
Express์์ ์ ์ ํ์ผ ์๋น์ค์ ๊ดํ ์ ์๋ฅผ ํด๋์ ๊ฒ์ด๋ค.
์ ์ ํ์ผ์ ์๋น์คํ๋ค๋ ๋ง์ ์ฌ๋์ด ํ๋ฒ ๋ง๋ค์ด ๋์ ๊ฒ์ด ์ธ์ ๋ ๋๊ฐ์ด ๋ณด์ด๋ ๊ฒ์ ์ ์ ์ด๋ผ๊ณ ํ ์ ์๋ค.
์ด์ ์ ์ฌ์ฉํ๋ ์ฝ๋์์ ํ ์ค๋ง ์ถ๊ฐํ ๊ฒ์ด๋ฏ๋ก ๊ธฐ์กด ์ฝ๋๋ฅผ ๊ฐ์ง๊ณ ์ค๋ช
์ ํด๋ณด๊ฒ ๋ค.
์ผ๋จ ๋ด๊ฐ ํ๋ ค๊ณ ํ๋ ์์
์ ์๋ฒ๋ฅผ ๊ตฌ๋ํด์ ์์ฒญ์ด ๋ค์ด์์ ๋ ๋ด๊ฐ ๊ฐ์ง๊ณ ์๋ ์ด๋ฏธ์งํ์ผ์ ํ๋ ๋ณด์ฌ์ฃผ๋ ค ํ๋ ๊ฒ์ด๋ค.
๋ฌผ๋ก ๊ทธ ์์ฒญ์ด๋ผ๋ ๊ฒ์ ์ด๋ฏธ์งํ์ผ์ ๋ณด์ฌ๋ฌ๋ผ๋ ์์ฒญ์ด๋ค.
์ผ๋จ public์ด๋ผ๋ ๋๋ ํ ๋ฆฌ๋ฅผ ํ๋ ๋ง๋ค์.(์ด๊ฑด ๊ด์ต์ ์ผ๋ก public์ด๋ผ๊ณ ๋ช
๋ช
ํ๋ค๊ณ ํ๋ค.) ์ด ๋๋ ํ ๋ฆฌ๋ ๋ณด์ฌ์ฃผ๋ ค๋ ์ด๋ฏธ์งํ์ผ์ ๋ฃ์ผ๋ ค๊ณ ํ๋ ๋๋ ํ ๋ฆฌ์ด๋ค. ํ ๋๋ ํ ๋ฆฌ (npm init์ด ๋ ๊ณณ)์์ public์ด๋ผ๋ ๋๋ ํ ๋ฆฌ๋ฅผ ๋ง๋ ๊ธฐ์ค์ผ๋ก ํ ๊ฒ์ด๋ค.
| var express = require('express'); var app = express(); app.use(express.static('public')); app.get('/',function(req,res){ res.send('Hello World!'); }); app.listen(3000,function() { console.log("Example app listening on port 3000!"); }); | cs
|
์ด์ ์ฝ๋์ ๋ค๋ฅธ์ ์ด๋ผ ํ๋ฉด์ app.use(express.static('public'));
์ด ํ ์ค์ด ์ถ๊ฐ๋ ๊ฒ ๋ฟ์ด๋ค.
์ด ์ค์ ์ถ๊ฐํ๋ฉด public ๋๋ ํ ๋ฆฌ์ ์๋ ํ์ผ์ ๋ก๋ํ ์ ์๋ค.
ํด๋น ์ฝ๋๋ฅผ node ๋ช
๋ น์ด๋ก ์คํ์ํค๊ฒ๋๋ฉด ์ด์ ํฌ์คํ
ํ๋ ๊ธ์ฒ๋ผ ์๋ฒ ์ ์์ด ๋ ๊ฒ์ด๊ณ ,
public ๋๋ ํ ๋ฆฌ์ ์กด์ฌํ๋ ์ด๋ฏธ์งํ์ผ์ ํ๋ค์์ url์ ๋ค์ชฝ์ ์ด์ด์ ์์ฑํด์ฃผ๋ฉด ํด๋น ์ด๋ฏธ์ง ํ์ผ์ด ๋ก๋๋์ด ๋ณด์ฌ์ง๋ค.

public์ด๋ผ๋ ๋๋ ํ ๋ฆฌ์ ์กด์ฌํ๋ ์ด๋ฏธ์ง์ด๋ฉฐ ํ์ผ์ด๋ฆ์ ํ์ฅ์๋ช
๊น์ง ๋ชจ๋ ์จ์ค์ผํ๋ค.
์ง๊ธ์ ์ด๋ฏธ์ง๋ง ๋ฌ๋ ๋ณด์ฌ์ฃผ๋ ํํ์ด๊ณ , ์กฐ๊ธ ๋ ๋์๊ฐ์ ๋ด๊ฐ ์ด์ ์ app.get์ด๋ผ๋ ๋ฉ์๋๋ฅผ ํตํด ๋ผ์ฐํ
์ ์ํํ๋ค๊ณ ํ์๋ค. ์ฆ, ๋ค๋ฅธ ๊ฒฝ๋ก(ํ์ด์ง)์์๋ public ๋๋ ํ ๋ฆฌ์ ์๋ ์ด๋ฏธ์ง๋ฅผ ์ฌ์ฉํ ์ ์๋ค. ์๋ฐ์์๋ static ๋ณ์๋ผํ๋ฉด ์ด๋ ํด๋์ค์์๋ ์ฌ์ฉํ ์ ์๋ ๋ณ์ ๋ผ๊ณ ๋ณผ ์ ์๋๋ฐ ๋น์ทํ ์๋ฏธ์ธ ๋ฏ ํ๋ค.
| app.get('/topic',function(req,res) { res.send('Hello btn, <img src="/enroll_btn.jpeg">'); }) | cs |
๋ด๊ฐ ๊ธฐ์กด ์ฝ๋์ ์์๊ฐ์ ์ฝ๋๋ฅผ ์ถ๊ฐํ๋ค๊ณ ํ๋ฉด topic์ด๋ผ๋ ๊ฒฝ๋ก์์๋ public ๋๋ ํ ๋ฆฌ์ ์๋ ์ด๋ฏธ์ง๋ฅผ ๋ก๋ํ ์ ์๋ค. ๋ฌผ๋ก ์์ ์์ค์ฝ๋์์๋ topic ๋๋ ํ ๋ฆฌ์ ์๋ ์ด๋ค ํ์ผ์ ์คํํ๋ ํํ๊ฐ ์ ํ ์๋๊ณ ๊ทธ๋ฅ ํ์ด์ง์ ๋ฐ๋ก sendํ๋ ํํ์ธ๋ฐ ๋ค๋ฅธ ๊ฒฝ๋ก์์๋ ์ฌ์ฉํ ์ ์๋ค๋ ๊ฒ์ ๋ณด์ฌ์ฃผ๋ ค๊ณ ํ๋ค. ์์๊ฐ์ด ์ฝ๋ฉํ๊ฒ ๋๋ฉด topic์ด๋ผ๋ ๊ฒฝ๋ก์ url๋ก ์ ์ํ์ ๋ ๋์ค๋ ๊ฒฐ๊ณผ๋ ์ด๋ฌํ๋ค.

๊ฒฝ๋ก๋ฅผ ๋ณด๋ฉด topic์ด๋ผ๋ ๊ฒฝ๋ก์์๋ public์ ์๋ ์ด๋ฏธ์งํ์ผ์ ๋ก๋ํ๊ณ ์๋ ๊ฒ์ ๋ณผ ์ ์๋ค.