Frontend

In case you missed Part 1, follow this link below   Uploading file into azure blob storage using Azure Keyvault credentials with NodeJS and React - Part 1 So now let's create the UI using reactJS.  Finished app looks like below screenshot, which only has an upload option, you may add other features and fields with validation as you need. Initiate a react app using command : create-react-app sample-azure-client-app Dependency for endpoint call : axios   install via npm i --save axios Create App component import React from 'react'; import UploadImage from './assets/upload.png' import axios from 'axios' const onChange = e => { const files = Array.from(e.target.files) const currentFile = files[0] const formData = new FormData() formData.append('file',currentFile) axios({ url:'http://localhost:3001/upload/file', method:'POST', params:null, data:formData, hea...

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...