auth-app

Sliding login / sign-up UI built with Vite 6 + React 19 + Tailwind CSS.
Includes the React Compiler (babel-plugin-react-compiler) and protected routes.

Stack

Tool	Version
Vite	^6
React	^19
React Router	^7
Tailwind CSS	^3
React Compiler	babel-plugin-react-compiler ^19

Project Structure

src/
├── main.jsx                  # Entry point
├── App.jsx                   # Router & route definitions
├── index.css                 # Tailwind + auth animation CSS
│
├── context/
│   └── AuthContext.jsx       # Auth state (login / signup / logout)
│
├── routes/
│   ├── ProtectedRoute.jsx    # Blocks unauthenticated users → /auth
│   └── GuestRoute.jsx        # Blocks logged-in users → /dashboard
│
├── pages/
│   ├── AuthPage.jsx          # Public login/signup page
│   └── DashboardPage.jsx     # Protected dashboard
│
└── components/
    └── auth/
        ├── AuthContainer.jsx # Manages sign-in / sign-up state
        ├── SignInForm.jsx     # Sign-in form
        ├── SignUpForm.jsx     # Sign-up form
        └── OverlayPanels.jsx # Sliding gradient overlay panels

Getting Started

npm install
npm run dev

Routes

Path	Access	Description
/	Public	Redirects to /auth
/auth	Guest only	Sliding login/signup card
/dashboard	🔒 Auth only	Protected dashboard
*	Public	Redirects to /auth

Connecting a Real API

Replace the login() and signup() stubs in src/context/AuthContext.jsx with your actual API calls (fetch / axios / React Query, etc.).