Technology Used | Resource URL |
---|---|
HTML | https://developer.mozilla.org/en-US/docs/Web/HTML |
CSS | https://developer.mozilla.org/en-US/docs/Web/CSS |
Git | https://git-scm.com/ |
This project's purpose is to provide employers with a functional and appealing website that displays my portfolio of work and professional experience. Using only CSS and HTML, I used the knowledge and skills learned in bootcamp to build a webpage from the ground up. The design asthetic I chose for this project was a minimal and clean layout that would be easy to build upon.
Here are the critical requirements necessary to develop a portfolio that satisfies a typical hiring manager’s needs:
GIVEN I need to sample a potential employee's previous work
WHEN I load their portfolio
THEN I am presented with the developer's name, a recent photo, and links to sections about them, their work, and how to contact them
WHEN I click one of the links in the navigation
THEN the UI scrolls to the corresponding section
WHEN I click on the link to the section about their work
THEN the UI scrolls to a section with titled images of the developer's applications
WHEN I am presented with the developer's first application
THEN that application's image should be larger in size than the others
WHEN I click on the images of the applications
THEN I am taken to that deployed application
WHEN I resize the page or view the site on various screens and devices
THEN I am presented with a responsive layout that adapts to my viewport
- I work best visually, so it's helpful for me to first create the webpage layout on an iPad (or with paper and pen)
- Spacing is crucial - I found myself using flexboxes for most page sections to easily space and center items
- Don't put too much time deciding the color scheme at the beginning - I found myself wasting too much time initially on playing with colors when I hadn't even placed images or content
- Don't be afraid to experiment! The timeline section was difficult for me to figure out, but after much trial and error was able to achieve the design I was loooking for