I re-created my original website development portfolio utilising BootStrap. Each section was built from components from Bootstrap with elements of custom HTML/CSS to resemble as much of the original design as possible.
This task was key to understanding the importance of utilising BootStrap and building confidence/familiarity with it.
The portfolio successfully loads with:
- A page that has a Navigation Bar built using a BootStrap component
- The Navigation Menu includes links that lead to the respective sections of my portfolio page
- The Hero section was recreated with using a Jumbotron component that features my picture, my name and my title
- The works/projects section displays my (future) work in a grid. BootStrap cards have been used to create each project part and each of them has a title and a brief overview
- The skills section is something that has been added, it lists out the skills I expect to learn from Bootcamp. I have utilised FontAwesome icons to add more visual appeal.
- As per requirements, the About Me section and the Contact section are now in the same row
- The footer section has been updated with all hyperlinks now displaying a hover effect, with buttons displaying a box shadow upon hover
- BootStrap allowed me to minimize use of media queries, however some were used for cleaner responsive design
- Other elements of my original portfolio that are also present here are: smooth UI scrolling when links are clicked and image of project taking user to deployed application (currently still my GitHub repo).
Deployed website link: https://nrai14.github.io/bootstrap_portfolio/
Screenshots: #1 (comment)
N/A
BootStrap https://getbootstrap.com/
FontAwesome https://fontawesome.com/
MIT license utilised