Skip to content

Instantly share code, notes, and snippets.

@codecademydev
Created August 22, 2022 10:41
Show Gist options
  • Save codecademydev/5e9f6e1685d4255793a98cec215bb7bc to your computer and use it in GitHub Desktop.
Save codecademydev/5e9f6e1685d4255793a98cec215bb7bc to your computer and use it in GitHub Desktop.
Codecademy export
import React from 'react';
import ReactDOM from 'react-dom';
import { createStore } from 'redux';
// REDUX CODE
///////////////////////////////////
const increment = () => {
return {type: 'increment'}
}
const decrement = () => {
return {type: 'decrement'}
}
const initialState = 0;
const counterReducer = (state = initialState, action) => {
switch (action.type) {
case 'increment':
return state + 1;
case 'decrement':
return state - 1;
default:
return state;
}
}
const store = createStore(counterReducer);
// REACT CODE
///////////////////////////////////
const render = () => {
ReactDOM.render(
<CounterApp
state={store.getState()}
/>,
document.getElementById('root')
)
}
render();
store.subscribe(render);
function CounterApp(props) {
const state = props.state;
const onIncrementButtonClicked = () => {
store.dispatch(increment());
}
const onDecrementButtonClicked = () => {
store.dispatch(decrement());
}
return (
<div>
<h1> {state} </h1>
<button onClick={onIncrementButtonClicked}>+</button>
<button onClick={onDecrementButtonClicked}>-</button>
</div>
)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment