Bookish is a book information application providing the most up-to-date list of top-rated books from week-to-week. Users are able to scroll through these books according to 8 different genre selections. Additionally, a user can "favorite" a book they would like to read, having it sent to "My Library". Finally, if a user does not see a book they like, they can look at the most awarded books from years past.
The target user for this application are individuals who are readers with very busy lives, yet want to keep up-to-date with current popular books, and save them to be read later. The user flow first shows all genres, with 10 of the top books apiece. If the user would like additional information, the user can click on the book cover and be presented with a modal with the authoor's name, book grade, year published, and synopsis. If the book is "favorited", the heart will fill in and that book will then appear in "My Library" to be saved for later. Th user logically can also proceed to the Search page (via the navbar) where the user may search for books by year.
This project was created as the final showcase of skills gained in React over the course of the third module (of four) of the Turing front-end software engineering program. This project is the culmination of gained experience and knowledge listed under the Technologies heading below.
- Wins
- Successfully using React to create a web application
- Using Router to make a dynamic webpage that re-directs the URL path
- The implementation of Cypress testing framework to test all views
- Challenges
- Managing state with
useReducer - Fetching several sources of data on page load
- Know what to test using Cypress, and how to test asynchronous events
- Managing state with
- Create and incorporate User Profiles to focus application's structure & audience
- Build a comprehensive application using the React Framework
- Utilize React fundamentals to make the application interactive
- Incorporate React Router for handling multi-page navigation
- Learn how to test React components & asynchronous JS
- React
- React Hooks
- React Router
- Cypress Testing Framework
- CSS
- HTML
- Fetch API
- Git/GitHub
- GitHub project board
- Excalidraw
- Effectively implement React/React Router to create an interactive web application
- Thoughfully structure React components
- User story acceptance testing
- Error handling
- Use Fetch API to make network requests to retrieve data
- Create a user interface that is easy to use and clearly displays information
- Write modular, reusable code that follows SRP (Single Responsibility Principle)
- Implement acceptance criteria testing to ensure consistent user experience
- Demonstrate DRY principles
- Utilize Agile/Scrum project management
- Fork this repository.
- Clone your new, forked repository to your local machine.
cdinto the Bookish repository and runnpm install- Run
npm start - The application will automatically load and be visiible in your web browser.