CreatioNeX A frontend development project for student-led organisation webpages. It provides organizations with an online presence that improves community engagement, event promotion and overall visibility.
- Frontend Framework : Vite + React.js (v18+)
- Styling : Tailwind CSS V4
- Routing : React Router DOM
- Icons : Lucide React
- Carousel/Slider : Swiper.js
- Development Tools : ESLint, Prettier
- Build Tool : Vite for fast development and optimized builds
{
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-router-dom": "^6.0.0",
"tailwindcss": "^4.0.0",
"lucide-react": "latest",
"swiper": "latest"
}- Node.js (v18+ recommended)
- npm or yarn
- Git
# Clone the repository
git clone https://github.com/Samhrld-collab/creationex.dev.git
# Navigate to project directory
cd creationex.dev
# Install dependencies
npm install
# Start development server
npm run dev# Development server
npm run dev
# Build for production
npm run build
# Preview production build
npm run preview
# Lint code
npm run lint
# Format code
npm run formatWe welcome contributions to improve this project. Contribution Guidelines Here.
- Homepage - Dynamic hero section with event sliders and community overview.
- About - Mission, vision, values and embedded promotional video.
- Events - Event listing with filtering, sorting and dynamic status management.
- Event Details - Individual event pages with detailed information and registration.
- RSVP - Interactive event registration form with validation.
- Initiatives - Community programs and projects showcase.
- Team - Leadership and advisory board member profiles.
- Store - E-commerce functionality with shopping cart and product management.
- Contact - Contact form, business information and embedded Google Maps.
- Responsive Design - Mobile-first approach with Tailwind CSS.
- Interactive Elements - Event registration, shopping cart, contact forms.
- Multimedia Integration - Images, video content and interactive maps.
- Performance Optimized - Lazy loading, code splitting and image optimization.
- Code Splitting: Component-level splitting for faster initial load
- Lazy Loading: Images load as they enter viewport
- Image Optimization: Responsive images with multiple size variants
- Bundle Optimization: Tree shaking and minification
- CSS Optimization: Tailwind CSS purging for smaller bundle size
Project Lead & Original Author:
Contributors:
- See GitHub's contributors graph for the full list of collaborators
Special Acknowledgement:
- Course Instructor: Mr. Nazmirul Izzad Bin Nassir
- City University Malaysia - Faculty of Information Technology
This project is licensed under the MIT License - see the LICENSE file for details.