From 9cb721ac7d651fa1f1246e55edde81bec657f075 Mon Sep 17 00:00:00 2001 From: overflowerror Date: Sat, 14 Aug 2021 23:16:07 +0200 Subject: [PATCH] added boilerplate react app --- frontend/.gitignore | 25 +++++++++++++++++++ frontend/package.json | 43 +++++++++++++++++++++++++++++++++ frontend/public/index.html | 11 +++++++++ frontend/public/robots.txt | 3 +++ frontend/src/App.css | 0 frontend/src/App.test.tsx | 9 +++++++ frontend/src/App.tsx | 12 +++++++++ frontend/src/index.css | 0 frontend/src/index.tsx | 17 +++++++++++++ frontend/src/react-app-env.d.ts | 1 + frontend/src/reportWebVitals.ts | 15 ++++++++++++ frontend/src/setupTests.ts | 5 ++++ frontend/tsconfig.json | 26 ++++++++++++++++++++ 13 files changed, 167 insertions(+) create mode 100644 frontend/.gitignore create mode 100644 frontend/package.json create mode 100644 frontend/public/index.html create mode 100644 frontend/public/robots.txt create mode 100644 frontend/src/App.css create mode 100644 frontend/src/App.test.tsx create mode 100644 frontend/src/App.tsx create mode 100644 frontend/src/index.css create mode 100644 frontend/src/index.tsx create mode 100644 frontend/src/react-app-env.d.ts create mode 100644 frontend/src/reportWebVitals.ts create mode 100644 frontend/src/setupTests.ts create mode 100644 frontend/tsconfig.json diff --git a/frontend/.gitignore b/frontend/.gitignore new file mode 100644 index 0000000..ce35fc6 --- /dev/null +++ b/frontend/.gitignore @@ -0,0 +1,25 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# production +/build + +# misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local + +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +yarn.lock \ No newline at end of file diff --git a/frontend/package.json b/frontend/package.json new file mode 100644 index 0000000..35bee31 --- /dev/null +++ b/frontend/package.json @@ -0,0 +1,43 @@ +{ + "name": "frontend", + "version": "0.1.0", + "private": true, + "dependencies": { + "@testing-library/jest-dom": "^5.11.4", + "@testing-library/react": "^11.1.0", + "@testing-library/user-event": "^12.1.10", + "@types/jest": "^26.0.15", + "@types/node": "^12.0.0", + "@types/react": "^17.0.0", + "@types/react-dom": "^17.0.0", + "react": "^17.0.2", + "react-dom": "^17.0.2", + "react-scripts": "4.0.3", + "typescript": "^4.1.2", + "web-vitals": "^1.0.1" + }, + "scripts": { + "start": "react-scripts start", + "build": "react-scripts build", + "test": "react-scripts test", + "eject": "react-scripts eject" + }, + "eslintConfig": { + "extends": [ + "react-app", + "react-app/jest" + ] + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + } +} diff --git a/frontend/public/index.html b/frontend/public/index.html new file mode 100644 index 0000000..fe99e0d --- /dev/null +++ b/frontend/public/index.html @@ -0,0 +1,11 @@ + + + + + React App + + + +
+ + diff --git a/frontend/public/robots.txt b/frontend/public/robots.txt new file mode 100644 index 0000000..e9e57dc --- /dev/null +++ b/frontend/public/robots.txt @@ -0,0 +1,3 @@ +# https://www.robotstxt.org/robotstxt.html +User-agent: * +Disallow: diff --git a/frontend/src/App.css b/frontend/src/App.css new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/App.test.tsx b/frontend/src/App.test.tsx new file mode 100644 index 0000000..14b0140 --- /dev/null +++ b/frontend/src/App.test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import {render, screen} from '@testing-library/react'; +import App from './App'; + +test('renders learn react link', () => { + render(); + const linkElement = screen.getByText(/learn react/i); + expect(linkElement).toBeInTheDocument(); +}); diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx new file mode 100644 index 0000000..3bf8def --- /dev/null +++ b/frontend/src/App.tsx @@ -0,0 +1,12 @@ +import React from 'react'; +import './App.css'; + +function App() { + return ( +
+

Hi

+
+ ); +} + +export default App; diff --git a/frontend/src/index.css b/frontend/src/index.css new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx new file mode 100644 index 0000000..ef2edf8 --- /dev/null +++ b/frontend/src/index.tsx @@ -0,0 +1,17 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import './index.css'; +import App from './App'; +import reportWebVitals from './reportWebVitals'; + +ReactDOM.render( + + + , + document.getElementById('root') +); + +// 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(); diff --git a/frontend/src/react-app-env.d.ts b/frontend/src/react-app-env.d.ts new file mode 100644 index 0000000..6431bc5 --- /dev/null +++ b/frontend/src/react-app-env.d.ts @@ -0,0 +1 @@ +/// diff --git a/frontend/src/reportWebVitals.ts b/frontend/src/reportWebVitals.ts new file mode 100644 index 0000000..16ffde3 --- /dev/null +++ b/frontend/src/reportWebVitals.ts @@ -0,0 +1,15 @@ +import {ReportHandler} from 'web-vitals'; + +const reportWebVitals = (onPerfEntry?: ReportHandler) => { + 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/frontend/src/setupTests.ts b/frontend/src/setupTests.ts new file mode 100644 index 0000000..b28b910 --- /dev/null +++ b/frontend/src/setupTests.ts @@ -0,0 +1,5 @@ +// 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'; \ No newline at end of file diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json new file mode 100644 index 0000000..a273b0c --- /dev/null +++ b/frontend/tsconfig.json @@ -0,0 +1,26 @@ +{ + "compilerOptions": { + "target": "es5", + "lib": [ + "dom", + "dom.iterable", + "esnext" + ], + "allowJs": true, + "skipLibCheck": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "noFallthroughCasesInSwitch": true, + "module": "esnext", + "moduleResolution": "node", + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react-jsx" + }, + "include": [ + "src" + ] +}