반응형
오늘은 출근길에 코드잇 강의를 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); });
그리고 오늘의 퀴즈가 아직까지 배운 내용을 복습하는데 넘나 유용한 내용이었으므로... 잊어버리지 않도록 블로그에도 기록해두면서 오늘의 코드잇 학습일기 끝!
반응형
'프로그래밍 언어 & 데이터베이스 > JavaScript' 카테고리의 다른 글
코드잇 학습일기 Day6. Ajax, PATCH/HEAD 메소드, fetch함수, 동기/비동기 실행 (0) | 2023.02.15 |
---|---|
코드잇 학습일기 day5. 자바스크립트 Status Code와 Content-Type 헤더 (0) | 2023.02.13 |
코드잇 학습일기 day3. JSON 데이터 자바스크립트 객체 변환, Request와 메소드 종류 (0) | 2023.02.06 |
코드잇 학습일기 day2. 웹환경 이해하기 - web, URL, https (0) | 2023.02.02 |
코드잇 학습일기 Day1. 개발자 도구, 자바스크립트 fetch 함수 (0) | 2023.01.31 |
댓글