A bookstore app that allows a user add a book, displays added book with reviews and rating for each book and allows a user delete a book.

Overview

BOOKSTORE

A bookstore app that allows a user add a book, displays added book with reviews and rating for each book and allows a user delete a book.

Built With

  • React.js and CSS3
  • Frameworks
  • Netlify, Webpack, big.js, jest, Git and Babel.

Live Demo


Live Demo

Getting Started

To get a local copy up and running follow these simple example steps.

Prerequisites

Node.js

Setup

To get a local copy up and running you'll need to have NodeJS installed on your local machine.

Install

After installing NodeJS please follow the next steps...

Usage

npm i

-- for installing dev dependecies.

npm run build

-- to run the project.

Testing

npm run start

Deployment

npm run deploy

Authors

πŸ‘€ PROMISE OKECHUKWU

🀝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project!

Acknowledgments

  • You for viewing this repo and dropping a ⭐️ .
  • Microverse Inc
  • etc

πŸ“ License

This project is MIT licensed.

Comments
  • Styling

    Styling

    Hey There πŸ‘‹πŸ»

    In this PR, you can find that I:

    • [x] Styled the different components
    • [x] Styled the redux components
    • [x] added transitions and effects

    Happy Reviewing

    opened by PromzzyKoncepts 1
  • Components

    Components

    Hey There πŸ‘‹πŸ»

    In this PR, you will find that I:

    • [x] Initialised React app.
    • [x] Created a directory for your components.
    • [x] Added React Router and set two <Route>s and <Link>s for the app's navigation
    • [x] Created a component called Book for displaying a single book (receive a title and an author as prop) and reused it in a component that displays a list of books.
    • [x] Created a separate component for this form (with inputs for a title and an author
    • [x] Styled the project
    • [x] Checked for linters
    • [x] Committed and pushed changes

    Happy Reviewing...

    opened by PromzzyKoncepts 1
  • Connect to api

    Connect to api

    Hey There πŸ‘‹πŸ»

    In this PR, you can find:

    • [x] Used Bookstore API documentation API.
    • [x] Used fetch or axios with createAsyncThunk for making API calls.
    • [x] Fetched book list from Bookstore API on Books page load.
    • [x] Added an Action Creator, that returns a function.
    • [x] Fetched list of books.
    • [x] Dispatched another action (add an action type) that will pass API response to reducer and update the state.
    • [x] Refactored your add book and remove book features to persist your changes in the server.
    • [x] Changed the existing Action Creators, so they return functions.
    • [x] Made changes by using API.
    • [x] Dispatched an action (action type that existed before refactor) that will updates the state accordingly.
    • [x] Add book and remove book work in the same way after the refactor.
    • [x] Checked for linter errors
    • [x] committed and pushed changes

    Happy Reviewing

    opened by PromzzyKoncepts 0
  • React redux

    React redux

    Hello πŸ‘‹πŸ»

    In this PR, you can find that I:

    • [x] First of all - made sure that I keptstate immutable in reducers!
    • [x] Secondly, changed the default state in your books reducer from an empty array to an array with a few books.
    • [x] Imported Redux Provider and store in the main component of React app.
    • [x] Connected the app to the Redux store.
    • [x] Made sure that list of books displays books from Redux store.
    • [x] Used useSelector to consume the state.
    • [x] In the React component responsible for adding new books, added functionality for the "Add new" button click:
    • [x] Imported Redux useDispatch.
    • [x] Set the data inputs in the local React state (set title and author
    • [x] Takes the inputs from the state and generate a unique id and add them to an object.
    • [x] In the React component responsible for removing books, added a functionality for "Remove" button click:
    • [x] Imported Redux useDispatch.
    • [x] Dispatched a corresponding action
    • [x] In React component responsible for categories, added a functionality for "Check status" button click:
    • [x] Imported Redux useDispatch.
    • [x] Dispatched a corresponding action (import Action Creator that you created before and use it here).

    Happy Reviewing

    opened by PromzzyKoncepts 0
  • Reducers actions

    Reducers actions

    Hey There πŸ‘‹πŸ»

    In this PR, you can find that I:

    • [x] Defined action types for adding and removing a book.
    • [x] Set the initial state of being an empty array of books.
    • [x] Exported Action Creators for your actions.
    • [x] Wrote your reducer and exported it as default.
    • [x] Defined state changes for the actions that you created.
    • [x] And in the case of unknown action - returned the current state.
    • [x] Define an action type for checking the status.
    • [x] Set the initial state as an empty array of categories.
    • [x] Exported Action Creators for your actions.
    • [x] Wrote your reducer and exported it as default.
    • [x] For the check status action returned a string "Under construction".
    • [x] In case of unknown action - returned the current state.
    • [x] Configured the Redux Store in ConfigureStore.js
    • [x] Imported the necessary methods from Redux Toolkit.
    • [x] Combined both reducers into a root reducer by using configureStore.js function.

    Happy Reviewing

    opened by PromzzyKoncepts 0
Owner
Promise Okechukwu
- Software Engineering student and Mentor at @microverseinc - Journey to Full-stack Developer: HTML-CSS-JS-RUBY-RAILS--Node.JS-PHP - Open to new opportunities
Promise Okechukwu
"BookStore" is a web app for adding books. It is a Single Page App (SPA) that allows users to add and remove a book from the library

BookStore | M3Wx "BookStore" is a web app for adding and removing books from a library storage. It is a Single Page App (SPA) that allows users to add

Alexander Oguzie-Ibeh 4 Apr 11, 2022
The Bookstore is a website similar to the "Awesome Books" website. Here we will create an MVP version of it that allows you to: Display a list of books, Add a book and Remove a selected book.

Book Store This is Book Store project. Built With HTML CSS JavaScript React Screenshot Live Demo Go Live ?? Getting Started Open dev branch Open VSCod

Tadesse Alemayehu 5 May 3, 2022
The Bookstore is a website similar to the "Awesome Books" website built in the previous module. You will create an MVP version of it that allows you to: Display a list of books. Add a book. Remove a selected book.

Bookstore The Bookstore is a website similar to the "Awesome Books" website built in the previous module. You will create an MVP version of it that al

Anuar Shaidenov 6 Jun 12, 2022
A hotel reservation app displays all the existing hotels and details of each hotel, allowing the user to reserve the hotel they want.

Reservify A hotel reservation app displays all the existing hotels and details of each hotel, allowing the user to reserve the hotel they want. Allows

David Vergaray 9 Oct 6, 2022
An application that has a frontend (user interface) that allows you to create, read, update or delete (CRUD) products using an API in which you can also create, read, update or delete products.

CRUD app with React and Firebase 9 An application that has a frontend (user interface) that allows you to create, read, update or delete (CRUD) produc

JΓΊlio Bem 3 Sep 28, 2021
As a user, I want to be able to post about travel locations and provide comments and ratings. As a user, I want to be able to look at other users posts and search travel locations by rating.

Travel-bug https://travelbug-project.herokuapp.com/ Table of Contents User-Story Description Installation Usage Contributions Tests License Questions

Megan 3 Mar 2, 2022
Bookstore CMS React Front-End to display a list of books, categorize it, add and remove books and update your reading progress

Bookstore REACT app to manage your books Build an app to display a list of books, categorize it, add and remove books and update your reading progress

Eapen Zacharias 3 Aug 19, 2022
TV Show App is an application that allows to searh tv shows based on user input. Each tv show is displayed in a Bulma Card component and when clicked, heads you to the official tv show site

TV SHOW APP TV Show App is an application that allows to search tv shows based on user input. Each tv show is displayed in a Bulma* Card component and

HENDEL SAMY 1 Dec 19, 2021
This application allows you to create a list to keep tracks of the books you are reading and check the progress for each book.

Bookstore This is an application built to track the books you are reading and the progress you have made for each book! Additional description about t

Santiago Velosa 4 Feb 27, 2022
This app simulates a simple bookstore, and it was created using ReactJS and Redux.

Bookstore About The Bookstore is a website similar to the "Awesome Books" website built in the previous Microverse module (see live version). My goal

Enio N. de Souza 6 Oct 3, 2021
BookAttic is an online bookstore made using the MERN stack.

BookAttic is an online bookstore made using the MERN stack. Link to the website. Table of contents General info Technologies Setup General info This p

Chirag Datwani 32 Nov 19, 2022
This is made for those who are learning react and are tired of doing create-react-app and having to delete those unused files

Easy React Pack (ERP) This is made for those who are learning react and are tired of doing create-react-app and having to delete those unused files. H

null 3 Jan 12, 2022
Book Store is a website that allows you to add, remove and view books.

Book Store Book Store is a website that allows you to add, remove and view books. Built With ReactJS Redux React Router Getting Started with Create Re

Ezekiel Utshudi Eteta 9 Jun 23, 2022
This is Covid-19 data that shows for each country.You can search your country and know its statistics .

COVID-19 Data TRACKER This is Covid-19 data that shows for each country.You can search your country and know its statistics . Built With HTML, CSS, SC

Samiullah Bhadur 2 Apr 21, 2022
A complete habits manager, where you can track your progress and complete each daily activity in an organized way.

TrackIt Habit manager in a dynamic, clear and simple way. TackIt is an application that seeks to make it simple and accessible for any user to control

Rui Neto 13 Dec 31, 2022
CoWIN Vaccination Tracker, Below is the PRODUCTION LINK this is updated at end of each day. To see any latest Updates, please check the documentation

CoWIN Vaccination Slots Checking App. CoWIN Vaccination Slots Checking App is a user-friendly website that allow users to find vaccine in nearby avail

Stephin Reji 31 Jan 28, 2022
Each commit is a step of training.

This project was bootstrapped with Create React App. Below you will find some information on how to perform common tasks. You can find the most recent

Proto Yazilim 3 Jun 18, 2022
A web app built with Covid-19-API that displays Covid 19 cases, deaths and recovery per country in the entire World

Covid19 Tracker A web app built with Covid-19-API that displays Covid 19 cases, deaths and recovery per country in the entire World Built With HTML, C

Promise Okechukwu 4 Nov 1, 2022
An eCommerce website that allows you to sign in and create an account and buy products and pay using PayPal and includes a dashboard that allows you to (add, update, and remove) a product...

An eCommerce website that allows you to sign in and create an account and buy products and pay using PayPal and includes a dashboard that allows you to (add, update, and remove) a product...

Mohamed Aachour 7 Oct 1, 2022