본문 바로가기
프로그래밍 언어 & 데이터베이스/JavaScript

코드잇 학습일기 day4. 각각의 Request 보내는 방법

by ♥︎해이나♥︎ 2023. 2. 9.
반응형

오늘은 출근길에 코드잇 강의를 7개 들었다. 그리고는 '이따가 출근해서 시간날 때 블로그에 학습일기 써야지' 하고 생각했는데, 이것저것 각종 업무들을 처리하다보니 퇴근시간이 10분밖에 남지 않았다. 오늘은 저녁에 일정이 있어서 퇴근시간을 꼭 지켜야 하는 상황... 그래서 각각의 Request 보내는 방법만 간략하게 정리하고, 추가로 알고있으면 좋은 개념들은 다음 포스팅에 다시 쓰는걸로...!

 

코드잇 학습인증

 

GET Request 보내기

이제 GET Request 보내는 방법은 넘나 익숙해서 안보고도 쓸 수 있을 것 같다.

 

fetch('url')
  .then((response) => response.text())
  .then((result) => { console.log(result); });

 

POST Request 보내기

POST Request는 추가할 데이터를 함께 보내주어야 한다. 아래와 같은 코드를 써서 새로운 데이터를 등록할 수 있다.

 

const newName = {
  name: 'Heina',
  email: 'heina@haina.com',
  department: 'Design',
};

fetch('url', {
  method: 'POST',
  body: JSON.stringify(newName),
})
  .then((response) => response.text())
  .then((result) => { console.log(result); });

 

PUT Request 보내기

PUT Request도 POST Request와 마찬가지로 어떤 부분을 수정할 것인지 함께 알려 주어야 한다. 

 

const editName = {
  name: 'Heina',
  email: 'heina@haina.com',
  department: 'Design',
};
// 수정하고 싶은 내용으로 작성

fetch('url', {
  method: 'PUT',
  body: JSON.stringify(editName),
})
  .then((response) => response.text())
  .then((result) => { console.log(result); });

 

DELETE Request 보내기

DELETE Request를 보낼 때에는 url에 삭제하고 싶은 경로를 입력해야 하고, 삭제할 데이터를 굳이 함께 보낼 필요는 없다.

 

fetch('url/삭제하고싶은경로', {
  method: 'DELETE',
  body: JSON.stringify(newName),
})
  .then((response) => response.text())
  .then((result) => { console.log(result); });

그리고 오늘의 퀴즈가 아직까지 배운 내용을 복습하는데 넘나 유용한 내용이었으므로... 잊어버리지 않도록 블로그에도 기록해두면서 오늘의 코드잇 학습일기 끝!

 

 

반응형

댓글