Skip to content

codewithdhruba01/codewithdhruba.app

Repository files navigation

Dhrubaraj Portfolio

React TypeScript Tailwind CSS Vite License

Features

Core Features

  • Modern Portfolio Design - Clean, responsive, and professional layout
  • Smooth Scrolling - Buttery smooth scrolling with Lenis library
  • Interactive Animations - AOS (Animate On Scroll) for engaging user experience
  • Responsive Design - Mobile-first approach with Tailwind CSS
  • Dark Theme - Elegant dark color scheme for modern aesthetics

Advanced Features

  • AI Chat Assistant - Interactive chatbot for visitor engagement
  • GitHub Integration - Real-time GitHub contributions display
  • Blog System - Complete blog functionality with dynamic routing
  • Project Showcase - Detailed project presentations with thumbnails
  • Skills Visualization - Interactive skills and technologies display
  • Contact Form - Integrated contact system for professional communication

UI/UX Features

  • Smooth Transitions - Framer Motion animations for fluid interactions
  • Typography - Enhanced typography with Tailwind Typography plugin
  • Icon System - Lucide React and React Icons for consistent iconography
  • Loading States - Error boundaries and loading states for better UX

Tech Stack

  • React - Modern React with hooks and functional components
  • TypeScript - Type-safe development experience
  • Vite - Lightning-fast build tool and dev server
  • Tailwind CSS - Utility-first CSS framework
  • PostCSS & Autoprefixer - CSS processing and vendor prefixing
  • Framer Motion - Production-ready motion library
  • AOS - Animate On Scroll library
  • Lenis - Smooth scrolling library
  • Lucide React - Beautiful & consistent icon toolkit
  • ESLint & Prettier - Code quality and formatting
  • Zustand - Simple, fast, and scalable state management

Getting Started

Prerequisites

  • Node.js (v16 or higher)
  • npm or yarn package manager

Installation

  1. Clone the repository

    git clone https://github.com/codewithdhruba01/codewithdhruba.app.git
    cd codewithdhruba.app
  2. Install dependencies

    npm install
    # or
    yarn install
  3. Start development server

    npm run dev
    # or
    yarn dev
  4. Open your browser Navigate to http://localhost:5173

Build for Production

npm run build
# or
yarn build

Preview Production Build

npm run preview
# or
yarn preview

Contributing

We welcome contributions! Please follow these steps:

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

Development Guidelines

  • Follow TypeScript best practices
  • Use Tailwind CSS for styling
  • Maintain responsive design principles
  • Add proper error handling
  • Include TypeScript types for new components

License

This project is licensed under the MIT License - see the LICENSE file for details.

Made with ❤️ by Dhrubaraj

⭐ Star this repository if you found it helpful!

About

My personal portfolio website built with React, Typescript and Tailwind CSS.

Topics

Resources

License

Stars

Watchers

Forks

Contributors

Languages