저는 무엇을 사용할까요?

언어, 소프트웨어, 라이브러리, 프레임워크 등 제가 사용하는 것들과 왜 사용하는지에 대해 작성해 보았습니다.

Languages

  • 자동으로 갱신되는 제 깃허브의 언어 비중입니다.

    github-stats

  • JavaScript

    저는 자바스크립트를 주로 사용하고 있습니다. 현재는 프론트엔드 개발만 진행하고 있으며 node.js는 알고리즘을 푸는 용도로 사용하고 있습니다.

  • TypeScript

    주로 자바스크립트를 사용하지만 타입 검사가 필요한 상황에는 타입스크립트를 사용합니다. 지금은 필요성이 느껴질 때에만 타입스크립트를 사용하지만 추후에 모든 프로젝트를 타입스크립트로 마이그레이션을 진행할 예정입니다.

  • Java

    자바로는 Spring Boot를 사용하여 간단한 CRUD 기능을 구현할 수 있습니다. 자바스크립트를 사용하기 전에는 자바를 사용했으며 간단한 백엔드는 직접 개발할 수 있습니다.

  • etc

    위에 언급한 언어 외에도 다양한 언어를 사용해 보았습니다. 대학생 때에는 주로 C언어를 사용하였으며 현재는 Rust의 철학에도 관심을 가지고 있습니다.

Library & Framework

  • React

    프론트엔드 개발을 위해 리액트를 사용하고 있습니다. 리액트로 프론트엔드 개발을 시작한 이유는 리액트가 가장 인기 있는 라이브러리이며, 커뮤니티가 크고, 문서화가 잘 되어 있기 때문입니다.

  • Vite

    프로젝트 수준에서 특정 리액트 기능, 라이브러리 또는 구성을 강요하지 않는 Vite의 철학을 좋아하기 때문에 간단한 리액트 앱은 Vite를 사용하고 있습니다.

  • Next.js

    SSR, SSG, 라우팅과 같은 기능이나 어느 정도 백엔드의 역할의 필요성이 느껴질 때에는 Next.js를 사용합니다. 주로 Vite보다는 Next.js를 사용하는 상황이 많습니다.

State Management

  • Zustand

    리액트의 상태 관리에는 Redux의 복잡함을 줄이고, Context API의 불편함을 줄이기 위해 Zustand를 사용하고 있습니다.

  • Valtio

    Valtio의 목표인 "makes proxy-state simple" 이라는 문구처럼 Valtio는 정말 쉬운 상태 관리 방법을 제공합니다. 간단한 작업에서는 Valtio를 사용하고 있습니다.

  • TanStack Query

    원격 데이터에 대한 상태 관리에 관해서는 TanStack Query와 같은 데이터 페칭 라이브러리를 사용하고 있지만 아직은 사용할 일이 많지 않았습니다.

CSS

  • Tailwind CSS

    Tailwind CSS의 편리함을 선호합니다. 서버 측 환경과도 원활하게 호환이 되기 때문에 주로 Tailwind CSS를 사용합니다.

  • CSS Module

    프로젝트의 크기가 작을 때에는 CSS Module을 사용합니다.

etc

  • D3.js

    데이터의 시각화가 필요할 때에는 D3.js를 사용합니다. 동적이고 인터렉티브한 데이터 시각화를 구현할 때에는 D3.js를 제일 선호합니다.

  • Three.js

    저는 재미있는 것을 만드는 일을 좋아합니다. 3D 그래픽을 통해 웹을 재밌게 만들어주기 때문에 Three.js를 사용합니다.

Code Style

  • ESLint

    ESLint를 통해 Airbnb의 코드 스타일을 적용하고 있습니다. 결정하기 어려운 스타일은 React와 Next.js의 공식 스타일을 따라가려고 노력합니다.

  • Prettier

    세세한 코드 스타일을 적용하기 위해 Prettier도 사용하고 있습니다. Prettier의 설정은 Next.js의 공식 코드 스타일을 따라가고 있습니다.

Database

  • MySQL

    정석적인 관계형 데이터베이스가 필요할 때에는 MySQL을 사용합니다. 가장 많이 사용되고 가장 무난합니다.

  • Supabase

    서버리스 데이터베이스를 사용하고 싶을 때에는 Supabase를 사용합니다. 데이터베이스와 API를 구축하는 데 필요한 노력을 줄일 수 있고 여러 백엔드 기능도 제공하기 때문에 사용하고 있습니다.

  • Prisma

    서버 사이드에서 데이터베이스와의 연결이 필요할 때에는 Prisma를 사용합니다. Next.js에서도 비슷한 기능을 제공하기 때문에 아직까지 사용할 일이 많지는 않았습니다.

Git

  • Git Flow

    효율적인 브랜치 관리를 위해 Git Flow를 사용하고 있습니다. 제가 함께하게 되는 팀에서도 Git Flow를 도입하려고 노력합니다.

  • GitHub Flow

    크기가 작은 프로젝트에서는 GitHub Flow를 사용하고 있습니다.

  • GitHub

    제가 작성하는 소스는 대부분 GitHub에 업로드하고 있습니다. 배포와 코드 검사도 어느 정도 GitHub에서 진행하고 있습니다.

  • Git Kraken

    Git Kraken을 통해 Git Flow를 사용하고 있습니다. GUI를 통해 Git을 사용하고 싶을 때에는 Git Kraken을 사용합니다.

Design

  • Figma

    디자인을 해야 할 일이 생긴다면 Figma를 사용합니다. Figma의 여러 플러그인들을 통해 효율적으로 개발을 할 수 있는 부분을 좋아합니다.