Skip to content

A revamped iteration of my old website portfolio using React, Vite, Vitest, GSAP and Tailwind. The README.md includes a Software Design Document and Component Tests carried out.

Notifications You must be signed in to change notification settings

type0-1/website-portfolio-v2

Repository files navigation

Website Portfolio Revamp

Welcome to the revamped version of my portfolio website! This iteration leverages modern, industry-grade technologies to provide a more dynamic and engaging experience. Below, you'll find an overview of the technologies used, the testing strategies implemented, and additional documentation to help you understand the development process.

Technologies Used

  • React: For building the user interface.
  • Vite: For fast and efficient development.
  • Vitest: For testing React components.
  • HTML: For structuring the web content.
  • TailwindCSS: For styling the application.
  • JavaScript: For adding interactivity.
  • GSAP: For creating smooth animations.

Testing Strategy

Inside the root of this repository, you can find component tests ensuring that:

  • Functionality: Each component operates correctly based on provided inputs.
  • Expected Values: Components have the correct div elements and character values.
  • Correct Div Amount: Specific sections have the correct number of divs.

Code Documentation

The codebase is extensively commented to help you understand:

  • GSAP Methods: Detailed but concise explanations of the GSAP methods used to create various animations.
  • HTML and TailwindCSS: Insights into the structure and styling of the components.

Software Design Document

Included in this repository is a comprehensive Software Design Document. This document outlines the entire process from planning to deployment, including:

  • Project Goals: The objectives behind the project.
  • Benefits: Business and personal advantages of the project.
  • Wireframing: Initial design sketches.
  • UI & UX Considerations: Design decisions to enhance user experience.
  • Implementation: Step-by-step development process.
  • Testing and Deployment: Methods and strategies used to test and deploy the website. This document serves as a practice in creating and refining future Software Design Documents, offering an in-depth look at the project's development.

Current Status

Both the website and the Software Design Document are now completed. Version 1.0

Software Design Document

The Software Design Document, which includes details on planning, implementation, tech stack, flowcharts, wireframing, testing, and UI & UX considerations, can be found here. This document is also discussed in my GitHub README to provide further insights into the project development process.

About

A revamped iteration of my old website portfolio using React, Vite, Vitest, GSAP and Tailwind. The README.md includes a Software Design Document and Component Tests carried out.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published