"한빛미디어 서평단 <나는리뷰어다> 활동을 위해서 책을 협찬 받아 작성된 서평입니다."
저는 “내가 되고 싶은 사람처럼 행동하면 결국 그 사람이 되어 있을 것이다”라는 말을 좋아합니다. 제가 가장 바라는 것은 개발자가 되어 경제활동을 하는 것이고, 그렇다면 개발자가 된 것처럼 행동하다 보면 언젠가 진짜로 그 모습에 닿을 수 있지 않을까 기대합니다. 이번 책도 그런 마음으로 골랐습니다. 제목에 담긴 ‘실무’, ‘웹 API’라는 단어가 웹과 프론트엔드를 중심으로 공부해 온 제게 실무와 맞닿은 지식을 얻을 수 있을 것 같은 기대를 주었기 때문입니다.
책을 처음 받아들었을 때는 생각보다 얇다는 점이 가장 눈에 띄었습니다. 300쪽 남짓한 분량이라 생각보다 가벼웠습니다. 이동 중에도 부담 없이 펼쳐 볼 수 있겠다 싶었습니다. 실제로 대중교통을 이용할 때마다 자연스럽게 꺼내 읽으며 시간을 보낼 수 있었습니다.
책에서는 정말 다양한 Web API들을 다룹니다. Fetch, Promise, Storage 등을 포함해 10개 이상의 Web API가 소개되고, 앞으로 나올 API들도 함께 언급됩니다. 그래서 마지막 챕터에서 저자가 말한 것처럼, “서드파티 라이브러리를 굳이 쓰지 않아도 많은 기능을 구현할 수 있지만, 그렇다고 라이브러리를 무조건 배제할 필요는 없다”는 메시지가 크게 와닿았습니다.
제가 자주 쓰던 Axios 같은 라이브러리의 get
, post
메서드들은 사실 순수 Fetch API만으로도 구현이 가능한 경우가 많습니다. 다만 라이브러리를 쓰면 여러 보일러플레이트(반복 코드)를 줄일 수 있습니다. 그래서 책에서 지적한 “접착 코드(glue code)”라는 표현에 공감됐습니다.
// Axios 예시
axios.get('/api/users')
.then(response => {
console.log(response.data);
})
.catch(error => {
console.error(error);
});
// Fetch로 비슷하게 구현한 예시
fetch('/api/users')
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
// Fetch API는 Axios 라이브러리와 다르게JSON 파싱이 필요하다.
return response.json();
})
.then(data => {
console.log(data);
})
.catch(error => {
console.error(error);
});
가장 기억에 남는 개념은 IndexedDB였습니다. 그동안 사용해본 적도 없고, 왜 필요한지도 잘 몰랐는데, 책을 통해 알아낼 수 있었습니다. 웹 스토리지는 문자열 데이터만 저장할 수 있다는 한계가 있어서, 복잡한 구조의 데이터를 다루기에는 제약이 있습니다. 이 한계를 보완하기 위해 IndexedDB가 도입 되었습니다.
IndexedDB는 객체 단위로 데이터를 저장할 수 있습니다. 또한 비동기 API라서 사용자 인터페이스(UI)를 막지 않으며, PWA(Progressive Web App) 같은 오프라인 기능을 구현하거나 네트워크가 불안정한 상황에서 데이터를 임시 저장하는 데 유용합니다.
IndexedDB가 실제로 어떤 서비스에 활용되는지 궁금해 추가로 조사해 본 결과, 노션이나 트렐로 같은 서비스가 오프라인에서도 일정 부분 동작할 수 있는 이유를 이해하게 되었습니다.
서드파티 라이브러리를 쓰지 않아도 브라우저가 기본적으로 제공하는 Web API가 이렇게 다양하다니!