feat(01-01): React + Vite + Tailwind v4 SPA scaffold con API client
- Vite react-ts project con base: '/postgenerator/' (Pitfall #9 risolto) - Tailwind v4 via @tailwindcss/vite plugin + @import "tailwindcss" in index.css - react-router-dom con BrowserRouter basename="/postgenerator" - @tanstack/react-query con QueryClientProvider - lucide-react installato per icone - src/api/client.ts: API_BASE='/postgenerator/api', apiFetch<T> con error handling - Dev proxy: /postgenerator/api -> http://localhost:8000 (strip /postgenerator) - App.tsx: HomePage placeholder "Setup completo", struttura Routes pronta - Build Vite: 253.90kB JS + 5.53kB CSS, nessun errore TypeScript
This commit is contained in:
37
frontend/src/App.tsx
Normal file
37
frontend/src/App.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
|
||||
import { BrowserRouter, Route, Routes } from 'react-router-dom'
|
||||
|
||||
const queryClient = new QueryClient({
|
||||
defaultOptions: {
|
||||
queries: {
|
||||
retry: 1,
|
||||
staleTime: 30_000,
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
function HomePage() {
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-950 text-gray-100 flex items-center justify-center">
|
||||
<div className="text-center space-y-4">
|
||||
<h1 className="text-4xl font-bold tracking-tight">PostGenerator</h1>
|
||||
<p className="text-gray-400 text-lg">Setup completo — pronto per la business logic.</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<QueryClientProvider client={queryClient}>
|
||||
{/* basename must match the nginx subpath and Vite base config */}
|
||||
<BrowserRouter basename="/postgenerator">
|
||||
<Routes>
|
||||
<Route path="/" element={<HomePage />} />
|
||||
</Routes>
|
||||
</BrowserRouter>
|
||||
</QueryClientProvider>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
||||
Reference in New Issue
Block a user