Create a twitch clone using React -3

Photo by Oskar Yildiz on Unsplash

Welcome to Part-3 of the series. You can find part-2 here.

We will start implementing forms in our project. We will use Redux-forms, but first let hook up redux-devtools in our project.

Redux Devtools is a chrome/firefox extension, which is extremely useful to debug Redux based project.

Head over to Redux Devtools Extension page here. You will find link for both Firefox and chrome webstore there. Go ahead and install it.

Next, you have to make some changes in root index.js file to use this extension. The changes are marked in bold.

import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware, compose } from 'redux';
import reducers from './reducers';

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(reducers, composeEnhancers(applyMiddleware()));

ReactDOM.render(
<Provider store={store}><App /></Provider>, document.querySelector('#root'));

Now, head over to localhost and open the Developer panel. There click on the Redux tab. If the setup went right, you will see something like below.

Redux Devtools

Next, we will start with adding Redux-form in our project. It is a third party library, which helps us to use forms in an efficient way in our project.

Open your terminal, stop the running instance of server and install

redux-form@8.1.0

You can read the rest of the article from my blog site. The link for the same is below -

You can find part-4 here.

--

--

--

Founder TWD, JavaScript & ReactJS Trainer, Youtuber, Blogger

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Using Angular Material with Angular 6

Build a Rich Text Editor with Editor.js

How to Perform State Management using the Composition API in Vue.js

Ng v8 to v9 — The know-how

This.JavaScript- State of Frameworks and Libraries-Node Update

Where hooks fall short

Generating A Random Code In Your Field Input / Form

How friendly are Single Page Applications to SEO?

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Nabendu Biswas

Nabendu Biswas

Founder TWD, JavaScript & ReactJS Trainer, Youtuber, Blogger

More from Medium

React App with Final Space API — Tinder Style

Using React with Express

How To Set Up React With Tailwind CSS

React routing using React-router (NPM)