기본 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에 문의를 했서 다음과 같이 처리 했다.아~!!! 그전에 먼저 프론트엔..

이제 프론트엔드를 구성해 보려 한다.프로젝트 생성프로젝트폴더 > 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..

Back-end 설정은 아래 내용을 참조하면 된다.https://kamsi76.tistory.com/entry/Spring-Security-Back-End-%EC%84%A4%EC%A0%95With-JWT Frontend는 React + typescript + nextjs 와 axios를 사용하였다.사전 준비프로젝트 생성# nextjs 설치D:\project\src\main> npm install -g create-next-app# 버전확인D:\project\src\main> create-next-app --version15.1.0# 프로젝트 생성D:\project\src\main> npx create-next-app frontend√ Would you like to use TypeScript? ... Y..

개발 환경Java 23, Spring Boot 3Spring Security 6Sprint + React + typescriptSpring Boot : 3.3.5Eclipse 환경 설정1. eclipse downloadhttps://www.eclipse.org/downloads/ Eclipse Downloads | The Eclipse FoundationThe Eclipse Foundation - home to a global community, the Eclipse IDE, Jakarta EE and over 415 open source projects, including runtimes, tools and frameworks.www.eclipse.org현 시점에 Eclipse 버전 : Eclipse ..