Personal Full Stack Web Developer Portfolio built with react.
AS AN employer looking for candidates with experience building single-page applications
I WANT to view a potential employee's deployed React portfolio of work samples
SO THAT I can assess whether they're a good candidate for an open position
GIVEN a single-page application portfolio for a web developer
WHEN I load the portfolio
THEN I am presented with a page containing a header, a section for content, and a footer
WHEN I view the header
THEN I am presented with the developer's name and navigation with titles corresponding to different sections of the portfolio
WHEN I view the navigation titles
THEN I am presented with the titles About Me, Portfolio, Contact, and Resume, and the title corresponding to the current section is highlighted
WHEN I click on a navigation title
THEN I am presented with the corresponding section below the navigation without the page reloading and that title is highlighted
WHEN I load the portfolio the first time
THEN the About Me title and section are selected by default
WHEN I am presented with the About Me section
THEN I see a recent photo or avatar of the developer and a short bio about them
WHEN I am presented with the Portfolio section
THEN I see titled images of six of the developer’s applications with links to both the deployed applications and the corresponding GitHub repository
WHEN I am presented with the Contact section
THEN I see a contact form with fields for a name, an email address, and a message
WHEN I move my cursor out of one of the form fields without entering text
THEN I receive a notification that this field is required
WHEN I enter text into the email address field
THEN I receive a notification if I have entered an invalid email address
WHEN I am presented with the Resume section
THEN I see a link to a downloadable resume and a list of the developer’s proficiencies
WHEN I view the footer
THEN I am presented with text or icon links to the developer’s GitHub and LinkedIn profiles, and their profile on a third platform (Stack Overflow, Twitter)
- Description
- User Story
- Acceptance Criteria
- Table of Contents
- Development
- Info
- Contributing
- Questions
This portfolio was built with react and uses several node modules to create a sleek and cohesive portfolio that displays my skills as a developer, the web app itself looks clean and polished and displays any information an employer may need while looking for information on me. I tried to add as much personal touch to it as I could while taking some inspiration from others who have amazing work. Bootstrap made clean easy layouts possible and small tweaks in a css file made it easy to get the desired look. It is meant to be a single page application.
This build went through alot of refactoring as I couldn't quite land on the design that I wanted while still meeting the criteria of the assignment. I was able to find a focused layout to shoot for and implement it with little trouble once I knew what I was going to have as a finished product and that this can be upgraded and changed as I see fit in the future. It gave me a very good understanding of react.
Questions are welcome and you can contact me at: