Portfolio Website

A modern, responsive portfolio website showcasing my skills, projects, and experience as a web developer. Built with Vite and React and hosted on Netlify, this project demonstrates my ability to create clean, user-friendly interfaces and deploy web applications.

🔗 Live Site: https://orbic-portfolio.netlify.app/

Table of Contents

• Design
• Features
• Tech Used
• Getting Started
• Future
• Contact

Design

This all began with the idea that I could take an image as inspiration and try to use that as the basis for a website. I had an idea for a Japanese-style zen garden 🪴 with a wooden porch 🪵. I wanted to take the forest and moss greens 🌳, stone and slate greys 🗿 and brown-reddish wood to use as my colour palette. So to see the image come to life, I generated a few with AI and came up with the image you see above.

Figma Design

Palette

Features

• Responsive Design: Adapts to various screen sizes for optimal viewing on desktops, tablets, and mobile devices.

• Project Showcase: Highlights key projects with descriptions, technologies used, and links to live demos or repositories.

Tech Used

• Frontend:

  • React.js: For building reusable UI components.
  • React Router: For client-side routing and navigation.
  • JavaScript: For dynamic functionality.
  • HTML & CSS: For structure and styling.
  • Font Awesome: For scalable vector icons.

• Tools & Deployment:

  • Vite: For fast development and build processes.
  • Netlify: For hosting and continuous deployment.
  • Git & GitHub: For version control and collaboration.

• Other:

  • npm: For package management.

Getting Started

Follow these steps to set up and run the project locally.

Prerequisites

• Node.js (v18 or higher)
• npm (v8 or higher)
• Git

Installation

1. Clone the repository:

git clone https://github.com/OrbicCode/Portfolio.git

2. Navigate to the project directory:

cd Portfolio

3. Install dependencies:

npm install

4. Start the development server:

npm run dev

5. Open your browser and visit the URL displayed in the terminal (e.g., http://localhost:5173).

Future

• Add a backend for handling contact form submissions (e.g. Node.js with Express).
• Implement a blog section to share some stories from my journey as a dev.
• Enhance accessibility (e.g. ARIA labels).

Contact

For questions, feedback, or collaboration opportunities, reach out to me:

• GitHub: OrbicCode
• LinkedIn: www.linkedin.com/in/james-o-kane-orbiccode
• Email: orbiccode@gmail.com

Thank you for visiting my portfolio!