Skip to content

Instantly share code, notes, and snippets.

@ma-9
Last active December 11, 2019 13:27
Show Gist options
  • Save ma-9/0b431ec1f6a766146083abd94a82fa11 to your computer and use it in GitHub Desktop.
Save ma-9/0b431ec1f6a766146083abd94a82fa11 to your computer and use it in GitHub Desktop.
Follow these steps to implement Redux in your application

Lets Install Redux in your application step-by-step

First Install Redux

Always remember these three things:

Store.js (in Main Src Folder)

Actions (Src/Actions/...)

Reducers (Src/Reducers/...)

// actions
import axios from 'axios';
import { setAlert } from './alert';
import { GET_POSTS, POST_ERROR } from './types';
// Get Posts
export const getPosts = () => async dispatch => {
try {
// Write your stuff here
} catch (err) {
// Handle errors
}
}
import { combineReducers } from 'redux';
import alert from './alert';
import auth from './auth';
import profile from './profile';
import post from './post';
export default combineReducers({
alert,
auth,
profile,
post
});
// In Reducers
import { GET_POSTS, POST_ERROR } from '../actions/types';
const initialState = {
posts: [],
post: null,
loading: true,
error: {}
};
export default function(state = initialState, actions) {
const { type, payload } = actions;
switch (type) {
case GET_POSTS:
return {
...state,
posts: payload,
loading: false
};
case POST_ERROR:
return {
...state,
error: payload,
loading: false
};
default:
return state;
}
}
export const SET_ALERT = 'SET_ALERT';
export const REMOVE_ALERT = 'REMOVE_ALERT';
export const REGISTER_SUCCESS = 'REGISTER_SUCCESS';
export const REGISTER_FAIL = 'REGISTER_FAIL';
export const USER_LOADED = 'USER_LOADED';
export const AUTH_ERROR = 'AUTH_ERROR';
export const LOGIN_SUCCESS = 'LOGIN_SUCCESS';
export const LOGIN_FAIL = 'LOGIN_FAIL';
export const LOGOUT = 'LOGOUT';
export const CLEAR_PROFILE = 'CLEAR_PROFILE';
export const GET_PROFILE = 'GET_PROFILE';
export const GET_PROFILES = 'GET_PROFILES';
export const PROFILE_ERROR = 'PROFILE_ERROR';
export const UPDATE_PROFILE = 'UPDATE_PROFILE';
export const ACCOUNT_DELETED = 'ACCOUNT_DELETED';
export const GET_REPOS = 'GET_REPOS';
export const GET_POST = 'GET_POST';
export const POST_ERROR = 'POST_ERROR';
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment