FrontEnd 번역
1.[번역] 자바스크립트 프레임워크에서 효율적인 하이드레이션(Hydration)이 어려운 이유
자바스크립트 프레임워크에서 사용하고 있는 다양한 하이드레이션(Hydration)의 방법을 설명하며, 각각 어떤 한계점을 가지고 있는지 설명하고 있습니다.
2.[번역] 꼭 써봐야 하는 10가지 리액트 커뮤니티의 훅(hook)들
리액트 커뮤니티에서 만들어진 10가지의 유용한 훅(hook)을 소개하고 있습니다. 리액트로 서비스를 제공하고 계신다면 분명 도움이 될 훅이 하나쯤은 있을 것이라고 생각합니다 :)
3.[번역] 자바스크립트에 타입 구문 도입 제안
마이크로소프트(MS)에서 지난주, 타입 구문을 자바스크립트에 도입하는 0단계 제안을 발표했습니다. 제안하게 된 배경이 무엇이었는지, 어떤 방식으로 타입이 도입될 것을 제안했는지, 또 앞으로 어떤 것들을 계획하고 있는지 등을 이 글에서 확인하실 수 있습니다 :)
4.[번역] SvelteKit으로 포트폴리오 웹사이트 구축하며 2022년의 SvelteKit 톺아보기
SvelteKit를 이용해 포트폴리오 웹사이트를 구축하는 튜토리얼입니다. 아직 포트폴리오 웹사이트가 없으시다면 이번 기회에 사이트도 만들고 SvelteKit도 배워보시는 건 어떠신가요? :)
5.[번역] 리액트는 언제 컴포넌트를 렌더링 하나요?
정확히 언제 그리고 왜 리액트는 컴포넌트를 렌더링 하는 것일까요? 이 글에서는 리액트 커뮤니티에서 가장 자주 묻는 질문 중 하나인 "리액트는 언제 또는 왜 컴포넌트를 렌더링 하나요?"에 대해 조금의 리액트 소스 코드를 사용하여 답하고 있습니다.
6.[번역] 입문자를 위한 Axios vs Fetch
Axios와 Fetch API에 대해 소개하고 비교하는 글입니다. 제목에서도 알 수 있듯이 설치방법 부터 간단한 성능 비교까지 기본적인 내용들을 다루고 있습니다.
7.[번역] 프런트엔드 웹 퍼포먼스: 필수 요소(1)
웹 퍼포먼스는 좋은 사용자 경험을 제공하는 데에 중요한 부분을 차지합니다. 이 글에서는 메인 스레드에서, 또 메인 스레드 밖에서 메인 스레드가 최대한 빠르게 실행될 수 있도록 하는 방법을 알아봅니다.
8.[번역] 리액트로 점진적 이미지 로딩 구현하기: 튜토리얼
이미지 로딩 경험을 긍정적으로 바꿀 수 있는 점진적 로딩에 대한 글입니다. 점진적 로딩이 무엇인지, 또 리액트로 어떻게 구현할 수 있는지 안내합니다 :)
9.[번역] useEvent 리액트 훅이란 (또 무엇이 아닌지)
useEvent RFC가 발표되었습니다. 아직 RFC이기 때문에 실제 적용될지 여부는 확정된 것이 없지만, 그동안 useEffect, useCallback만 으로 쉽게 해결할 수 없었던 pain point를 해결해 줄 것으로 보여집니다 :)
10.[번역] Remix는 무엇이고 Next.js와 어떻게 다른가요?
SSR 자바스크립트 프로젝트를 만드는 프레임워크인 Remix에 대한 글입니다. Remix의 주요 기능과 개념을 살펴보고 Next.js와의 유사점과 차이점을 확인할 수 있습니다:)
11.[번역] Record & Tuple: 불변성을 가지는 자바스크립트의 자료구조
TC39의 stage2 프로세스를 진행중에 있는 ECMAScript의 새로운 데이터 구조인 Record와 Tuple에 대한 이야기입니다. Record와 Tuple이 무엇인지, Object와 어떻게 다른지, 언제 사용 가능한지 등에 대한 내용을 담고 있습니다:)
12.[번역] 자바스크립트 모듈에서 default export는 끔찍합니다
자바스크립트 모듈에서 왜 default export가 좋지 않고 더 안좋은 개발자 경험으로 이어질 수 있는지 설명하고 있는 짧지만 재미있는 글입니다 :)
13.[번역] 리액트, 널 사랑하지만 넌 나를 슬프게 해
리액트에 느끼는 아쉬운 점들을 꽤 적나라하게, 하지만 또 재미있게 풀어낸 글입니다. 아쉬운 점을 나열했지만 제목처럼 리액트에 대한 애정이 담겨 있습니다 :) 원문의 마지막에 링크되어 있는 리액트가 보낸 답신까지 같이 확인해보세요!
14.[번역] 쿼리 캐시에 데이터 채워 넣기 (React Query)
React Query에서 데이터를 빠르게 페칭하고 캐싱하는 방법을 설명한 짧은 글입니다. 원문의 블로그에서 게재하고 있는 React Query 시리즈 중 하나로, 좋은 내용이 많으니 다른 글들도 함께 참고해보시면 좋을 것 같아요:)
15.[번역] 현실 세계 프런트엔드에서 사용되는 자바스크립트 자료구조: 리액트 코드 예시와 함께
프런트엔드 자바스크립트 개발자로서 자료구조 공부는 필요한가요? 프런트엔드를 개발하며 얼마나 자료구조를 사용하고 계신가요? 이 글에서는 실무에서 사용할 수 있는 예시를 통해 프런트엔드에서 사용되는 자바스크립트 자료구조에 대해 이야기하고 있습니다:)
16.[번역] useState 지옥에서 벗어나기
리액트 컴포넌트를 작성하다보면 하나의 컴포넌트 안에 여러개의 useState를 사용하게 되는 경우를 종종 마주치는데요, 이 글에서는 useReducer를 사용하여 그러한 “useState 지옥” 으로부터 벗어나는 방법을 설명하고 있습니다.
17.[번역] 잘 알려진 UI 패턴을 사용하여 리액트 애플리케이션 모듈화하기
기존에 잘 알려진 UI 패턴을 프런트엔드 개발에 적용하는 과정을 적은 글입니다. 리팩토링하는 과정을 단계별로 쫓아가며 UI 패턴을 실제 리액트 사례에 적용하는 방법을 살펴보고 그 이점을 확인할 수 있습니다 :)
18.[번역] Jotai에 React Query가 필요하지 않을 수도 있습니다
Jotai를 만든 Daishi Kato의 글로 Jotai를 위한 데이터 페칭 API는 무엇일지 찾아가는 여정을 담고 있습니다.