Tailwind CSS의 다크모드 기능과 React Context API를 활용하여 애플리케이션 전체에서 일관된 다크모드 전환 기능을 구현했다.Tailwind 설정tailwind.config.ts에서 다크모드를 클래스 기반으로 설정했다.darkMode: "class", // .dark 클래스 존재 여부에 따라 다크모드 활성화theme: { extend: { colors: { // 색상 스키마 }, },},이를 통해 HTML 요소에 .dark 클래스가 추가되면 다크모드 스타일이 적용되도록 했다. 다크모드 상태 관리ThemeContext 생성Context API를 사용해 다크모드 상태를 전역으로 관리했다.const ThemeContext = createContext({ isDark..

이전에 만들었던 리액트 프로젝트 Emotion Diary를 마이그레이션하면서, 기존에 자바스크립트로 작성된 공용 컴포넌트들을 타입스크립트로 재작성했다. 기존 프로젝트에서 이미 Button과 Header 같은 재사용 가능한 컴포넌트를 구현해두었지만, 타입 안정성이 부족했다. 타입스크립트를 도입하면서 props의 타입을 명확히 정의하고, 컴파일 타임에 오류를 잡을 수 있도록 개선했다.Button 컴포넌트props 타입 정의text, type, onClick 세 가지 props의 타입을 명시적으로 정의했다.type ButtonProps = { text: string; type: "DEFAULT" | "POSITIVE" | "NEGATIVE"; onClick: () => void;};export defau..