Project Overview
The objective of this project was to take an API and build a fully functional web application around it. Yeboah Hire allows users to search and apply for jobs that they are interested in.
Technology Profile
Yeboah Hire uses JavaScript for basic logic such as sorting and date manipulation. It uses React, and Redux for API calls, data fetching and refreshing.
JavaScript
React.js
Tailwind CSS
Redux
Git
Challenges
Yeboah Hire was my first project that was built entirely around an API library. While coming up with a great user interface to take advantage of the API endpoints posed a creative challenge, the biggest technical challenge was Redux. Redux is an amazing tool, it’s especially effective in data fetching and caching; but some of the concepts required to implement it were a little challenging to grasp.
- Planning out the components that would be used, and reused throughout the application.
- Ensuring that the color schemes and styles used in the application were consistent.
- Taking advantage of all the API endpoints and capabilities to make sure that the application is feature rich.
- Building a feature rich front-end around the job search API endpoint.
- Implementing Redux Toolkit to fetch endpoint data.
Learnings & Takeaways
I really enjoyed working on this project, simply because it showed that me that fleshed out application can be built around predefined API endpoints.
- Before beginning development, I made sure that the design was finalized. This ensured that I only had to focus on writing code that would bring the design to life, as opposed to designing and coding at the same time (which I have done in the past - not a good idea).
- Another major take away from this project was pagination. Initially, I fetched all of the data from the API at once, meaning that the pagination was done on the client side. However, making such a large requests consumed a lot of credits. The user of the application may only look through the first page and may not proceed to the second; in such cases a lot of credit was being wasted so eventually I came to use server-side pagination, which much means that we are only sending requests to the API for the pages that the user is wanting to access. So, if the user is wanting to access the first page, then we make the request for the first page if they're wanting to request data for the second page. So the server side pagination was the way to go, this was a major take away from this project because pagination is basic fuctionality in modern applications.
- The last biggest take away was being able to use Redux Toolkit. This was a new technology. Prior to Redux, I often made use of Axios, but in this case we wanted to use a new technology that would have additional capabilities at the beginning. I somewhat regretted my decision due to the learning curve, but at the end the ability to quickly refresh data, and the built in caching made Redux Toolkit very worthwhile. This is specifically true on the filter pages where you go to a job, you get results and then the ability to quickly select. Some filter criteria and then re fetch the information or refresh the information made Redux toolkit a excellent choice.