Posts

Showing posts with the label React 16

Set up REDUX-SAGA middleware for React App | Part 2 | Reduxsauce | Full codebase

Have you missed Part 1 of this post, here is the  link Ok now let's create Saga file for gettingPostList : Saga/getPostListSaga.js import { call , put } from 'redux-saga/effects' import getPostListAction from '../Reducers/postListReducer' import getPostListService from '../Services/getPostsService' export default function* getPostList ( action ){ try { const response = yield call ( getPostListService ); yield put ( getPostListAction . getPostListSuccess ( response )); } catch ( err ){ yield put ( getPostListAction . getPostListFailure ()); } } After creating saga file we have to link saga with specific reducer in the RootSaga file Saga/RootSaga.js import { all , takeLatest } from 'redux-saga/effects' import { GetPostListTypes } from '../Reducers/postListReducer' import getPostList from './getPostListSaga' export default functi...

Set up REDUX-SAGA middleware for React App | Part 1 | Reduxsauce | Full codebase

Image
I presume that you already gone through the docs of redux-saga, reduxsauce ,so that I won't waste your time with lots of description. Let's start coding Init react app : npx create-react-app redux-saga-starter First we need to install the dependencies : npm i --save redux react-redux remote-redux-devtools redux-saga redux-logger reduxsauce seamless-immutable Install react router dependency for required routes : npm i react-router-dom --save So before adding redux/redux-saga my initial index.js , App.js and Router.js are as following : index.js import React from 'react' ; import ReactDOM from 'react-dom' ; import App from './App' ; ReactDOM . render ( < App /> , document . getElementById ( 'root' )); Router.js import React , { Component } from 'react' import { Route , Switch } from 'react-router-dom' import Home from './Components/Home/home' class...

TDD with React Native using Jest and Enzyme using latest versions

Image
By the time I am writing this post, after a lots of search I did not find a unit testing document which will guide me step by step. This article is for my own future reference too. So here are the steps I followed : Start a new react-native project , using command : react-native init  ReactNativeTDDStarterKit This command will create a project for you. Now go to the application path cd    ReactNativeTDDStarterKit Use command react-native run-android , to check whether project is running fine After build is successful you will see build success message. Initially package.json will look like this : { "name": "ReactNativeTDDStarterKit" , "version": "0.0.1" , "private": true , "scripts": { "start": "node node_modules/react-native/local-cli/cli.js start" , "test": "jest" }, "dependencies": { "react": "16.8.3" , ...