Prabhu Sunderaraman

Read the full article on DuraSoft, here: http://durasoftindia.com/blogposts/reactjs_redux_demo_app_3.html

In the previous post, we discussed the React Components to display the jobs list. The JobsList component calls the this.props.loadJobs() method when mounted. The Redux magic is woven inside in this method.

The following things happen during the invocation of loadJobs() method

• Fetch the job postings from the server
• Pass the job postings JSON to the jobsReducer
• The jobsReducer modifies the state with the job postings

The loadJobs() method is shown below.

const mapDispatchToProps = dispatch => {
	const request = axios.get('/load/jobs')
	request.then(response => {
		let payload = response.data
		dispatch({
			type: "LOAD_JOBS_SUCCESS", payload
		})
	})
	request.catch(error => {
		dispatch({
			type: "LOAD_JOBS_ERROR", error: error
		})
	})
	return {
		loadJobs: () => request
	}
}
				

Continued at the link above.

Read the full article on DuraSoft, here: http://durasoftindia.com/blogposts/reactjs_redux_demo_app_1.html

In the last two years, we have been working substantially with React JS. One of our ongoing projects, involves displaying plenty of records after search. The user manipulates these records by editing, deleting, sorting etc. Earlier, we used plain CoffeeScript with jQuery for this. When we started building this application, data size was small and things were lot more under our control. But as it grew, we could see obvious dip in the overall performance. The page rendering was slow, the manipulation became slower with time.

It was one of those late night working sessions, we took a decision to rewrite the whole application, using React JS. We first started to rewrite the pages that dealt with of lot of data. And now things are more under control, with most parts of the application using React JS.

Oh! Wait a sec!!! We used plain React JS with Rails, using react-rails gem. But things started getting messy when the data started flowing all over the places. And the data manipulation code was present everywhere haphazardly. So, React JS also started giving us problems, if not implemented properly. That’s where Redux came to the rescue.

Continued at the link above.