React 테스트 코드 자동화

1. 개요 이전 글에서는 테스트 코드를 작성해 Unit단위의 테스트를 진행하고, 확인하는 과정을 거쳤습니다. 하지만 만들어두고 활용하지 않으면 의미가 없죠. 아무래도 매 작업마다 테스트를 실행하기 위해 명령어를 치고 결과를 확인하는 것은 번거롭고 귀찮기 때문입니다. 저는 개발 브랜치에 PR을 요청 했을때 자동으...

React 테스트 코드

1. 개요 현대 웹 개발 환경은 매우 복잡해졌고, 개발자들은 애플리케이션의 품질을 보장하는데 많은 시간을 투자하고 있습니다. 특히, 프런트엔드 개발에서는 사용자 경험을 최적화하는 것이 중요한데, 이를 달성하기 위해선 코드의 품질과 안정성이 보장되어야 합니다. React를 처음 설치하기 위해 create-react...

react-query를 통한 프로젝트 개선기

1. 개요 현재 프로젝트에서는 컴포넌트에서 직접 api를 호출해서 데이터를 받아오거나 요청을 처리하고 있습니다. 다만 위 방식의 경우 중복된 요청과 캐싱 등의 성능 이슈가 발생하며, 코드의 복잡성과 유지 보수에 어려움을 겪는등의 문제점이 있었습니다. 이러한 성능적 이슈와 서버의 데이터관리를 보다 용이하게 처리하...

axios와 fetch

1. 개요 React에서는 api를 요청할때 일반적으로 axios와 fecth방법을 사용합니다. 저같은 경우 큰 이유 없이 axios만 사용해왔지만 이 글에서는 axios와 fetch를 소개하고, 두 방법의 특징과 장단점을 비교하여 어떤 상황에서 어떤 것을 선택해야 하는지 정리해보고자 합니다 동시에 axios의...

Lottie를 활용한 애니메이션 추가

1.Lottie란? Lottie는 Airbnb에서 개발한 오픈소스 라이브러리로, 벡터 애니메이션을 간편하게 추가할 수 있는 도구입니다. JSON 형식으로 저장된 애니메이션 데이터를 불러와 웹, iOS, Android 등 다양한 플랫폼에서 높은 품질의 애니메이션을 구현할 수 있습니다. Lottie는 2017년에 ...