Nathan Perrier's Portfolio

A retro-styled portfolio website built with NES.css, showcasing my projects, skills, work experience, and education.

🚀 Features

• Retro 8-bit Design: Built with NES.css for a nostalgic gaming aesthetic
• Responsive Layout: Optimized for desktop and mobile devices
• Interactive Elements: Smooth scrolling navigation and hover effects
• Project Showcase: Detailed project cards with technology badges
• Skills Display: Colorful skill badges organized by technology
• Dark Theme: Modern dark theme throughout the site

🛠️ Technologies Used

• Frontend: HTML5, CSS3, JavaScript (ES6+)
• Styling: NES.css framework, Custom CSS
• Build Tool: Vite
• Font: Press Start 2P (Google Fonts)
• Icons: NES.css icons

📱 Sections

1. Header: Name and professional title
2. About: Brief introduction with avatar
3. Skills: Technology badges showcasing expertise
4. Projects: Featured projects with descriptions and tech stacks
5. Experience: Work history and responsibilities
6. Education: Academic background and certifications
7. Contact: Links to GitHub, LinkedIn, and email

🎮 Featured Projects

• Waypoint: AR navigation web-app (2025 BFI Hackathon Project)
• Portfolio: Interactive 3D portfolio experience
• MoistMeter: Agriculture irrigation monitoring app (2025 SIC Hackathon Winner)
• Fishing Social Platform: Social platform for fishing club
• Raincheck: Netflix-styled weather platform

🚀 Getting Started

Prerequisites

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

Installation

1. Clone the repository:

git clone https://github.com/NathanPerrier/portfolio-projects.git
cd portfolio-projects

2. Install dependencies:

npm install

3. Start the development server:

npm run dev

4. Open your browser and navigate to http://localhost:5173

Build for Production

npm run build

The built files will be in the dist/ directory.

Preview Production Build

npm run preview

📁 Project Structure

portfolio-projects/
├── index.html          # Main HTML file
├── package.json        # Dependencies and scripts
├── src/
│   ├── main.js         # JavaScript entry point
│   └── css/
│       └── style.css   # Custom styles
├── public/             # Static assets
└── README.md          # This file

🎨 Customization

• Colors: Modify CSS variables in src/css/style.css
• Content: Update project information in index.html
• Styling: Add custom styles to src/css/style.css
• Scripts: Extend functionality in src/main.js

📄 License

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

📞 Contact

• Website: nathanperrier.dev
• GitHub: @NathanPerrier
• LinkedIn: Nathan Perrier
• Email: contact@nathanperrier.dev