Cinematic Portfolio

A visually stunning, cinematic portfolio website for showcasing developer work with elegant animations and smooth scrolling experiences. Built with Next.js 15 and React 19.

✨ Features

• Cinematic Design - Beautiful animations and transitions create a film-like browsing experience
• Responsive Layout - Looks great on devices of all sizes
• Dark Theme - Elegant dark mode aesthetics for optimal viewing experience
• Smooth Scrolling - Custom scroll context provides buttery-smooth navigation
• Modern Stack - Built with Next.js 15, React 19, TypeScript, and Tailwind CSS
• Optimized Fonts - Uses Google Fonts (Montserrat and Playfair Display) for beautiful typography

🚀 Getting Started

Prerequisites

• Node.js 18.17.0 or later

Installation

1. Clone the repository

   git clone https://github.com/ichikapaull/portfolio.git
   cd portfolio

2. Install dependencies

   npm install

3. Start the development server

   npm run dev

   Alternatively, run with Turbopack:

   npm run dev:turbo

4. Open http://localhost:3000 in your browser

🧩 Project Structure

• app/ - Next.js App Router pages and layouts
• components/ - Reusable UI components
  • hero.tsx - Hero section with main introduction
  • about.tsx - About section highlighting skills and background
  • portfolio.tsx - Portfolio section showcasing projects
  • contact.tsx - Contact section with form
  • cinematic-background.tsx - Dynamic background effects
  • scroll-context.tsx - Custom scroll handling for animations
• public/ - Static assets like images and icons
• lib/ - Utility functions and shared code

🔧 Customization

1. Update the personal information in the components
2. Replace project examples in the Portfolio section
3. Modify the color scheme in tailwind.config.ts
4. Add your own animations and effects

📝 License

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

🙏 Acknowledgements

• Next.js
• React
• Tailwind CSS
• Framer Motion
• Lucide Icons