This repository contains the source code for my personal portfolio, built with React, TypeScript, and Vite. The goal is to showcase my skills and projects in an organized and visually appealing way.
The portfolio is a responsive website designed to be accessible on various devices. It uses a separate content management system (CMS), hosted on GitHub Pages (https://vstahelin.github.io/cms-portfolio/), to separate the data from the interface code. This approach simplifies and streamlines content updates without requiring changes to the front-end code.
- React: JavaScript framework for building user interfaces.
- TypeScript: A superset of JavaScript that adds static typing, improving code maintainability and reliability.
- Vite: A web development tool that offers a fast development server and optimized build process.
- Tailwind CSS: Utility-first CSS framework that simplifies the styling process.
- React Router: Library for managing application routes.
- React GA4: To integrate Google Analytics 4 into the site.
- React Icons: For adding icons to the site.
- GitHub Actions: To automate tasks like
lint
anddeploy
.
The CMS (Content Management System) is a separate repository hosted on GitHub Pages (https://vstahelin.github.io/cms-portfolio/). It contains JSON files with portfolio data (about me, projects, experiences, etc.) and images. The React application in this repository fetches this data from the CMS and renders the website. Check the CMS repository README for more details about its structure and functionality.
- Clone the repository:
git clone https://github.com/VStahelin/portfolio.git
- Install the dependencies:
npm install
or
yarn install
- Start the development server:
npm run dev
or
yarn dev
Visit http://localhost:3000
in your browser to view the portfolio.
The deployment to GitHub Pages is automated using GitHub Actions. After a push to the main
branch, the deployment workflow runs, building the application and publishing the files to the gh-pages
branch.