ViTE(2)
-
Spring WebFlux를 이용한 chat 프로그램 - Dynamic Route 설정
기본 Vite에서 라우팅 하는 방법은 다음과 같다.import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';import Signup from './pages/Signup.jsx';import Login from './pages/Login';import "./App.css"function App() { return ( } /> } /> );}모든 페이지를 Import 하고 일일이 Route를 입력해 주는 방식이다.근데 처음 Vite를 접한 나에게는 이게 너무 비효율 적으로 보인다.그래서 ChatGPT에 문의를 했서 다음과 같이 처리 했다.아~!!! 그전에 먼저 프론트엔..
2025.05.03 -
Spring WebFlux를 이용한 chat 프로그램 - 프론트엔드 환경 구성
이제 프론트엔드를 구성해 보려 한다.프로젝트 생성프로젝트폴더 > npm create vite@latest chat-client --template reactSelect a framework : > ReactSelect a variant: > JavaScript프로젝트폴더 > cd chat-client프로젝트폴더\chat-client > npm install TailwindCSS 설치최근에 TailwindCSS가 버전업을 해서 현재 Beta 버전 4.1이 나왔다. 그래서 Beta지만 사용해보기로 했다.ChatGPT는 설치 방법을 계속 3 버전으로 알려줘서 TailwindCSS 사이트를 들어가 참고했다.https://tailwindcss.com/docs/installation/using-vite Instal..
2025.05.01