This app is a single page, dynamically rendered React portfolio. Showcasing my web development skills.
-
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)
- Technologies used
- How to install
- Usage
- License
- Screenshot
- Bugs
- Version History
- Links to repo and heroku
- Contributing
- LiveURL
- Contact
In the terminal, start by typing "npm i". This will install all the dependencies and dev dependencies required. To run the app, 'npm start'.
Through 'npm run build' the dist folder will be built, bundling your assets for efficiency. The local host server will start on local host 3000. You can also run 'npm start'. To deploy to a URL on Github pages, run 'npm run deploy' every time you have updates.
-
Dynamic components were not rendering correctly.
-
An intermediate component was created.
- 0.1 Dependencies and dev dependencies installed.
- 0.2 Established local host connection.
- 0.3 Initial 'static' components were created.
- 0.4 Dynamic components were created.
To contribute to the repo yourself please:
Git clone the repository, work on the code, then make a pull request.
If you have any questions, or would like to get in touch find me on GitHub Laura-Kam or email me at laurakam91@gmail.com.