This project is my personal portfolio website built at Microverse to showcase my projects and skills. I built this using HTML, CSS and JavaScript.

  • By Kehinde Onifade
  • Last update: Sep 9, 2022
  • Comments: 7

portfolio-website

This project is my personal portfolio website built at Microverse to showcase my projects and skills.

screenshot

Built With

  • HTML
  • CSS

Live Demo

Live Demo Link

Getting Started

To get a local copy up and running:

  1. Clone this repository or download the Zip folder:

git clone https://github.com/kendoriddy/portfolio-website.git

  1. Navigate to the location of the folder in your machine:

[email protected]:~$ cd <folder>

Author

👤 Kehinde Ridwan Onifade

Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project and how we manage to build it!

Acknowledgments

Template from this Figma by Microverse

📝 License

This project is MIT licensed

Github

https://github.com/kendoriddy/portfolio-website

Comments(7)

  • 1

    Milestone: Work modal

    • Add HTML code for mobile view of work modal
    • Style mobile view of work modal
    • Add HTML code for desktop view of work modal
    • Style desktop view of work modal
    • Fix linters errors
  • 2

    Milestone:Mobile menu

    • Fixed the header section to the top
    • Use JacaScript to implement opening and closing of the hamburger menu
    • Link menu items to their respective section
  • 3

    Milestone: Accessibility

    Perform accessibility test and make changes to make the website more accessible. These checks are

    1. The page has a title.
    2. All images have alt.
    3. The website has only one h1, and other heading tags are applied appropriately
    4. Color contrast is perfect.
    5. Update fonts to make them more responsive.
    6. All clickables can be tabbed to.
    7. The website have no moving content.
    8. The structure of the page is in the right order.
  • 4

    Design

    1. Add Recent Work and About me design
    2. Add Skill Proficiency design
    3. Add Contact Section design
    4. Add Contact Form
    5. Add hover to buttons
    6. Fix linters errors
  • 5

    Feature

    1. Set up linters
    2. Added "assets" folder and HTML skeleton files
    3. Implement HTML "headline" code, and CSS files
    4. Add background images
  • 6

    Milestone: Preserve data

    In this milestone, we are to preserve data inputed in our contact form by saving them to LocalStorage. To achieve this, we

    • Create and initialize formData object to hold the form data
    • Create function to save data into LocalStorage
    • Create functions to retrieve data from LocalStorage
    • update localStorage on change event
    • Populate the LocalStorage automatically and get data from it
    • Fix linters errors
  • 7

    Peer to Peer Code Review

    ⚠️ Issue #2

    • Great job so far 🚀. I would however recommend you to use CSS to add either a border-top or a border-bottom to your project for better HTML practices. This way, the border will have no effect on the actual layout of the project on the browser.
    • It is considered among the best practices, especially for accessibility purposes to add descriptive alt text to all images in a project.