diff --git a/.eslintcache b/.eslintcache
deleted file mode 100644
index c777cb3..0000000
--- a/.eslintcache
+++ /dev/null
@@ -1 +0,0 @@
-[{"/Users/masa/WebstormProjects/React.training/src/index.js":"1","/Users/masa/WebstormProjects/React.training/src/App.js":"2","/Users/masa/WebstormProjects/React.training/src/reportWebVitals.js":"3","/Users/masa/WebstormProjects/React.training/src/components/Greet.js":"4","/Users/masa/WebstormProjects/React.training/src/components/Welcome.js":"5","/Users/masa/WebstormProjects/React.training/src/components/MouseContainer.js":"6","/Users/masa/WebstormProjects/React.training/src/components/HookMouse.js":"7","/Users/masa/WebstormProjects/React.training/src/components/InterHookCounter.js":"8","/Users/masa/WebstormProjects/React.training/src/components/HookCounterOne.js":"9"},{"size":500,"mtime":1673772278075,"results":"10","hashOfConfig":"11"},{"size":882,"mtime":1674358110895,"results":"12","hashOfConfig":"11"},{"size":362,"mtime":1673772278075,"results":"13","hashOfConfig":"11"},{"size":730,"mtime":1674284985426,"results":"14","hashOfConfig":"11"},{"size":166,"mtime":1673772278075,"results":"15","hashOfConfig":"11"},{"size":330,"mtime":1673960569680,"results":"16","hashOfConfig":"11"},{"size":731,"mtime":1674358110896,"results":"17","hashOfConfig":"11"},{"size":767,"mtime":1673960569680,"results":"18","hashOfConfig":"11"},{"size":597,"mtime":1674284985427,"results":"19","hashOfConfig":"11"},{"filePath":"20","messages":"21","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"zmx66g",{"filePath":"22","messages":"23","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"24","messages":"25","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"26","messages":"27","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"28","messages":"29","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"30"},{"filePath":"31","messages":"32","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"33","messages":"34","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"35","messages":"36","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"37","messages":"38","errorCount":0,"fatalErrorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"/Users/masa/WebstormProjects/React.training/src/index.js",[],"/Users/masa/WebstormProjects/React.training/src/App.js",["39"],"/Users/masa/WebstormProjects/React.training/src/reportWebVitals.js",[],"/Users/masa/WebstormProjects/React.training/src/components/Greet.js",[],"/Users/masa/WebstormProjects/React.training/src/components/Welcome.js",[],["40","41"],"/Users/masa/WebstormProjects/React.training/src/components/MouseContainer.js",[],"/Users/masa/WebstormProjects/React.training/src/components/HookMouse.js",[],"/Users/masa/WebstormProjects/React.training/src/components/InterHookCounter.js",[],"/Users/masa/WebstormProjects/React.training/src/components/HookCounterOne.js",["42","43"],{"ruleId":"44","severity":1,"message":"45","line":6,"column":8,"nodeType":"46","messageId":"47","endLine":6,"endColumn":17},{"ruleId":"48","replacedBy":"49"},{"ruleId":"50","replacedBy":"51"},{"ruleId":"44","severity":1,"message":"52","line":6,"column":10,"nodeType":"46","messageId":"47","endLine":6,"endColumn":13},{"ruleId":"44","severity":1,"message":"53","line":6,"column":15,"nodeType":"46","messageId":"47","endLine":6,"endColumn":21},"no-unused-vars","'HookMouse' is defined but never used.","Identifier","unusedVar","no-native-reassign",["54"],"no-negated-in-lhs",["55"],"'age' is assigned a value but never used.","'setAge' is assigned a value but never used.","no-global-assign","no-unsafe-negation"]
\ No newline at end of file
diff --git a/src/App.js b/src/App.js
index 329e634..c7fb5a3 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,16 +1,44 @@
-import React from 'react'
+import React, {useReducer} from 'react'
 import './App.css'
 import Greet from './components/Greet'
-import Welcome from "./components/Welcome";
-import Count from "./components/Counter"
+import ComponentA from "./components/ComponentA";
+import ComponentB from "./components/ComponentB";
+import ComponentC from "./components/ComponentC";
+// import Welcome from "./components/Welcome";
+// import Count from "./components/Counter"
+// import Counter from "./components/Counter";
+// import CounterTwo from "./components/CounterTwo";
 
+export const CountContext = React.createContext()
+
+const initialState = 0;
+const reducer = (state, change) => {
+    switch (change) {
+        case 'first':
+            return state + 5
+        case  'second':
+            return state - 5
+        case  'reset' :
+            return initialState
+        default:
+            return state
+    }
+}
 const App = () => {
-  return(
-    <div className="App">
-      <Greet name="Fuck you" age="45"/>
-      <Welcome/>
-      <Count/>
-    </div>
+    const [count, dispatch] =useReducer(reducer, initialState)
+    return (
+        <CountContext.Provider value = {{ countState: count, countDispatch: dispatch}}>
+            <div className="App">
+                <Greet name="Fuck you" age="45"/>
+                {/*<Welcome/>*/}
+                {/*<Count/>*/}
+                {/*<CounterTwo/>*/}
+                Count - {count}
+                <ComponentA/>
+                <ComponentB/>
+                <ComponentC/>
+            </div>
+        </CountContext.Provider>
   )
 }
 export default App;
diff --git a/src/components/ComponentA.js b/src/components/ComponentA.js
new file mode 100644
index 0000000..b049db9
--- /dev/null
+++ b/src/components/ComponentA.js
@@ -0,0 +1,16 @@
+import React, {useContext} from 'react';
+import {CountContext} from "../App";
+
+function ComponentA() {
+    const countContext = useContext(CountContext)
+    return (
+        <div>
+            A - {countContext.countState}
+            <button onClick={() => countContext.countDispatch('first')}>First Button</button>
+            <button onClick={() => countContext.countDispatch('second')}>Second Button</button>
+            <button onClick={() => countContext.countDispatch('reset')}>reset</button>
+        </div>
+    );
+}
+
+export default ComponentA;
\ No newline at end of file
diff --git a/src/components/ComponentB.js b/src/components/ComponentB.js
new file mode 100644
index 0000000..3b26de2
--- /dev/null
+++ b/src/components/ComponentB.js
@@ -0,0 +1,16 @@
+import React, {useContext} from 'react';
+import {CountContext} from "../App";
+
+const ComponentB = () => {
+    const countContext = useContext(CountContext)
+    return (
+        <div>
+            B - {countContext.countState}
+            <button onClick={() => countContext.countDispatch('first')}>First Button</button>
+            <button onClick={() => countContext.countDispatch('second')}>Second Button</button>
+            <button onClick={() => countContext.countDispatch('reset')}>reset</button>
+        </div>
+    );
+};
+
+export default ComponentB;
\ No newline at end of file
diff --git a/src/components/ComponentC.js b/src/components/ComponentC.js
new file mode 100644
index 0000000..490aaa5
--- /dev/null
+++ b/src/components/ComponentC.js
@@ -0,0 +1,12 @@
+import React from 'react';
+import ComponentE from "./ComponentE";
+
+function ComponentC(props) {
+    return (
+        <div>
+            <ComponentE/>
+        </div>
+    );
+}
+
+export default ComponentC;
\ No newline at end of file
diff --git a/src/components/ComponentE.js b/src/components/ComponentE.js
new file mode 100644
index 0000000..a6fd336
--- /dev/null
+++ b/src/components/ComponentE.js
@@ -0,0 +1,18 @@
+import React, {useContext} from 'react';
+import ComponentF from "./ComponentF";
+import {CountContext} from "../App";
+
+const ComponentE = () => {
+    const countContext = useContext(CountContext)
+    return (
+        <div>
+            <ComponentF/>
+            E - {countContext.countState}
+            <button onClick={() => countContext.countDispatch('first')}>First Button</button>
+            <button onClick={() => countContext.countDispatch('second')}>Second Button</button>
+            <button onClick={() => countContext.countDispatch('reset')}>reset</button>
+        </div>
+    );
+};
+
+export default ComponentE;
\ No newline at end of file
diff --git a/src/components/ComponentF.js b/src/components/ComponentF.js
new file mode 100644
index 0000000..d3e3f72
--- /dev/null
+++ b/src/components/ComponentF.js
@@ -0,0 +1,16 @@
+import React, {useContext} from 'react';
+import {CountContext} from "../App";
+
+const ComponentF = () => {
+    const countContext = useContext(CountContext)
+    return (
+        <div>
+            F - {countContext.countState}
+            <button onClick={() => countContext.countDispatch('first')}>First Button</button>
+            <button onClick={() => countContext.countDispatch('second')}>Second Button</button>
+            <button onClick={() => countContext.countDispatch('reset')}>reset</button>
+        </div>
+    );
+};
+
+export default ComponentF;
\ No newline at end of file
diff --git a/src/components/Counter.js b/src/components/Counter.js
index 984a95b..1bf4d92 100644
--- a/src/components/Counter.js
+++ b/src/components/Counter.js
@@ -1,31 +1,29 @@
-import React, {useMemo, useState} from "react";
+import React, {useReducer} from "react";
 
-const Counter = () => {
-  const [count, setCount] = useState(0);
-  const [second, setSecond] = useState(0);
-  const increment = () => {
-    setCount( count + 1);
-  }
-  const twoincrement = () => {
-    setSecond(second +1);
-  }
-  const even = useMemo(() => {
-    let i = 0;
-    while(i<20000) i++
-    return count % 2 === 0
-  }, [count])
-  
-  return(
-    <div>
-      <div>
-        <button onClick={increment}>Count{count}</button>
-        <span>{even ? "Yes" : "No"}</span>
-      </div>
+const initialState = 0;
+
+function Counter() {
+    const reducer = (state, change) => {
+        switch(change) {
+            case 'first':
+                return state + 5
+            case  'second':
+                return state - 5
+            case  'reset' :
+                return  initialState
+            default:
+                return state
+        }
+    }
+  const [count, dispatch] = useReducer(reducer, initialState)
+  return (
       <div>
-        <button onClick={twoincrement}>Pushed{second}</button>
+          <div>Count  {count}</div>
+        <button onClick={() => dispatch('first')}>First Button</button>
+        <button onClick={() => dispatch('second')}>Second Button</button>
+        <button onClick={() => dispatch('reset')}>reset</button>
       </div>
-    </div>
-  )
+  );
 }
 
 export default Counter;
\ No newline at end of file
diff --git a/src/components/CounterTwo.js b/src/components/CounterTwo.js
new file mode 100644
index 0000000..0831035
--- /dev/null
+++ b/src/components/CounterTwo.js
@@ -0,0 +1,43 @@
+import React, {useReducer} from "react";
+
+const initialState = {
+    firstCounter: 0,
+    secondCounter: 10
+};
+
+function CounterTwo() {
+    const reducer = (state, change) => {
+        console.log(state.firstCounter)
+        switch(change.type) {
+            case 'first':
+                return {...state, firstCounter: state.firstCounter + change.value}
+            case 'second':
+                return {...state, firstCounter: state.firstCounter - change.value}
+            case 'reset' :
+                return  {...state, firstCounter: initialState.firstCounter}
+            case 'jumpFirst':
+                return {...state, secondCounter: state.secondCounter + change.value}
+            case 'jumpSecond':
+                return {...state, secondCounter: state.secondCounter - change.value}
+            case 'jumpReset' :
+                return  {...state, secondCounter: initialState.secondCounter}
+            default:
+                return state
+        }
+    }
+    const [count, dispatch] = useReducer(reducer, initialState)
+    return (
+        <div>
+            <div>Count  {count.firstCounter}</div>
+            <button onClick={() => dispatch({type: 'first', value: 1})}>First Button</button>
+            <button onClick={() => dispatch({type: 'second', value: 1})}>Second Button</button>
+            <button onClick={() => dispatch({type: 'reset'})}>reset</button>
+            <div>Count  {count.secondCounter}</div>
+            <button onClick={() => dispatch({type: 'jumpFirst', value: 1})}>First Button</button>
+            <button onClick={() => dispatch({type: 'jumpSecond', value: 1})}>Second Button</button>
+            <button onClick={() => dispatch({type: 'jumpReset'})}>reset</button>
+        </div>
+    );
+}
+
+export default CounterTwo;
\ No newline at end of file
diff --git a/src/components/Greet.js b/src/components/Greet.js
index 7523003..b72c84d 100644
--- a/src/components/Greet.js
+++ b/src/components/Greet.js
@@ -3,7 +3,7 @@ import React from  'react'
 
 const Greet = (props) => {
 
-    return <h1>  Hello {props.name} ! </h1>
+    return <h1>  Hello {props.age} ! </h1>
 }
 
 export default Greet;