Project Library Website
project-library is a front end website designed as a personal portfolio to hold various projects online. This website is hosted on https://dylanslibrary.com
The portfolio site looks like this. Equipt with a functional navigation bar, footer component, and responsive design:
Close down this repository. You will need node and npm installed globally on your machine.
To Start Server in command line:
npm run dev
To Open Local Server (enter local port number for xxxx):
https://localhost:xxxx
- This project was started with Vite using React + TypeScript combo
- The UI design was done using Chakra UI
- What was the context for this project?
After self-teaching ReactJS, I wanted a way to showcase various works and test my own knowledge. I decided that a front end website using React would be the best way to do this so I set out to create a simple, yet functional UI that represents my personal brand. The design is also fully mobile responsive and includes modern features such as scroll buttons and auto video playing.
- What did I end up building?
My final product is a fully hosted, secured website on the domain dylanslibrary.com. The website allows me to hold any projects I want using any technologies and display them elegantly in a fast, single page web application.
- What tools did I use?
For the functional development, TypeScript was used instead of JavaScript for stronger type support as well as Chakra UI as a design tool to speed up my work flow. Figma was used for initial mockups as well as Fontsource and LottieFiles for fonts and images.