My React Portfolio

A personal portfolio website built using React to showcase my latest projects, technical skills, and experience. The portfolio is fully responsive and designed for a smooth experience across all devices.

---

Table of Contents

• Features
• Technologies Used
• Getting Started
• Folder Structure
• Screenshots
• Contact

---

Features

• Responsive Design: Adapts to different screen sizes, ensuring a seamless experience on mobile, tablet, and desktop.
• Interactive UI: Smooth animations and transitions using ScrollReveal and CSS3 for a more dynamic interface.
• Portfolio Showcase: Displays a collection of my projects, each linked to a GitHub repository or a live demo.
• Contact Form: Allows visitors to easily get in touch with me via email.
• GitHub Repositories: Links directly to my repositories for easy access to my work.
• SEO Optimization: Custom favicon, meta descriptions, and manifest for better visibility.

Technologies Used

• Frontend:
  • React
  • HTML5 & CSS3
  • JavaScript (ES6+)
  • Font Awesome
  • ScrollReveal for animations
  • Responsive design with Flexbox & Media Queries
• Tools:
  • Git & GitHub for version control
  • VSCode for development

Getting Started

To run this project locally, follow these steps:

Prerequisites

• Ensure you have Node.js and npm installed on your machine. You can download them here.

Installation

1. Clone this repository:

   git clone https://github.com/JOSHUA-A69/react-portfolio.git

2. Navigate to the project directory:

   cd react-portfolio

3. Install the necessary dependencies:

   npm install

4. Start the development server:

   npm start

The app will open in your default browser at http://localhost:3000.

Build for Production

To create a production build, run:

npm run build

Folder Structure

react-portfolio/
├── public/
│   ├── logo/
│   │   └── About ME pic.png  # Your favicon and image assets
│   ├── index.html
├── src/
│   ├── components/
│   │   ├── About.js
│   │   ├── Contact.js
│   │   ├── Portfolio.js
│   ├── App.js
│   ├── index.js
│   ├── styles/
│   │   └── main.css  # Custom CSS styles
└── README.md

Screenshots

Home Page

Projects Section

Contact

Feel free to reach out if you have any questions or suggestions.

• Email: ujoshua368@gmail.com
• GitHub: JOSHUA-A69

---

Thank you for visiting!