This is my portfolio website created in React, inspired by Udacity's Front-End Web Development course. It showcases the projects I'm most passionate about with the creative freedom of developing a website. This repo will always be updated as I learn more about the best web practices and come up with ideas to further improve the website. You can check out my website to learn more and get in touch with me.
- React as the web framework
- TypeScript for added type safety
- SCSS for enhanced CSS syntax
- Bootstrap to improve the UI
- Light and dark mode
- 40+ tests for the 5 main views using the React Testing Library
- Accessible and responsive web design
- Best practices for Progressive Web Apps
- Efficient delivery of static content by utilizing WebP images and WebM videos
- Search Engine Optimization (SEO)
- CI/CD workflows after every commit or PR to main
- Vite for the development server
- SWC, a Rust-based compiler for bundling the website
- Continuous updates and improvements
This project was bootstrapped with Vite.
React Router was used to create the single-page experience.
gh-pages was used to deploy the website to the gh-pages branch.
The GitHub API was used to get the watchers, forks, and stars from each repo.
To create a local copy, you'll need the following command-line programs:
- git:
apt-get install git - npm (part of Node.js):
sudo apt update
sudo apt install nodejs npmClick on this link to view my website on GitHub Pages.
-OR-
Start by setting up the local environment:
git clone https://github.com/Abhiek187/abhiek187.github.io.git
cd abhiek187.github.io
npm installMake sure to keep in the mind the branches when doing development work. If just running the program, stick to the main branch.
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:5173/ to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
Note: Service workers (aka offline functionality) will not work in development mode.
Runs all tests using Vitest.
See the section about running tests for more information.
Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.
Your app is ready to be deployed!
See the section about building for more information.
Runs the production build locally. Open http://localhost:4173/ to view it in the browser.
You can learn more in the Vite documentation.
To learn React, check out the React documentation.
Due to the way GitHub Pages is set up for user pages, this project has been split into 2 branches:
This is the default branch for this repo, where all production code is held. See Contributing for info on how to create the other branches.
This is the default branch gh-pages uses for deployment. It has all the minified content needed to properly deploy this on abhiek187.github.io.