A next-generation interactive web experience built with cutting-edge web technologies.

FLUX FRONTEND is the central hub for the Technical club Flux of SATI, offering an immersive gateway to our Events, Projects, and Learning Hub. A dynamic Team showcase, and a dedicated Group Chat for members, all while serving as the modern successor to our Old Site.

• 🚀 Blazing Fast: Powered by Vite for instant server start and lightning-fast HMR.
• 🎨 Stunning Visuals: Integrated Three.js and Vanta.js for rich, interactive backgrounds and 3D elements.
• ✨ Smooth Animations: Complex sequences orchestrated with GSAP and Framer Motion.
• 🌊 Fluid Scrolling: Implemented smooth scrolling behavior using Lenis.
• 📱 Fully Responsive: Mobile-first design philosophy using TailwindCSS.
• 🔌 Modern State Management: Utilizes Redux Toolkit for efficient state handling.

This project is built using the following technologies:

• Core: React 19, Vite
• Styling: TailwindCSS, PostCSS
• Animations: GSAP, Framer Motion, Anime.js
• 3D & Graphics: Three.js, React Three Fiber, Spline, Vanta
• Icons: Lucide React, React Icons
• State Management: Redux Toolkit
• Utilities: Lenis (Scroll), Swiper (Carousel)

Follow these steps to set up the project locally.

Ensure you have the following installed:

• Node.js (v16+ recommended)
• npm or yarn

1. Clone the repository

   git clone https://github.com/SAFAL-TIWARI/FLUX-FRONTEND.git
   cd FLUX-FRONTEND

2. Install dependencies

   npm install

3. Start the development server

   npm run dev

   The application will be available at http://localhost:5173 (or the port shown in your terminal).

FLUX-FRONTEND/
├── public/              # Static assets
├── src/
│   ├── assets/          # Images, fonts, and icons
│   ├── components/      # Reusable UI components
│   ├── pages/           # Application route pages
│   ├── store/           # Redux store configuration
│   ├── App.jsx          # Main application component
│   └── main.jsx         # Entry point
├── index.html           # HTML template
├── package.json         # Dependencies and scripts
├── tailwind.config.js   # Tailwind configuration
└── vite.config.js       # Vite configuration

• npm run dev: Starts the development server.
• npm run build: Builds the app for production.
• npm run lint: Runs ESLint to check for code quality issues.
• npm run preview: Locally previews the production build.

Made with ❤️ by the Flux Team