React 프로젝트 (북마크)

✅ 북마크 프로젝트에서 axios 적용

axios

사용 시 별도의 외장 라이브러리 설치 필요.
npm i axios

참고글 - react에서 axios 사용하기
참고글 - fetch와 axios
참고글 - axios 형식
참고글 - axios

코드 리팩토링 (post)

• fetch 사용시

 fetch(`https://book-marking.herokuapp.com/comments/`, {
            method: "POST",
            headers: {
                "Content-Type": 'application/json; charset=UTF-8',
            },
            body: JSON.stringify({
                name: name,
                title: title,
                link: link,
                txt: text,
            }),
        })

• axios 사용시

 axios.post(`https://book-marking.herokuapp.com/comments/`, {
            name: name,
            title: title,
            link: link,
            txt: text,
        })

코드 리팩토링 (delete)

res.ok가 안됨. 왜?

• fetch 사용시

fetch(`https://book-marking.herokuapp.com/comments/${e}`, {
            method: "DELETE",
        }).then(res => {
            if (res.ok) {
                !del ? setDel(true) : setDel(false);
            }
        });

• axios 사용시

axios.delete(`https://book-marking.herokuapp.com/comments/${e}`)
            .then(res => {
                !del ? setDel(true) : setDel(false);
            });