Initial commit

.commitlintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": ["@commitlint/config-conventional"]
+}

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true

.eslintignore

@@ -0,0 +1,4 @@
+node_modules
+dist
+coverage
+.eslintcache

.eslintrc.json

@@ -0,0 +1,39 @@
+{
+  "extends": [
+    "eslint:recommended",
+    "plugin:import/recommended",
+    "plugin:jsx-a11y/recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended",
+    "prettier"
+  ],
+  "overrides": [
+    {
+      // enable eslint-plugin-testing-library rules or preset only for matching files!
+      "files": ["**/__tests__/**/*.[jt]s?(x)", "**/?(*.)+(spec|test).[jt]s?(x)"],
+      "extends": ["plugin:jest/recommended", "plugin:jest-dom/recommended", "plugin:testing-library/react"]
+    },
+    {
+      "files": ["**/*.ts?(x)"],
+      "parser": "@typescript-eslint/parser",
+      "extends": ["plugin:@typescript-eslint/recommended", "plugin:import/typescript"]
+    }
+  ],
+  "rules": {
+    // for testing if eslint works properly,
+    // feel free to remove this if you do not need it
+    "import/no-unused-modules": [1, { "unusedExports": true }]
+  },
+  "settings": {
+    "import/parsers": {
+      "@typescript-eslint/parser": [".ts", ".tsx"]
+    },
+    "import/resolver": {
+      "typescript": {}
+    },
+    "react": {
+      "version": "detect"
+    }
+  }
+}

.github/workflows/codeql-analysis.yml

@@ -0,0 +1,70 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+#
+# ******** NOTE ********
+# We have attempted to detect the languages in your repository. Please check
+# the `language` matrix defined below to confirm you have the correct set of
+# supported CodeQL languages.
+#
+name: 'CodeQL'
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [main]
+  schedule:
+    - cron: '19 13 * * 0'
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+
+    strategy:
+      fail-fast: false
+      matrix:
+        language: ['javascript']
+        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
+        # Learn more about CodeQL language support at https://git.io/codeql-language-support
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+
+      # Initializes the CodeQL tools for scanning.
+      - name: Initialize CodeQL
+        uses: github/codeql-action/init@v1
+        with:
+          languages: ${{ matrix.language }}
+          # If you wish to specify custom queries, you can do so here or in a config file.
+          # By default, queries listed here will override any specified in a config file.
+          # Prefix the list here with "+" to use these queries and those in the config file.
+          # queries: ./path/to/local/query, your-org/your-repo/queries@main
+
+      # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+      # If this step fails, then you should remove it and run the build manually (see below)
+      - name: Autobuild
+        uses: github/codeql-action/autobuild@v1
+
+      # ℹ️ Command-line programs to run using the OS shell.
+      # 📚 https://git.io/JvXDl
+
+      # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
+      #    and modify them (or add more) to build your code if your project
+      #    uses a compiled language
+
+      #- run: |
+      #   make bootstrap
+      #   make release
+
+      - name: Perform CodeQL Analysis
+        uses: github/codeql-action/analyze@v1

.gitignore

@@ -0,0 +1,9 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
+coverage
+.eslintcache
+pnpm-lock.yaml
+*.log

.husky/commit-msg

@@ -0,0 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+pnpm exec commitlint --edit
+pnpm exec commitlint --edit $1

.husky/pre-commit

@@ -0,0 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+pnpm test
+pnpm exec lint-staged

.lintstagedrc.json

@@ -0,0 +1,3 @@
+{
+  "*.{tsx,ts}": ["eslint --cache --max-warnings=0 ./src", "prettier --write --ignore-unknown ."]
+}

.prettierignore

@@ -0,0 +1,5 @@
+node_modules
+dist
+coverage
+.eslintcache
+pnpm-lock.yaml

.prettierrc.json

@@ -0,0 +1,19 @@
+{
+  "printWidth": 100,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": true,
+  "singleQuote": true,
+  "quoteProps": "as-needed",
+  "jsxSingleQuote": false,
+  "trailingComma": "es5",
+  "bracketSpacing": true,
+  "bracketSameLine": false,
+  "arrowParens": "always",
+  "requirePragma": false,
+  "insertPragma": false,
+  "proseWrap": "preserve",
+  "htmlWhitespaceSensitivity": "css",
+  "endOfLine": "lf",
+  "embeddedLanguageFormatting": "auto"
+}

