init commitHEADmaster

7 files changed, 54 insertions, 57 deletions

diff --git a/src/App.js b/src/App.js
index 3784575..a650d85 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,25 +1,28 @@
-import logo from './logo.svg';
-import './App.css';
+import React from 'react';
+import main from './services/main';
 
 function App() {
+  const [count, setCount] = React.useState(0);
+  React.useEffect(() => {
+    async function fetchCount() {
+      const newCount = (await main.get()).data.count;
+      setCount(newCount);
+    }
+    fetchCount();
+  }, [setCount]);
   return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>src/App.js</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
+    <div className='App'>
+      <header className='App-header'>
+        <h4>{count}</h4>
+        <button
+          onClick={async () => {
+            setCount((await main.increment()).data.count);
+          }}
         >
-          Learn React
-        </a>
+          Increment
+        </button>
       </header>
     </div>
   );
 }
-
 export default App;
diff --git a/src/App.test.js b/src/App.test.js
deleted file mode 100644
index 1f03afe..0000000
--- a/src/App.test.js
+++ /dev/null
@@ -1,8 +0,0 @@
-import { render, screen } from '@testing-library/react';
-import App from './App';
-
-test('renders learn react link', () => {
-  render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
-});
diff --git a/src/index.js b/src/index.js
index d563c0f..7887dee 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,17 +1,19 @@
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import './index.css';
-import App from './App';
-import reportWebVitals from './reportWebVitals';
+const express = require('express');
+const app = express();
+const port = 5001;
 
-const root = ReactDOM.createRoot(document.getElementById('root'));
-root.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);
+let count = 0;
 
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();
+app.get('/api', (req, res) => {
+  // res.send('Hello World!');
+  res.json({ count });
+});
+
+app.post('/api', (req, res) => {
+  ++count;
+  res.json({ count });
+});
+
+app.listen(port, () => {
+  console.log(`listen server on http://localhost:${port}`);
+});
diff --git a/src/reportWebVitals.js b/src/reportWebVitals.js
deleted file mode 100644
index 5253d3a..0000000
--- a/src/reportWebVitals.js
+++ /dev/null
@@ -1,13 +0,0 @@
-const reportWebVitals = onPerfEntry => {
-  if (onPerfEntry && onPerfEntry instanceof Function) {
-    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
-      getCLS(onPerfEntry);
-      getFID(onPerfEntry);
-      getFCP(onPerfEntry);
-      getLCP(onPerfEntry);
-      getTTFB(onPerfEntry);
-    });
-  }
-};
-
-export default reportWebVitals;
diff --git a/src/services/main.js b/src/services/main.js
new file mode 100644
index 0000000..198a3d4
--- /dev/null
+++ b/src/services/main.js
@@ -0,0 +1,8 @@
+import axios from 'axios';
+const baseURL = 'http://localhost:5001/api';
+export const get = async () => await axios.get(`${baseURL}/`);
+export const increment = async () => await axios.post(`${baseURL}/`);
+export default {
+  get,
+  increment,
+};
diff --git a/src/setupProxy.js b/src/setupProxy.js
new file mode 100644
index 0000000..240bdd2
--- /dev/null
+++ b/src/setupProxy.js
@@ -0,0 +1,10 @@
+const { createProxyMiddleware } = require('http-proxy-middleware');
+module.exports = function (app) {
+  app.use(
+    '/api',
+    createProxyMiddleware({
+      target: 'http://localhost:5001',
+      changeOrigin: true,
+    })
+  );
+};
diff --git a/src/setupTests.js b/src/setupTests.js
deleted file mode 100644
index 8f2609b..0000000
--- a/src/setupTests.js
+++ /dev/null
@@ -1,5 +0,0 @@
-// jest-dom adds custom jest matchers for asserting on DOM nodes.
-// allows you to do things like:
-// expect(element).toHaveTextContent(/react/i)
-// learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom';