A modern, interactive website showcasing Project Vyoma - an aerospace engineering student project from RV College of Engineering, founded in 2007. The website features stunning animations, scroll-based interactions, and a comprehensive showcase of the team's achievements, projects, and history.
Project Vyoma is the aero-design team of RV College of Engineering, established in 2007. We are one of the leading student projects in India, having won numerous national and international competitions and awards, including the prestigious NASA Systems Engineering Award in 2013.
- 🏆 NASA Systems Engineering Award (2013) - Best among 75 teams worldwide
- 🎯 18+ Years of aerospace excellence
✈️ 25+ Aircraft built and flown- 🏅 20+ Awards won in competitions
- 🌍 First Indian team to fly at AIAA DBF (2015)
- 📊 Top 20 at Boeing IIT National Aeromodelling Competition (2023)
- Interactive Homepage: Scroll-based parallax animation with frame-by-frame aircraft visualization
- Modern UI/UX: Beautiful, responsive design with smooth animations and transitions
- Project Showcase: Detailed pages for RC Airplanes, VTOL systems, and RC Launcher projects
- Team & Achievements: Comprehensive timeline and history of the project
- Gallery: Visual showcase of aircraft, competitions, and events
- Contact Form: Simple integrated form for inquiries
- Sponsors & Sponsorship: Information about sponsors and sponsorship opportunities
- Performance Optimized: Built with Next.js 15 for optimal performance and SEO
- Next.js 15.5.10 - React framework with App Router
- React 19.2.1 - UI library
- TypeScript 5 - Type safety
- Tailwind CSS - Utility-first CSS framework
- Radix UI - Accessible component primitives
- Lucide React - Icon library
- Tabler Icons - Additional icon set
- GSAP - Animation library
- Motion - Motion library for React
- Lenis - Smooth scrolling
- Embla Carousel - Carousel component
- Cloudflare Workers (via @opennextjs/cloudflare) - Deployment platform
- Genkit - AI development tools
- Wrangler - Cloudflare Workers CLI
- ESLint - Code linting
Before you begin, ensure you have the following installed:
- Node.js 18.x or higher
- npm or yarn package manager
- Git for version control
git clone <repository-url>
cd vyoma-websitenpm install
# or
yarn installCreate a .env.local file in the root directory if you need to add any custom environment variables.
npm run dev
# or
yarn devThe website will be available at http://localhost:9002
npm run dev- Start development server with Turbopack on port 9002npm run build- Standard Next.js production buildnpm run build:cloudflare- Build the app using the@opennextjs/cloudflareadapternpm run preview- Build and preview locally on the Cloudflare Workers runtimenpm run deploy- Build and deploy to Cloudflare Workers using OpenNextnpm run upload- Build and upload a new version to Cloudflare (for gradual deployments)npm run cf-typegen- Generatecloudflare-env.d.tstypes for Wrangler bindingsnpm run start- Start the Next.js production server (Node)npm run lint- Run ESLintnpm run typecheck- Run TypeScript type checkingnpm run genkit:dev- Start Genkit development servernpm run genkit:watch- Start Genkit with watch mode
vyoma-website/
├── src/
│ ├── app/ # Next.js App Router pages
│ │ ├── about/ # About page
│ │ ├── achievements/ # Achievements page
│ │ ├── contact/ # Contact page
│ │ ├── gallery/ # Gallery page
│ │ ├── projects/ # Projects pages
│ │ │ ├── rc-airplanes/ # RC Airplanes project
│ │ │ ├── vtol/ # VTOL project
│ │ │ └── launcher/ # Launcher project
│ │ ├── sponsors/ # Sponsors page
│ │ ├── sponsorship/ # Sponsorship page
│ │ ├── team/ # Team page
│ │ ├── api/ # API routes
│ │ ├── config.ts # App configuration
│ │ ├── globals.css # Global styles
│ │ ├── layout.tsx # Root layout
│ │ └── page.tsx # Homepage
│ ├── components/ # React components
│ │ ├── core/ # Core components
│ │ ├── sections/ # Page sections
│ │ └── ui/ # UI components
│ ├── hooks/ # Custom React hooks
│ └── lib/ # Utility libraries
│ └── utils.ts # Utility functions
├── public/ # Static assets
│ └── images/ # Image assets
├── components.json # shadcn/ui configuration
├── next.config.ts # Next.js configuration
├── tailwind.config.ts # Tailwind CSS configuration
└── package.json # Dependencies
The homepage features a scroll-based parallax animation that displays aircraft frames based on scroll position, creating an immersive experience.
- RC Airplanes: Showcase of radio-controlled model airplanes
- VTOL: Fixed-wing vertical takeoff and landing aircraft
- Launcher: RC airplane launching system
The website uses multiple animation libraries to create smooth, engaging interactions:
- Scroll-triggered animations
- Particle effects
- Custom cursor
- Loading screens
- Smooth scrolling
The project is configured to deploy using the official @opennextjs/cloudflare adapter:
npm run deployThis will:
- Run the standard
next build - Transform the build using
opennextjs-cloudflare build - Deploy the Worker and static assets to Cloudflare via Wrangler
- A Cloudflare account and Workers project
- Wrangler CLI authenticated (
npx wrangler login)
npm run previewThis builds the app and serves it locally using the same runtime as production (Cloudflare Workers).
The application can also be deployed to:
- Vercel (recommended for Next.js)
- Netlify
- Any Node.js hosting platform
Contributions are welcome! Please follow these steps:
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is private and proprietary to Project Vyoma, RV College of Engineering.
For inquiries, sponsorship opportunities, or collaboration, please visit the Contact page on the website.
- RV College of Engineering for continuous support
- All sponsors and supporters
- Team members past and present
- Competition organizers (SAE, AIAA, Boeing, etc.)
Project Vyoma - Pioneering excellence in aerospace engineering since 2007