.vscode/extensions.json

@@ -0,0 +1,10 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "csstools.postcss",
+    "bradlc.vscode-tailwindcss",
+    "orta.vscode-jest",
+    "editorconfig.editorconfig"
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,7 @@
+{
+  "editor.tabSize": 2,
+  "editor.formatOnSaveMode": "modificationsIfAvailable",
+  "editor.formatOnSave": true,
+  "prettier.documentSelectors": ["*.{tsx,ts}", "*.{jsx,js}"],
+  "editor.defaultFormatter": "esbenp.prettier-vscode"
+}

README.md

@@ -0,0 +1,99 @@
+# Drop-in Replacement for [CRA](http://create-react-app.dev/) but powered by [Vite](https://vitejs.dev/)
+
+### Things in CRA, supported here:
+- Import SVG's directly as React Component via SVGR
+- Unit Testing via Jest & React Testing Library
+- ESLint Rules & Prettier
+- Tailwind
+- Absolute imports within `src` directory
+
+---
+
+### Extra Additions
+- Conventional Commits using `Commitlint`
+- Run Lint Checks, TS Checks, Formatting & Unit Tests  in Pre-commit via `lintstaged` & `husky`
+
+---
+
+### Usage (with [degit](https://github.com/Rich-Harris/degit))
+```bash
+degit uchihamalolan/vite-react-ts your-app-name
+```
+
+---
+
+### Tech Stack - Overview
+- Vite
+- React - Typscript
+  - react-error-boundary
+- pnpm
+
+---
+
+### Editor Config
+
+- vscode settings & extension recommendations
+- `.editorconfig` file
+
+---
+
+### Lint and Formatting
+- Eslint & Prettier Configured
+- Lints
+  - react
+  - react hooks
+  - typescript
+  - jsx-a11y
+
+---
+
+### Testing
+- Jest + React Testing Library (plus some plugins)
+
+---
+
+### Styling
+- TailwindCSS v3
+
+---
+
+# Other Recommended Libraries:
+
+### Forms
+- React Hook Form
+- Zod (for validations)
+
+### CSS-in-js
+- Emotion
+- Complie Time Atomic CSS-in-Js
+  - Stylex (Facebook, not Open Source yet)
+  - Linaria
+  - Compiled (still in beta)
+
+### Routing
+- React-Router-Dom
+- React Location
+
+### Date Manipulation
+- Dayjs
+- date-fns
+- Luxon
+
+### HTTP Client
+- Ky
+- Axios
+
+### Global Store (full-blown / lite-version)
+- Redux Toolkit / Zustand
+- Recoil / Jotai
+- Mobx / Valtio
+- xstate / robot
+
+### Server State
+- React Query
+- SWR
+- RTKQuery
+
+<!-- ### Eslint Plugins
+- [eslint-plugin-jest-dom](https://testing-library.com/docs/ecosystem-eslint-plugin-jest-dom)
+- [typescript-eslint](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin) -->

SECURITY.md

@@ -0,0 +1,14 @@
+# Security Policy
+
+## Supported Versions
+
+All versions are supported, since I did not do versioning anyways as this is just a template repository
+
+| Version | Supported          |
+| ------- | ------------------ |
+| x.x.x   | :white_check_mark: |
+
+## Reporting a Vulnerability
+
+This is just a Template Repository, So no possible vulnerabilities there to report.
+If any such is found pertaining to Project Configurations, an issue can be created.

index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="description" content="React Typescript Starter Template with Vite" />
+    <link rel="icon" type="image/svg+xml" href="/icons/favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite App</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

jest.config.js

@@ -0,0 +1,11 @@
+/** @type {import('ts-jest/dist/types').InitialOptionsTsJest} */
+// eslint-disable-next-line no-undef
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
+  coverageDirectory: 'coverage',
+  coverageProvider: 'v8',
+  extensionsToTreatAsEsm: ['.ts', '.tsx'],
+  moduleDirectories: ['node_modules', './src'],
+  rootDir: './src',
+};

license

@@ -0,0 +1,9 @@
+MIT License
+
+Copyright (c) Malolan Balaji <uchihamalolan@gmail.com>
+
+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.