Axios: Facilitates making API calls using AJAX. ![]() react-router-dom: Adds routes to your React app. ![]() Redux-Logger: Creates a log in the console every time an action is called.Redux-Thunk: Middleware that allows you to create asynchronous Redux actions that can wait for an API response.React-Redux: Connects React Components with Redux store.Redux: Creates a centralized object to store and access you application's current state.Yarn add redux react-redux redux-thunk redux-logger react-router-dom axios bootstrap Use create-react-app to set up a React app. We will install our react app in a directory called "client" inside our API's root directory. It assumes only limited knowledge of Redux. This tutorial assumes you are familiar with React but not necessarily with React hooks. To read more about React hooks go to /docs/hooks-intro.html. Hooks allow you to use state and lifecycle methods in functional rather than class components for shorter, cleaner code. This tutorial uses the Hooks API which is a new feature in React as of version 16.8 (released February 2019) and React-redux as of version 7.1 (released June 2019). ![]() It uses a RESTful API which essentially means that the API's endpoints correspond with the CRUD actions. It incorporates all the CRUD database actions of Creating records, Reading records, Updating records, and Deleting records. There is an optional part 3 where we deploy the app to Heroku. In this tutorial we will integrate a React with Redux front end application into an API built with Node.js, the Express web framework and the MongoDB database. This is part two of a tutorial on building a MERN web app.
0 Comments
Leave a Reply. |