본문 바로가기
728x90

tailwindcss2

[StudySync 프로젝트] Vue 3 + TypeScript + Tailwind CSS로 StudySync 프론트엔드 설정 2025년 4월 18일StudySync 프로젝트는 AI 기반 학습 플래너 웹 앱이다. Vue 3, TypeScript, Tailwind CSS로 프론트엔드를 설정하고, Spring Boot, JPA, MySQL로 백엔드를 구현한다. 오늘은 프론트엔드 초기 설정(Vite, Tailwind CSS, ESLint, Prettier)을 완료했다. IntelliJ와 GitHub 저장소(study_sync)를 사용해 진행한 과정을 기록한다.프로젝트 개요StudySync는 학습 목표를 설정하면 AI(ChatGPT API)가 맞춤형 계획을 생성하는 앱이다. 주요 기능은 다음과 같다:사용자 인증(JWT 기반)AI 기반 학습 계획실시간 퀴즈, 커뮤니티 피드반응형 UI, PWA프론트엔드는 Vue 3, TypeScript, .. 2025. 4. 19.
🚀 Vite + React + TypeScript + Tailwind CSS로 포트폴리오 웹앱 개발 환경 구축하기 AutoSume 프로젝트는 자기소개서를 빠르게 작성하고 관리할 수 있는 개인용 웹 애플리케이션이다.이번 글에서는 Vite 기반으로 React + TypeScript + Tailwind CSS 개발 환경을 구성하고, React Router로 기본 라우팅 구조를 잡는 것까지 진행한 과정을 정리한다.🧱 사용 기술 스택 개요기술설명Vite빠른 빌드 속도를 제공하는 차세대 프론트엔드 빌드 도구이다.React컴포넌트 기반 UI 라이브러리로, 사용자 인터페이스를 효율적으로 구성할 수 있다.TypeScript자바스크립트에 타입 시스템을 추가한 언어로, 안정적인 코드 작성에 도움을 준다.Tailwind CSS유틸리티 기반의 CSS 프레임워크로, 클래스 조합으로 빠르게 UI를 구성할 수 있다.React RouterSPA.. 2025. 4. 11.
728x90