Skip to content

Latest commit

 

History

History
101 lines (71 loc) · 3.46 KB

README.md

File metadata and controls

101 lines (71 loc) · 3.46 KB
Raw

PortfolioV3

Welcome to my web portfolio! This project showcases my past projects, skills, and experience in a dynamic and interactive way. It's built using React, SASS, and Typescript and is based off Create React App.

Features

  • Single Page Design: The homepage provides easy access to relevant information through scrolling or navigation links.

  • Project Showcase: Explore a collection of my past projects, each with its own details, technologies used, and links to live demos or repositories.

  • Skills Section: Discover the range of skills I possess, categorized for clarity. From programming languages to frameworks and tools, get insights into my technical proficiency.

  • Contact form: Contact form with relevant contact information throughout the site.

  • Responsive Design: The portfolio is designed to be responsive, ensuring a seamless experience across various devices and screen sizes.

  • Accessibility: Prioritize inclusivity with accessibility features, ensuring a user-friendly experience for individuals with diverse needs.

  • SEO: Enhance visibility and reach a wider audience by implementing SEO best practices, optimizing the site for search engines.

Tech Stack

This project was bootstrapped with Create React App.

  • React
  • SASS
  • Typescript
  • Bootstrap

Getting Started

Prerequisites

  • Node.js installed on your machine.

Installation

  1. Clone the repository to your local machine:

    git clone https://github.com/JoeCastle/PortfolioV3.git

  2. Navigate to the project directory:

    cd PortfolioV3

  3. Install dependencies:

    npm install

Running the Project

  1. Start the development server:

    npm start

  2. Open your browser and visit http://localhost:3000 to view the web portfolio.

Project Structure

  • src: Contains the source code for the React application.
    • components: React components including pages and sections.
      • home-sections: The main sections of the homepage.
      • pages: Individual pages.
      • shared: Components shared across multiple components or pages.
    • data: Typescript objects storing data used on the website such as projects and skills.
    • scss: SASS files for styling the components and pages.
  • cypress Tests folder containing Cypress integration and component tests.
  • public Static folder containing index.html, favicon and other assets.

Available Scripts

  • npm start
  • npm run build
  • npm test
  • npm eject
  • npm run pretty
  • npm run cypress:open
  • npm run cypress-component
  • npm run cypress-e2e
  • npm run update-project-date
    • Updates the date in .env.local and sitemap.xml to current date.

TODO:

  • Write README.md.
  • Update styling and structure of the About and Landing sections.
  • Improve UX by updating styling for buttons and links.
  • Update styling and structure of the Contact section.
  • Update styling and structure of the footer.
  • Update general copy.
  • Update project copy.
  • Add cypress tests.
  • Add jest tests.

License

The code in this project is licensed under the terms of the LICENSE-website, while the content, including text and media, is licensed under the LICENSE-content. See the respective files for detailed licensing information.