---
# System prepended metadata

title: SECOND SEMESTER EXAM ARTICLE

---

# SECOND SEMESTER EXAM ARTICLE

During the prior semester, lessons on altschool Africa covered React and its ecosystem. That was a lot to digest from the standpoint of a javascript coder, but I've heard Nextjs is considerably stricter - I'm delighted I've mastered the ability to tackle new things efficiently. In order to review my learning from the previous semester for this essay, I'll list the new tools I used to develop [my exam project](https://altsch-ss-exam-velia.web.app/repos/altschool-react-calculator) below.

Before getting into the tools i used i made sure to set up my environment with [create-react-app](https://www.geeksforgeeks.org/reactjs-setting-development-environment/).

## Routing
Routing in React is the process of managing and rendering different views or pages based on the URL/route of a web application. React Router is a popular library for routing in React, it helps to navigate between different components or pages within the application without refreshing the whole page.

React Router uses the concept of "routes" to define which component should be rendered for a specific URL path. It uses the Route component to define a specific path and the component that should be rendered when the path is matched. 
In my project React Router was employed in the navigation for "Home", "View Repos" and "List of Repos" routes.
## Error Boundary 
Error boundaries are a way to handle and show error messages in a user-friendly manner when there's an unexpected problem during the rendering of a component. 

Error boundaries are used to handle run-time errors in your application and prevent the whole application from crashing when an error occurs in a component.

## SEO

Search Engine Optimization (SEO) is the practice of optimizing a website to improve its ranking and visibility in search engine results pages (SERPs).
I made use of React-Helmet-Async, which is a library that makes it easy to dynamically update the metadata of a React-based website to improve its SEO.
React-Helmet-Async, in essence, aids in enhancing the SEO of your ReactJS website by giving you more control over the document head and enabling you to dynamically update significant SEO aspects like page title and description. 
## Firebase

If you're not already familiar with it, I'm sure the first question on your mind would be "what is a firebase?". Let me explain; Firebase is a comprehensive platform for developing, deploying, and managing web and mobile applications, with a wide range of services and tools for data storage, user authentication, hosting, and analysis.
In my case i made use of the free hosting feature of firebase. My [exam project website](https://altsch-ss-exam-velia.web.app/repos/altschool-github-second-semester-exam) is currently hosted on firebase and any susequent updates to my website when deployed to fire base are also visible on the website.

## Conclusion

Implementing an API fetch on my Github Portfolio and displaying my repositories on a page sounded daunting, but with time and planning, I was able to divide the task into manageable chunks and implement solutions to problems one at a time. As a result, I came up with this fine solution.