Zenity.io Website Clone

A complete clone of the Zenity.io website built with modern web technologies. This project replicates the design, layout, and functionality of the original Zenity website, showcasing expertise in web development and attention to detail.

🚀 Tech Stack

• Next.js 15 - React framework with App Router
• TypeScript - Type-safe JavaScript
• Tailwind CSS - Utility-first CSS framework
• shadcn/ui - Beautiful and accessible React components
• Radix UI - Headless UI primitives for accessibility
• Lucide React - Modern icon library
• Bun - Fast JavaScript runtime and package manager

📋 Features

• Responsive Design - Fully responsive across all device sizes
• Modern UI Components - Built with shadcn/ui and Radix UI
• TypeScript Support - Full type safety throughout the application
• Optimized Performance - Built with Next.js 15 and modern web standards
• Accessible - WCAG compliant components and proper semantic HTML
• SEO Ready - Optimized for search engines

🎯 Components Included

• Header with navigation menu
• Hero section with call-to-action
• Problems section highlighting pain points
• Platform overview section
• Features showcase
• Customer testimonials
• Zenity Labs section
• Expert validation section
• Blog highlights
• Footer with links and information
• Webinar banner

🛠️ Getting Started

1. Clone the repository

   git clone https://github.com/[username]/zenity-clone.git
   cd zenity-clone

2. Install dependencies

   bun install

3. Run the development server

   bun dev

4. Open your browser Navigate to http://localhost:3000 to see the application.

📁 Project Structure

zenity-clone/
├── src/
│   ├── app/
│   │   ├── globals.css
│   │   ├── layout.tsx
│   │   ├── page.tsx
│   │   └── ClientBody.tsx
│   ├── components/
│   │   ├── ui/          # shadcn/ui components
│   │   ├── Header.tsx
│   │   ├── HeroSection.tsx
│   │   ├── ProblemsSection.tsx
│   │   ├── PlatformSection.tsx
│   │   ├── FeaturesSection.tsx
│   │   ├── TestimonialsSection.tsx
│   │   ├── ZenityLabsSection.tsx
│   │   ├── ExpertValidationSection.tsx
│   │   ├── BlogsSection.tsx
│   │   ├── FinalCTASection.tsx
│   │   ├── Footer.tsx
│   │   └── WebinarBanner.tsx
│   └── lib/
│       └── utils.ts
├── tailwind.config.ts
├── next.config.js
├── tsconfig.json
└── package.json

🔧 Development Scripts

• bun dev - Start development server with Turbopack
• bun build - Build the application for production
• bun start - Start the production server
• bun lint - Run Biome linter and TypeScript checks
• bun format - Format code with Biome

🚢 Deployment

This project is configured for easy deployment on:

• Vercel - Zero-config deployment with Git integration
• Netlify - Includes netlify.toml configuration
• Any Node.js hosting - Standard Next.js deployment

📝 Code Quality

• ESLint - JavaScript/TypeScript linting
• Biome - Fast formatter and linter
• TypeScript - Strict type checking enabled
• Prettier integration - Consistent code formatting

🤝 Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

📄 License

This project is for educational and demonstration purposes. All design credits go to the original Zenity.io website.

🎨 Design Credits

Original design and content belong to Zenity.io. This clone is created for educational purposes to demonstrate web development skills.