This repository hosts the source code for my personal portfolio website. The website showcases my education and professional experience as well as private projects I implemented in the past. Additionally, the webpage offers a contact form and links to all my professional social media accounts. The application is implemented using ReactJS and was completely designed and developed from scratch.
In order to start this project locally, the following things need to be installed:
Additionally a .env
file is necessary to get the contact form working
To install the project and get it started locally, you have to perform the following steps:
- Clone the repository
- Cd into the repository folder
- Run
yarn
to install the necessary dependencies - Run
yarn serve
to start the application on port3000
This is a list of useful commands for the project:
yarn
installs the necessary dependenciesyarn serve
starts the application on port3000
yarn serve:network
starts the application on port3000
in your local networkyarn build
creates a production build in the ./dist folderyarn test
runs the tests (not yet implemented)
This is a list of tools, libraries and technologies used in this project:
- Yarn: Package Manager for npm projects
- React: JavasScript Library for building component based User Interfaces
- TypeScript: strongly typed Programming Language built on top of JavaScript
- ESLint: Linter for JavaScript and TypeScript projects
- Prettier: Code Formatter
- Webpack: Module Bundler for JavaScript projects
- Material UI: Open-Source React component library that implements Google's Material Design
- tsParticles: TypeScript library for creating particle background animation
- react-full-page: React library to create fullpage applications
The project is structured as follows:
src
├── assets
├── components
├── types
└── views
The individual folders serve the following purposes:
assets:
contains all the necessary images such as programming icons, thumbnails or project images as well as my CVcomponents:
contains all individual React components that build up the respective viewstypes:
contains necessary type declarationsviews:
contains the five views of the application, i.e. Home, About Me, Experience, Project and Contact View