베이직반 11회차
async await
async await 는 비동기 작업을 처리할때 사용하는 자바스트립트 문법이다
async 는 자동으로 promise 를 반환 한다
함수안에 비동기 작업이 있을 때 사용
await 는 promise 가 처리 될때까지 기다리게 도와준다
await 는 async 함수 안에서만 사용이 가능하다
예시
async function fetchData() {
const response = await fetch('https://api.example.com/data'); // 비동기 작업을 기다림
const data = await response.json(); // 데이터를 기다림
console.log(data);
}
fetch 함수는 데이터를 가져오는시간이 필요하다
await 는 시간이 지나기 전까지 다른 작업을 하지 않게 도와준다
async function ; returns a promise
await : waits for the promise to reslove b4 continnuing.
async 와 await 를 쓰면 좋은 점
코드 가독성이 좋아진다
try 와 catch 를 통해 에러 처리도 쉽게 할 수있다
비동기 코드 작성이 직관적이다
에러처리에 편하다
json sever
api 를 만들때 사용 하는 도구
실제 서버를 만들지 않고 ,json 파일을 이용해서 가짜 api 를 테스트할 떄 도와줌
프론트앤드 개발자가 백앤드 서버 없이도 데이터 테스트를 할수있게 도와줌
restful api 제공; json 형식의 파일을 기반으올 get , post , put delete 같은 crud 작업을 할 수있다
실제 서버가 없어도 빠르게 api 를 대신해서 사용할수있다
json sever 설치 방법
npm install -g json-server
yarn add json-server
(프로젝트 폴더에 JSON Server가 설치된다
프로젝트에 필요한 의존성으로 추가할 수 있다)
데이터파일만들기
db.json 이라는 파일 만들고
데이터를 넣어준다
{
"posts": [
{ "id": 1, "title": "Hello World", "author": "User1" },
{ "id": 2, "title": "JSON Server", "author": "User2" }
]
}
json server 실행 방법
json-server --watch db.json
이것을 치면 http://localhost:3000/posts에 접근할 수 있는 간단한 API 서버가 열린다
전역설치를 월할때
yarn global add json-server
102524 til (0) | 2024.10.25 |
---|---|
102424 TIL (0) | 2024.10.24 |
102224 til React Router: `useNavigate`와 `Link` 컴포넌트의 차이점 (2) | 2024.10.22 |
102124 Til mbti 과제 (5) | 2024.10.21 |
101824 til (1) | 2024.10.18 |