Skip to content

Repository files navigation

Stephen's Portfolio Website

GitHub Repo

A modern, responsive portfolio website built with React, TypeScript, and Tailwind CSS. Features smooth animations, dark/light theme support, and particle effects.

Live Demo: View Portfolio

🌟 Features

  • Modern UI/UX Design

    • Clean and professional interface
    • Responsive layout for all devices
    • Smooth animations and transitions
    • Dark/Light theme support
  • Interactive Elements

    • Particle background effects
    • Animated gradient orbs
    • Floating sparkles
    • 3D rotatable objects
    • Click effects
    • Toast notifications
    • Tooltips
  • Pages

    • Home: Welcome and introduction
    • About: Personal information and education history
    • Projects: Showcase of work and achievements
    • Experience: Professional journey
    • Skills: Technical expertise
    • Contact: Get in touch

🛠️ Technologies Used

  • React 18
  • TypeScript
  • Tailwind CSS
  • Framer Motion
  • React Query
  • Three.js
  • Vite
  • Firebase Hosting

🚀 Getting Started

Prerequisites

  • Node.js (v14 or higher)
  • npm or yarn

Installation

  1. Clone the repository:
git clone https://github.com/Stephen13-05/Stephen-Portfolio.git
cd Stephen-Portfolio
  1. Install dependencies:
npm install
  1. Start the development server:
npm run dev
  1. Build for production:
npm run build

📦 Project Structure

src/
├── components/     # Reusable UI components
├── pages/         # Page components
├── styles/        # Global styles and Tailwind config
├── assets/        # Images and other static files
├── hooks/         # Custom React hooks
├── utils/         # Utility functions
└── types/         # TypeScript type definitions

🎨 Customization

  • Colors and themes can be modified in tailwind.config.js
  • Animations can be adjusted in the respective component files
  • Content can be updated in the page components

📱 Responsive Design

The website is fully responsive and optimized for:

  • Desktop
  • Tablet
  • Mobile devices

🔧 Development

  • Run tests: npm test
  • Lint code: npm run lint
  • Format code: npm run format

📄 License

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

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

📞 Contact


Made with ❤️ by Praveen Stephen D

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages