Modern, Fast, and Accessible Web Experience
)
🌟 Live Demo • 📚 Documentation • 🐛 Report Bug • ✨ Request Feature
Click to expand
Zenyukti Website is a modern, responsive web application built with cutting-edge technologies to deliver exceptional user experiences. Our mission is to provide a fast, accessible, and visually appealing platform that serves our community's needs.
- 📱 Fully Responsive - Seamless experience across all devices and screen sizes
- ⚡ Lightning Fast - Optimized performance with <3s load times
- 🔍 SEO Optimized - Built-in SEO best practices
- 🎨 Modern Design - Clean, intuitive user interface
- 🌙 Dark Mode Support - Toggle between light and dark themes (Coming Soon)
- 🔧 Developer Friendly - Well-documented codebase with modern tooling
- 🚀 CI/CD Pipeline - Automated testing and deployment (Coming Soon)
- 🔍 Detailed Info - Visit Wiki pages Home Page - wiki | ZenYukti
| Layer | Technology | Purpose |
|---|---|---|
| Frontend | HTML5, CSS3, JavaScript ES6+ | Core web technologies |
| Build Tool | Vite | Fast build tool and dev server |
| Package Manager | npm | Dependency management |
| Version Control | Git | Source code management |
| Hosting | GitHub Pages | Static site hosting |
| CI/CD | GitHub Actions | Automated workflows |
Follow these steps to get a local copy up and running.
Before you begin, ensure you have the following installed:
# Node.js (LTS version recommended)
node --version # Should be v16.0.0 or higher
# npm (comes with Node.js)
npm --version # Should be v7.0.0 or higher
# Git
git --version # Any recent version-
Clone the repository
git clone https://github.com/ZenYukti/zenyukti.github.io.git cd zenyukti.github.io -
Install dependencies
npm install
-
Create environment file (if needed)
cp .env.example .env # Edit .env with your configuration
-
Start the development server
npm run dev
-
Open your browser
Visit
http://localhost:5173(or the URL shown in your terminal) -
Start coding!
The app will automatically reload when you make changes.
-
Want to contribute?
Please refer to our Contributing Guide for detailed information on our development workflow, branch strategy, and how to submit pull requests.
The website is designed to be intuitive and user-friendly. Simply navigate to the live site to explore all features.
IMPORTANT: We use a
devbranch for development. Please see our Branch Strategy document for details on our branching model.
# Start development server
npm run dev
# Run linting
npm run lint
# Format code
npm run format
# Build for production
npm run build
# Preview production build
npm run previewwebsite/
├── 📁 .github/ # GitHub configuration
│ └── 📄 PULL_REQUEST_TEMPLATE.md # PR template
├── 📁 public/ # Public assets served as-is
│ ├── 📁 assets/ # Static assets
│ │ ├── � favicons/ # Favicon files
│ │ ├── 📁 profile/ # Team member profile images
│ │ └── � teamImages/ # Team photos
│ ├── 📄 events.json # Events data
│ ├── � favicon.ico # Main favicon
│ ├── 📄 robots.txt # Robots crawl instructions
│ └── 📄 sitemap.xml # Site map for SEO
├── 📁 src/ # Source code
│ ├── 📁 assets/ # Application assets
│ │ └── � teamdata/ # Team data files
│ ├── 📁 components/ # Reusable React components
│ │ ├── 📁 ui/ # UI components
│ │ ├── 📄 DomainsPreview.tsx # Domain preview component
│ │ ├── � EventCard.tsx # Event card component
│ │ ├── 📄 Footer.tsx # Footer component
│ │ ├── 📄 Header.tsx # Header component
│ │ ├── 📄 Hero.tsx # Hero section component
│ │ ├── � icons.ts # Icon components
│ │ ├── 📄 Purpose.tsx # Purpose section component
│ │ ├── 📄 ScrollToHash.tsx # Scroll to hash helper
│ │ └── 📄 ScrollToTop.tsx # Scroll to top component
│ ├── 📁 hooks/ # Custom React hooks
│ │ ├── 📄 use-mobile.tsx # Mobile detection hook
│ │ └── 📄 use-toast.ts # Toast notification hook
│ ├── 📁 lib/ # Utility libraries
│ │ └── 📄 utils.ts # Utility functions
│ ├── 📁 media/ # Media files
│ ├── 📁 pages/ # Page components
│ │ ├── 📄 About.tsx # About page
│ │ ├── 📄 CodeOfConduct.tsx # Code of conduct page
│ │ ├── 📄 Community.tsx # Community page
│ │ ├── 📄 Contact.tsx # Contact page
│ │ ├── 📄 Index.tsx # Home page
│ │ ├── 📄 Join-us.tsx # Join us page
│ │ ├── 📄 NotFound.tsx # 404 page
│ │ ├── 📄 Privacy.tsx # Privacy policy page
│ │ ├── 📄 Projects.tsx # Projects page
│ │ ├── 📄 Team.tsx # Team page
│ │ └── 📄 TermsOfService.tsx # Terms of service page
│ ├── 📄 App.css # Main application styles
│ ├── 📄 App.tsx # Root React component
│ ├── 📄 index.css # Global styles
│ └── 📄 main.tsx # Application entry point
├── 📄 .gitignore # Git ignore patterns
├── 📄 BRANCH_STRATEGY.md # Branch strategy documentation
├── 📄 components.json # shadcn/ui component configuration
├── 📄 CONTRIBUTING.md # Contributing guidelines
├── 📄 eslint.config.js # ESLint configuration
├── 📄 index.html # HTML template
├── 📄 LICENSE # License information
├── 📄 package-lock.json # Locked dependency versions
├── 📄 package.json # Project configuration & dependencies
├── 📄 postcss.config.js # PostCSS configuration
├── 📄 README.md # Project documentation (this file)
├── 📄 tailwind.config.ts # Tailwind CSS configuration
├── 📄 tsconfig.app.json # TypeScript config for app
├── 📄 tsconfig.json # Main TypeScript configuration
├── 📄 tsconfig.node.json # TypeScript config for Node.js
├── 📄 vercel.json # Vercel deployment configuration
└── 📄 vite.config.ts # Vite build tool configuration
| Command | Description | Usage |
|---|---|---|
npm run dev |
Start development server | Development |
npm run build |
Build for production | Deployment |
npm run preview |
Preview production build | Testing |
npm run lint |
Run ESLint | Code quality |
npm run lint:fix |
Fix ESLint issues | Code quality |
npm run format |
Format with Prettier | Code style |
npm test |
Run test suite | Testing |
npm run test:watch |
Run tests in watch mode | Development |
npm run deploy |
Deploy to GitHub Pages | Deployment |
See the open issues for a full list of proposed features and known issues.
- Progressive Web App - PWA capabilities
- Advanced Community Features - Enhanced community engagement tools
- Event Management System - Improved event handling and registration
- Member Dashboard - Personalized dashboard for community members
- Project Showcase Expansion - Enhanced project portfolio display
- Responsive Design - Mobile-first approach
- SEO Optimization - Search engine optimization
- Community Portal - Dedicated community pages
- Events Integration - Community events display
We love contributions! Please read our Contributing Guide to learn about our development process, how to propose bugfixes and improvements.
- Fork the repo
- Create your feature branch from the
devbranch (git checkout -b feature/AmazingFeature upstream/dev) - Make your changes
- Run tests (
npm test) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request targeting the
devbranch
IMPORTANT: All pull requests must target the
devbranch, not themainbranch. We usedevfor development and integration before merging tomainfor production.
- Follow the existing code style
- Write meaningful commit messages
- Add tests for new features
- Update documentation as needed
- Ensure CI/CD pipeline passes
This project and everyone participating in it is governed by our Code of Conduct. By participating, you are expected to uphold this code.
We maintain high code quality through comprehensive testing.
# Run all tests
npm test
# Run tests in watch mode
npm run test:watch
# Run tests with coverage
npm run test:coverage
# Run end-to-end tests
npm run test:e2e- Unit Tests - Individual component testing
- Integration Tests - Feature testing
- End-to-End Tests - Full user journey testing
- Performance Tests - Load and performance testing
The project is automatically deployed to GitHub Pages when changes are pushed to the main branch.
We use a dev branch for development and integration. All feature work and pull requests should target this branch. After thorough testing, changes from dev are merged into main for production deployment.
# Build the project
npm run build
# Deploy to GitHub Pages
npm run deploy| Variable | Description | Default |
|---|---|---|
NODE_ENV |
Environment mode | development |
VITE_APP_TITLE |
App title | Zenyukti |
VITE_API_URL |
API endpoint | undefined |
| Metric | Desktop | Mobile |
|---|---|---|
| Performance | 98 | 95 |
| Accessibility | 100 | 100 |
| Best Practices | 100 | 95 |
| SEO | 100 | 100 |
Lighthouse scores (out of 100)
- Code Splitting - Lazy loading of components
- Image Optimization - WebP format with fallbacks
- Bundle Analysis - Regular bundle size monitoring
- Caching Strategy - Aggressive caching for static assets
- CDN Usage - Fast content delivery
| Browser | Version | Support |
|---|---|---|
| Chrome | 90+ | ✅ Full |
| Firefox | 88+ | ✅ Full |
| Safari | 14+ | ✅ Full |
| Edge | 90+ | ✅ Full |
| Opera | 76+ | ✅ Full |
Distributed under the MIT License. See LICENSE for more information.
Meet the amazing people who contribute to this project:
Want to be on this list? Check out our Contributing Guide to get started!
Special Thanks To:
- 💡 The open-source community for inspiration and resources
- 🛠️ Vite team for the amazing build tool
- 🎨 GitHub for hosting and CI/CD capabilities
- 📚 MDN Web Docs for comprehensive documentation
Made with ❤️ by the Zenyukti Team
⭐ Star this repository if you find it helpful!
