Repository files navigation

My own redux implementation with typescript. Integrated this technology into react app to show how it works in real project.

• createStore(subscribe, unsubscribe, getState, dispatch)
• useSelector
• useDispatch
• reducer
• persist
• logger
• Anti-rerender logic (redux prevState and current state comparison)

Store is created bycreateStore function. Store is a state keeper.useSelector is used to subscribe on store to see state changes. If required state field is changed, react component whereuseSelector is called will be re-rendered. You can find all this custom redux logic inmyOwnRedux folder.

This is howuseSelector logic looks like:

constuseSelector=(selector:SelectorCallback)=>{const[state,setState]=useState<State>({});useEffect(()=>{constselectedState=selector(store.getState());setState(selectedState);constunsubscribe=store.subscribe((previousState,currentState)=>{constprevState=selector(previousState);constnewState=selector(currentState);// Anti-Rerender logicconststateHasBeenChanged=!isEqual(prevState,newState);if(stateHasBeenChanged){setState(newState);}});return()=>{unsubscribe();};},[]);returnstate;};

1. npm install - install all dependencies
2. npm start - start a project

• React
• Typescript