Black Stories Matter

Turing School of Software & Design Module 3 Final Solo Project

Project Goals and Requirements

• The goal of this project was to demonstrate project professionalism and mastery of the following technologies:
  • React
  • Router
  • Asynchronous JavaScript
  • styled-componenents
  • Testing
• We were required to use an open API that did not require OAuth or have CORS and choose an audience. I chose to use the Penguin Random House Rest Services API to get data about books and authors.
  • My goal was to showcase books by Black authors with a focus on children's literature. The audience is educators, families and youth. Black users can find “Mirrors”, stories they see themselves in. Other users visit for “Windows”, stories that give them a look into another experience.
• Users needed to be able to manipulate the data. My application displays titles, authors and illustrators from the API. Users can favorite books and filter by author.

Wins

This current iteration of this project is a proof of concept that I will continue building on. I deepened my understanding of React architecture, Router, Asynchronous JavaScript, styled-components and testing. I learned how to parse XML into JavaScript objects. This project was designed mobile-first and has an accessibility score of 100.

Challenges

Working with the available book APIs to get the data I wanted was my biggest roadblock. Unfortunately, many of the authors I wanted to showcase were not available since the API only had author's published by Random House. I was unable to get cover images of the books through the available APIs. I also have room to expand my testing, specifically asynchronous functionality and sad paths, and would like to refactor to improve performance.

Future Iterations

This project piqued my interest in building my own API. I want to create a database of Black children's books and authors that includes titles, authors, illustrators, cover images, summaries, age ranges, genres and links to author websites. Future iterations will have more informative and visually pleasing book previews. Users will be able to filter not only by author but also by illustrator, age range and genre. Users will be able to add books to a reading list as well as mark favorites. I also want to create digital wireframes for this project and include media queries for desktop display.

Proof of Concept in Action

Installation

• Clone this repo into an empty directory on your local machine.
• Run npm install in your teminal to install the project's dependencies.
• Run npm start to run the application in development mode.
• Visit http://localhost:3000 to view in the browser.
• This project was bootstrapped with Create React App.