From dd0144f0f3e49c30727427e01383697bbe044664 Mon Sep 17 00:00:00 2001 From: Sehyun Chung Date: Mon, 1 May 2023 02:02:02 +0900 Subject: [PATCH 01/11] re-init with vite + tailwind --- .eslintrc.cjs | 14 + .gitignore | 42 +- .tool-versions | 1 + index.html | 13 + package.json | 29 +- packages/react-native-web/.eslintrc.js | 17 - packages/react-native-web/LICENSE | 21 - packages/react-native-web/README.md | 3 - packages/react-native-web/craco.config.js | 6 - packages/react-native-web/package.json | 54 - packages/react-native-web/src/App.test.tsx | 9 - packages/react-native-web/src/App.tsx | 51 - .../react-native-web/src/components/Bpm.tsx | 110 - .../src/components/Footer.tsx | 39 - .../src/components/Header.tsx | 41 - .../react-native-web/src/constants/index.ts | 9 - .../react-native-web/src/core/tapper.test.ts | 38 - packages/react-native-web/src/core/tapper.ts | 35 - packages/react-native-web/src/index.tsx | 11 - packages/react-native-web/src/internal.ts | 7 - .../react-native-web/src/react-app-env.d.ts | 1 - .../react-native-web/src/serviceWorker.ts | 143 - packages/react-native-web/src/store.ts | 3 - packages/react-native-web/tsconfig.json | 26 - pnpm-lock.yaml | 2103 +++ postcss.config.js | 6 + .../public => public}/PetMe128.woff | Bin .../public => public}/favicon-16x16.png | Bin .../public => public}/favicon-32x32.png | Bin .../public => public}/favicon.ico | Bin .../public => public}/icon.svg | 0 .../public => public}/index.html | 0 .../public => public}/logo192.png | Bin .../public => public}/logo512.png | Bin .../public => public}/manifest.json | 0 .../public => public}/robots.txt | 0 public/vite.svg | 1 + src/App.tsx | 12 + src/assets/react.svg | 1 + src/components/BpmCounter.tsx | 17 + src/index.css | 3 + src/lib/bpm.ts | 61 + src/main.tsx | 10 + src/vite-env.d.ts | 1 + tailwind.config.js | 8 + tsconfig.json | 24 + tsconfig.node.json | 10 + vite.config.ts | 7 + yarn.lock | 11610 ---------------- 49 files changed, 2338 insertions(+), 12259 deletions(-) create mode 100644 .eslintrc.cjs create mode 100644 .tool-versions create mode 100644 index.html delete mode 100644 packages/react-native-web/.eslintrc.js delete mode 100644 packages/react-native-web/LICENSE delete mode 100644 packages/react-native-web/README.md delete mode 100644 packages/react-native-web/craco.config.js delete mode 100644 packages/react-native-web/package.json delete mode 100644 packages/react-native-web/src/App.test.tsx delete mode 100644 packages/react-native-web/src/App.tsx delete mode 100644 packages/react-native-web/src/components/Bpm.tsx delete mode 100644 packages/react-native-web/src/components/Footer.tsx delete mode 100644 packages/react-native-web/src/components/Header.tsx delete mode 100644 packages/react-native-web/src/constants/index.ts delete mode 100644 packages/react-native-web/src/core/tapper.test.ts delete mode 100644 packages/react-native-web/src/core/tapper.ts delete mode 100644 packages/react-native-web/src/index.tsx delete mode 100644 packages/react-native-web/src/internal.ts delete mode 100644 packages/react-native-web/src/react-app-env.d.ts delete mode 100644 packages/react-native-web/src/serviceWorker.ts delete mode 100644 packages/react-native-web/src/store.ts delete mode 100644 packages/react-native-web/tsconfig.json create mode 100644 pnpm-lock.yaml create mode 100644 postcss.config.js rename {packages/react-native-web/public => public}/PetMe128.woff (100%) rename {packages/react-native-web/public => public}/favicon-16x16.png (100%) rename {packages/react-native-web/public => public}/favicon-32x32.png (100%) rename {packages/react-native-web/public => public}/favicon.ico (100%) rename {packages/react-native-web/public => public}/icon.svg (100%) rename {packages/react-native-web/public => public}/index.html (100%) rename {packages/react-native-web/public => public}/logo192.png (100%) rename {packages/react-native-web/public => public}/logo512.png (100%) rename {packages/react-native-web/public => public}/manifest.json (100%) rename {packages/react-native-web/public => public}/robots.txt (100%) create mode 100644 public/vite.svg create mode 100644 src/App.tsx create mode 100644 src/assets/react.svg create mode 100644 src/components/BpmCounter.tsx create mode 100644 src/index.css create mode 100644 src/lib/bpm.ts create mode 100644 src/main.tsx create mode 100644 src/vite-env.d.ts create mode 100644 tailwind.config.js create mode 100644 tsconfig.json create mode 100644 tsconfig.node.json create mode 100644 vite.config.ts delete mode 100644 yarn.lock diff --git a/.eslintrc.cjs b/.eslintrc.cjs new file mode 100644 index 0000000..4020bcb --- /dev/null +++ b/.eslintrc.cjs @@ -0,0 +1,14 @@ +module.exports = { + env: { browser: true, es2020: true }, + extends: [ + 'eslint:recommended', + 'plugin:@typescript-eslint/recommended', + 'plugin:react-hooks/recommended', + ], + parser: '@typescript-eslint/parser', + parserOptions: { ecmaVersion: 'latest', sourceType: 'module' }, + plugins: ['react-refresh'], + rules: { + 'react-refresh/only-export-components': 'warn', + }, +} diff --git a/.gitignore b/.gitignore index 5e802e2..a547bf3 100644 --- a/.gitignore +++ b/.gitignore @@ -1,24 +1,24 @@ -# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. - -# dependencies -/node_modules -/packages/*/node_modules -/.pnp -.pnp.js - -# testing -/coverage - -# production -/build - -# misc -.DS_Store -.env.local -.env.development.local -.env.test.local -.env.production.local - +# Logs +logs +*.log npm-debug.log* yarn-debug.log* yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/.tool-versions b/.tool-versions new file mode 100644 index 0000000..52e118f --- /dev/null +++ b/.tool-versions @@ -0,0 +1 @@ +nodejs lts diff --git a/index.html b/index.html new file mode 100644 index 0000000..3b286ba --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + + + + Bipi! + + +
+ + + diff --git a/package.json b/package.json index 16ee0e8..56daeec 100644 --- a/package.json +++ b/package.json @@ -1,10 +1,31 @@ { "name": "bipi", "private": true, - "workspaces": [ - "packages/*" - ], + "version": "0.0.0", + "type": "module", "scripts": { - "@rnw": "yarn workspace @bipi/react-native-web" + "dev": "vite", + "build": "tsc && vite build", + "lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0", + "preview": "vite preview" + }, + "dependencies": { + "react": "^18.2.0", + "react-dom": "^18.2.0" + }, + "devDependencies": { + "@types/react": "^18.0.28", + "@types/react-dom": "^18.0.11", + "@typescript-eslint/eslint-plugin": "^5.57.1", + "@typescript-eslint/parser": "^5.57.1", + "@vitejs/plugin-react": "^4.0.0", + "autoprefixer": "^10.4.14", + "eslint": "^8.38.0", + "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-refresh": "^0.3.4", + "postcss": "^8.4.23", + "tailwindcss": "^3.3.2", + "typescript": "^5.0.2", + "vite": "^4.3.2" } } diff --git a/packages/react-native-web/.eslintrc.js b/packages/react-native-web/.eslintrc.js deleted file mode 100644 index 3144b06..0000000 --- a/packages/react-native-web/.eslintrc.js +++ /dev/null @@ -1,17 +0,0 @@ -module.exports = { - parser: "@typescript-eslint/parser", - extends: [ - "plugin:@typescript-eslint/recommended", - "plugin:react/recommended", - ], - parserOptions: { - ecmaVersion: 2020, - sourceType: "module", - ecmaFeatures: { jsx: true }, - }, - plugins: ["react", "react-hooks"], - rules: { - "react-hooks/rules-of-hooks": "error", - "react-hooks/exhaustive-deps": "warn", - }, -}; diff --git a/packages/react-native-web/LICENSE b/packages/react-native-web/LICENSE deleted file mode 100644 index 9b08146..0000000 --- a/packages/react-native-web/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -MIT License - -Copyright (c) 2019 Sehyun Chung - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. diff --git a/packages/react-native-web/README.md b/packages/react-native-web/README.md deleted file mode 100644 index 0f1ee86..0000000 --- a/packages/react-native-web/README.md +++ /dev/null @@ -1,3 +0,0 @@ -# ๐ŸฅBipi! - -A Simple BPM Tapper PWA diff --git a/packages/react-native-web/craco.config.js b/packages/react-native-web/craco.config.js deleted file mode 100644 index ef720b7..0000000 --- a/packages/react-native-web/craco.config.js +++ /dev/null @@ -1,6 +0,0 @@ -module.exports = { - babel: { - presets: ["@babel/preset-env", "@babel/preset-react"], - plugins: ["@babel/plugin-proposal-class-properties"], - }, -}; diff --git a/packages/react-native-web/package.json b/packages/react-native-web/package.json deleted file mode 100644 index 468d50d..0000000 --- a/packages/react-native-web/package.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "name": "@bipi/react-native-web", - "version": "0.1.0", - "private": true, - "dependencies": { - "@babel/plugin-proposal-class-properties": "^7.12.13", - "@craco/craco": "^6.1.1", - "@types/jest": "26.0.20", - "@types/node": "14.14.27", - "@types/react": "^17.0.2", - "@types/react-dom": "17.0.1", - "@types/react-native": "^0.63.48", - "jotai": "^0.14.0", - "react": "^17.0.1", - "react-device-detect": "^1.11.14", - "react-dom": "^17.0.1", - "react-native-swipe-gestures": "^1.0.5", - "react-native-web": "^0.15.0", - "react-scripts": "4.0.2", - "react-spring": "^9.0.0-rc.3", - "scheduler": "^0.20.1", - "typescript": "4.1.5" - }, - "scripts": { - "start": "craco start", - "build": "craco build", - "test": "craco test", - "eject": "react-scripts eject" - }, - "eslintConfig": { - "extends": "react-app" - }, - "browserslist": { - "production": [ - ">0.2%", - "not dead", - "not op_mini all" - ], - "development": [ - "last 1 chrome version", - "last 1 firefox version", - "last 1 safari version" - ] - }, - "devDependencies": { - "@babel/preset-react": "^7.12.13", - "@typescript-eslint/eslint-plugin": "^4.15.0", - "@typescript-eslint/parser": "^4.15.0", - "babel-plugin-react-native-web": "^0.15.0", - "eslint": "^7.20.0", - "eslint-plugin-react": "^7.22.0", - "eslint-plugin-react-hooks": "^4.2.0" - } -} diff --git a/packages/react-native-web/src/App.test.tsx b/packages/react-native-web/src/App.test.tsx deleted file mode 100644 index 4bf1935..0000000 --- a/packages/react-native-web/src/App.test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react' -import ReactDOM from 'react-dom' -import App from './App' - -it('renders without crashing', () => { - const div = document.createElement('div') - ReactDOM.render(, div) - ReactDOM.unmountComponentAtNode(div) -}) diff --git a/packages/react-native-web/src/App.tsx b/packages/react-native-web/src/App.tsx deleted file mode 100644 index 68e5af9..0000000 --- a/packages/react-native-web/src/App.tsx +++ /dev/null @@ -1,51 +0,0 @@ -import React, { useEffect, useLayoutEffect } from "react"; -import { View, StyleSheet, Dimensions, ScaledSize } from "react-native"; -import { Provider, useAtom } from "jotai"; - -import Header from "./components/Header"; -import Bpm from "./components/Bpm"; -import Footer from "./components/Footer"; - -import { BACKGROUND_COLOR, dimensionsAtom } from "./internal"; - -function Bipi() { - const [dimensions, setDimensions] = useAtom(dimensionsAtom); - - const appStyle = StyleSheet.create({ - app: { - position: "absolute", - height: dimensions.height, - backgroundColor: BACKGROUND_COLOR, - }, - }); - - useLayoutEffect(() => { - const { width, height } = Dimensions.get("window"); - setDimensions(() => ({ width, height })); - - const listener = ({ window }: { window: ScaledSize }) => { - setDimensions(() => ({ height: window.height, width: window.width })); - }; - Dimensions.addEventListener("change", listener); - - return () => { - Dimensions.removeEventListener("change", listener); - }; - }, []); - - return ( - -
- -