This project is a personal portfolio website used to showcase projects and share relevant experience. It is open sourced and can be forked. Users only need to edit a json file with relevant data (see section: How To Use).
Deployed At: https://0xbn.github.io
| Demo | Mobile | Desktop |
|---|---|---|
| Dark/Light Mode |  |
 |
| Full scroll |  |
 |
I built this to showcase my projects, but also to refine my React and Tailwind CSS skills.
- Responsive design (navigation bar and sections)
- Carousel built without templates
- Animation: scroll between sections, landing page
- React components extraction
- React : Frontend
- Tailwind CSS: Styling
- Github: Deployment
Edit your personal information in the userData.js (data is in json format).
| Directory | Edits |
|---|---|
| './src/pages' | section details |
| './src/data/userData.js' | contact details, project cards, technology icons, and websites |
** Desktop(D) Only and Mobile(M) Only
- Responsive Single Page App
- Reusable components custom made
- Project card carousel is custom made (no template)
- Sticky section header
- M: Animated hamburger button and menu
- M: Dark theme toggle fixed to the top right
- M: Minimalistic animation patterns and arrows
- D: Smooth scroll to section
- Technology buttons for project card links to official site or documentation
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
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!
How to deploy documentation: https://facebook.github.io/create-react-app/docs/deployment