ivonnebenitesrodriguez / bookstorereact

Hello Devs 🌷

• 🦋 Very Nice to meet you

• 🔭 I’m currently working on Microverse Bootcamp

• 📫 How to reach me: [email protected]

• Pronouns: She/Her

• 🏠 currently based in Peru

• ⚡ Fun fact: I love to visit bookstores and flower shops

Languages and tools

Status

Languages

Commit Streak

bookstorereact's Issues

initialize-project

Issue: initialize-project

This project is about laying the foundations of our Bookstore website using React.

For it:

• I will create a feature branch named initialize-project.
• I will add the foundations of our Bookstore website.
• I will create an user interface using React.
• I will set up client-side routing using React-Router V6.
• I will set up a new react-application using create-react-app
• I will add a directory named components and store inside components.
• I will add 2 routes in our app.
• Each page component needs to have : / and /categories

Goal:

The goal is to use React Router and use React components.

add-reducers-actions

Issue: add-reducers-actions

This part of the project is about understanding the concept of state management and using store, actions, and reducers
in React.

For it :

• I created a featured branch named addreducers-actions.
• I will implement Redux Toolkit inside my react application.
• I will setup a Redux Store creating a folder named redux.
• Inside the redux folder I will store a file named store.js
• Then, I will create a slice of state for books to save state and reducers.
• Also, I will create a slice of state for categories
• I will pass linters ESLint and Stylelint tools.

Goal

The goal is to understand well the concepts of state management and using store, actions, and reducers in React.

redux-components

Issue: redux-components

This part of the project is about understanding the concept of state management and using store, actions, and reducers
in React. And mostly also about React and Redux.

⭐️ For it :

I created a featured branch named redux-components
I will implement Redux Store to display books
I will implement react-redux to connect my store
I will use the method : useSelector to access my state variable
I will use a combination of reducers and the method : useDispatch to access my state modifiers
I will pass linters ESLint and Stylelint tools.

Goal

The goal is to understand well the concepts of state management and using store, actions, and reducers in React.
As well as how to connect React and Redux.

styling

Issue: Styling

This part of the project is about creating the styles of our bookstore app.

For it:

• I will create a featured branch named styling.
• I will respect the gitflow.
• I will add missing JSX elements to my project.
• I will follow Zeplin's design.
• I will use CSS Rules detailed in Zeplin to style the website.
• I will pass the linters: Stylelint and ESLint tools.

Goal:

I will apply css styles and add jsx elements for a better styling to my project.

connect-api

Issue: connect-api

This project is about understanding the concept of state management, connecting an existing API via Redux and use the data to display something in a UI.
For it:

• I will create a featured branch named connect-api.
• I will use an external API named Bookstore Api as backend.
• I will use axios with createAsyncThunk to make our HTTP requests to the Backend.
• I will fetch our Books from the BookStore API after the component has rendered.
• I will refactor addBook and removeBook features to keep our changes in the server.
• I will pass all the linters: ESLint and Stylelint tool.

Goal:

The goal is to learn how to connect our React & Redux Application to an existing API to create and remove books from a server.