dejs curd-express 단계 1-5

6999 단어 nodejs
curd-express 단계:
1. 템플릿 처리
bootstrap 템플릿
2. 오픈 정적 리소스 구성
npm init -y
npm i -S express

정적 자원:
​ public:css/image/js
3. 템플릿 엔진 구성
express에서art-template 템플릿 엔진 사용하기 설정
설치:
npm install --save art-template
npm install --save express-art-template

구성:
//        
app.engine('html',require('express-art-template'))
app.engine('art',require('express-art-template'))

사용:
app.get('/',function(req,res){
    //express        views   index.html
    res.render('index.html',{
        title: 'hello world'
    })
})

기본views 디렉터리 수정
app.set('views',render       )

4. 간단한 라우팅
4.1/students 정적 페이지 렌더링
​ public/css/main.css
4.2express에서 폼get 요청 매개 변수 가져오기
express에 API가 내장되어 있으며, 직접 Req를 통과할 수 있습니다.query에서 가져오기
	req.query

4.3 express에서 폼post 요청체 데이터 가져오기
body-parse
설치:
npm install --save body-parse

구성:
var express = require('express')
var bodyParser = require('body-parser')
var app = express()
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))
// parse application/json
app.use(bodyParser.json())
app.use(function(req,res){
    res.setHeader('Content-Type','text/plain')
    res.write('you posted: 
'
) res.end(JSON.stringify(req.body,null,2)) })

5. 라우팅 설계
요청 방법
요청 경로
get 매개 변수
post 매개 변수
비고
GET
/studens
첫 페이지 렌더링
GET
/students/new
학생 추가 페이지 렌더링
POST
/studens/new
name、age、gender、hobbies
학생 추가 요청 처리
GET
/students/edit
id
편집 페이지 렌더링
POST
/studens/edit
id、name、age、gender、hobbies
편집 요청 처리
GET
/students/delete
id
삭제 요청 처리

좋은 웹페이지 즐겨찾기