Skip to content

Swastik092/DevNest

Repository files navigation

DevNest - Premium Web Design & Development Agency

A modern, high-end freelancing agency website built with Next.js, TypeScript, Tailwind CSS, and Framer Motion.

🚀 Features

  • Modern Design: Premium, luxury-inspired UI with glassmorphism effects
  • Dark Mode: Full light & dark mode support with smooth transitions
  • Animations: Smooth scroll-based animations, micro-interactions, and parallax effects
  • Responsive: Fully responsive across all devices
  • Performance: Optimized for fast loading and smooth interactions
  • Accessibility: Clean navigation and accessibility-friendly

🛠️ Tech Stack

  • Next.js 14 - React framework
  • TypeScript - Type safety
  • Tailwind CSS - Styling
  • Framer Motion - Animations
  • next-themes - Dark mode support
  • Lucide React - Icons

📦 Installation

  1. Install dependencies:
npm install
  1. Run the development server:
npm run dev
  1. Open http://localhost:3000 in your browser

🏗️ Build

To create a production build:

npm run build
npm start

📁 Project Structure

DevNest/
├── app/
│   ├── globals.css
│   ├── layout.tsx
│   └── page.tsx
├── components/
│   ├── sections/
│   │   ├── Hero.tsx
│   │   ├── Services.tsx
│   │   ├── IndustrySolutions.tsx
│   │   ├── WhyDevNest.tsx
│   │   ├── Portfolio.tsx
│   │   ├── Process.tsx
│   │   ├── Testimonials.tsx
│   │   ├── CTA.tsx
│   │   └── Contact.tsx
│   ├── Logo.tsx
│   ├── Navigation.tsx
│   ├── Footer.tsx
│   └── ThemeProvider.tsx
└── package.json

🎨 Sections

  1. Hero - Eye-catching hero section with animated background and CTAs
  2. Services - Interactive service cards with hover animations
  3. Industry Solutions - Tab-based industry-specific solutions
  4. Why DevNest - Feature highlights with icons and animations
  5. Portfolio - Project showcase with filterable grid and modal
  6. Process - Animated timeline showing our workflow
  7. Testimonials - Auto-sliding testimonial cards
  8. CTA - Bold call-to-action section
  9. Contact - Premium enquiry form with success animation

🎯 Customization

  • Update colors in tailwind.config.ts
  • Modify content in respective component files
  • Add/remove sections in app/page.tsx
  • Customize animations in component files using Framer Motion

📝 License

This project is open source and available under the MIT License.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors