[AI스쿨] express js POST로 데이터추가하기

[AI스쿨] express js POST로 데이터추가하기 — #expressjs #expressREST #RESTfulAPI #expressPOST AI스쿨 msa기반 java 백엔드 코스 중...

#Node js#Naver Blog

#expressjs #expressREST #RESTfulAPI #expressPOST

AI스쿨 msa기반 java 백엔드 코스 중에 공부한 내용을 작성하였습니다

학습법 이론

학습을 하기 이전, 명심해야할 학습법이 있다.

1.이해가지 않는다고 뒤돌아가 다시 보지 말 것

2.외우지 말라

=> 자주 봐서 외워짐을 당하라

=> 크롬을 통해 copy and paste하라

=> 왜 생겨났는지?

=> 왜 사용하는지?

===> 응용이 가능해진다.

4.새로운 지식을 넣을땐 뇌를 비우자

express js RESTful API 설계하기 POST

RSET POST

REST의 Create에 해당하는 Http 매서드는 POST입니다. POST를 테스트하기 위해서는 포스트맨과 같은 툴을 사용하는 것이 좋습니다.

POST 데이터 추가 설계하기

app.post

app.post를 활용하여 POST매서드를 사용할 수 있습니다. 해당 경로를 연결하고 req.body데이터를 받습니다.

데이터

const products = \[ { id: 1, name: "pencil", price: 500 }, { id: 2, name: "book", price: 15000 },\];

실습에 사용할 데이터이다.products배열안에 객체형태로 데이터가 담겨있으며, key: value는 3개가 들어있다.

app.post("/products", (req, res) => { const { name } = req.body; const { price } = req.body; let product = { id: products.length + 1, name: name, price: price, }; products.push(product); res.send({ message: "데이터 추가 완료", data: product, });});

/products url로 post요청을 보냈을 경우로 설정하였습니다. req.body안에 데이터를 담아서 보낼것이므로 name과 price를 key로 변수로 바로 받았습니다.

post내부에서 product를 생성하여 key:value를 클라이언트에서 받은 데이터로 구성하였고(name,price), id는 자동으로 카운트 되게끔 .length를 사용하였습니다.

products는 배열인데 객체가 담겨있는 배열입니다. 결국 배열이므로 배열에 요소를 추가할때는 .push배열함수를 사용하여 데이터를 추가 후 res.send로 추가된 데이터를 찍어보았습니다.

postman에서 확인하기

postman을 사용하여 데이터가 제대로 들어갔는지 확인해 보겠습니다. 다운로드 방법은 구글링을 통해 찾아보면 좋을 것 같습니다.(댓글에 링크달아두겠습니다)

우선 만들어둔 express파일을 실행한 뒤 설정한 포트번호로 GET요청을 보냅니다.

제일 처음 만들어두었던 products데이터가 찍히는 것을 볼 수 있습니다.

POST요청보내기

설정한 url로 post요청을 보낸 후 Body - x-www-form-unlencoded형태로 보냅니다.

오류가뜰 상단에 경우 아래 코드를 추가해주세요.

app.use(express.json());app.use( express.urlencoded({ extended: true, })); //추가해야 x-www-form형태로 전송가능

POST결과

POST요청 정상적으로 작동한것을 볼 수 있습니다. 이제 다시 GET요청으로 전체 데이터를 가져오겠습니다.

전체데이터(추가된 데이터 확인)

데이터가 추가된 것을 확인할 수 있습니다.

여기까지 POST요청에 대해 알아보았고, 역시나 핵심은 POST요청을 어떻게 하고 어떤식으로 데이터를 받아서 추가할것인지를 API 개발자가 고려해야합니다.