일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- javscript
- react
- JavaScript
- NextJs
- pug
- ECMAScript
- Session
- CLONE
- TypeScript
- nodejs
- node.js
- 리액트
- backend
- heroku
- Flutter
- MongoDB
- API
- frontend
- Component
- graphQL
- express
- 자바스크립트
- HTML
- CSS
- ES6
- GRID
- form
- DART
- clonecoding
- Mongoose
- Today
- Total
Enjoy Programming
Express (Node.js) route 본문
자 cocoatalk을 클론코딩하며 한번 다룬적이 있는 GET/POST방식을 한번 더 되짚어 보자.
기본적으로 우리가 브라우저에 접근하여 페이지를 로딩하면 GET방식을 통하여 로딩된다.
그리고 로그인하게 되면 POST방식을 통해 브라우저가 웹사이트에 정보를 전달하게 된다.
GET request로는 정보를 전달 할 수 없다. POST로 해야한다.
예를 들어 댓글을 달게 되면 정보를 서버에 전달하기 위해 POST request를 만들어 낸다.
그럼 서버는 실행을 하게 되는데 이는 저장이 아니라 그저 http에 적합한 method를 이용하기 위함이다.
http request method는 여러가지가 있는데 mdn에서 확인 해보자
developer.mozilla.org/ko/docs/Web/HTTP/Methods
HTTP 요청 메서드 - HTTP | MDN
HTTP 요청 메서드 HTTP는 요청 메서드를 정의하여, 주어진 리소스에 수행하길 원하는 행동을 나타냅니다. 간혹 요청 메서드를 "HTTP 동사"라고 부르기도 합니다. 각각의 메서드는 서로 다른 의미를
developer.mozilla.org
GET을 먼저 보자
app.get("/", 함수); 라우트를 먼저 하나 만들어준다.
이를 통해 누군가 root url에 접근하면 응답을 해주는 거다.
함수를 하나 만들어주고 매개변수에 request와 response변수를 담아주자
보통 request object와 response object가 들어간다
예를 들어 post방식일때 누군가 아이디와 패스워드를 입력해서 로그인을 요청하면 서버에서 request object로
그 정보를 얻을 수 있는 것. response object를 응답 해주는 것.
그리고 함수가 실행되면 hello를 response 해준다.

이렇게 npm start하면 아까와는 다르게
접근한 사람에게 웹에서 hello lee를 보여준다

하나 더 만들어 보자

handleProfile함수를 만들었고 You are on my profile을 뿌려준다.
route는 get방식으로 profile페이지에 접근하면 handleProfile을 실행 해준다.
기억났다!! flask할때 @app.route("/", method=["GET"]) 이거다....
플라스크는 라우트 설정 밑에 함수를 적어줬었지.
이제 resposne할 내용을 html, css등등을 작성해서 보내주면 되는 거다.
flask를 그래도 잠시나마 해봐서 뭔가 이해가 더 잘 된다.
다음 시간에는 Babel을 이용해서 javascript코드를 업데이트 해보자
'JavaScript > Node.JS' 카테고리의 다른 글
Express (Node.js) - middleware (0) | 2021.04.07 |
---|---|
Babel and nodemon (0) | 2021.04.07 |
Express (Node.js) 서버만들기 (0) | 2021.04.06 |
Express (Node.js) 설치하기 (0) | 2021.04.06 |
Express ( framworks) (0) | 2021.04.06 |