Quotes - My Second Semester Project

What?

I built a simple project using ReactJS. This simple website carries out a custom counter hook with increment, decrement, reset, and setValue functions with a valid UI and a combination of states with a useReducer that implements a counter with the four evident features in the custom hook - increment, decrement, reset, setValue. I also implemented a page for the custom hook, useReducer, 404, and a page to test error boundary and good SEO.

How?

It wasn't an easy task being the first time I'd ever had to build a project like this, I didn't build it all on my own though, going through multiple tutorials and documentation.

It's a double-paged website that can be navigated through by the use of navigation buttons at the bottom of the page, it is a very user-friendly website.

On the landing page is an input box where you can input your text which I like to call "Quotes", and save them with an "add" button right below it. There are already some default quotes on the site that can be deleted if the user ever wishes to.

The website has a like and dislike button which works as the increment and decrement counter with a responsive counter indicator right above the buttons.

To check out the error boundary page, navigate to the next page using the "next" navigation button, once the page loads tap once on the message on the screen, and a simple counter will show up on the screen with a default value of 10, click on the button with the counter value to decrease it and try to get to a negative count, this will trigger the error boundary and an error message will pop up on your screen, reload the page or press the "prev" button to reload the page or return to the previous page.

NOTE: The website uses the browser storage and doesn't save the quotes to your device's local storage, once the page reloads for any reason all data is reset.

What Next?

I plan on adding new features to the project or improving already implemented functionalities like:

  • making the 'Quotes' actually stored in a database;

  • improving the SEO;

  • improving how the error boundary is implemented.

Who?

I have been Adeyemi Akinyemi, my personal portfolio website is AdeDevs, you can check out my CV and to check out the project you can visit Quotes. Thank You For Your Time

1
Subscribe to my newsletter

Read articles from Adeyemi Akinyemi directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Adeyemi Akinyemi
Adeyemi Akinyemi

I am an entry-level front-end web and mobile app developer, currently a student of AltSchoolAfrica: School of Engineering