Initialize Project

Author: amitjimiwal

.eslintrc.cjs

@@ -0,0 +1,18 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['react-refresh'],
+  rules: {
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+  },
+}

.github/workflows/main.yml

@@ -0,0 +1,42 @@
+# This is a basic workflow to help you get started with Actions
+name: CI-CD
+
+# Controls when the action will run.
+on:
+  # Triggers the workflow on push or pull request events but only for the main branch
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+  # # Allows you to run this workflow manually from the Actions tab
+  # workflow_dispatch:
+
+# A workflow run is made up of one or more jobs that can run sequentially or in parallel
+jobs:
+  # This workflow contains multiple jobs
+  build_test:
+    # The type of runner that the job will run on
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [14.x]
+
+    # Steps represent a sequence of tasks that will be executed as part of the job
+    steps:
+      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
+      - uses: actions/checkout@v2
+
+      - name: setup node
+        uses: actions/setup-node@master
+        with:
+          node-version: ${{ matrix.node-version }}
+
+      # install applicaion dependencies
+      - name: Install dependencies
+        run: |
+          npm install
+      # build and test the apps
+      - name: build
+        run: |
+          npm run build
+          npm test

.gitignore

@@ -0,0 +1,24 @@
+# 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?

README.md

@@ -0,0 +1,74 @@
+
+# React-TypeScript Testing Library and Tailwind CSS Template
+
+Unlike Create-React-App, Vite doesnt come by default with Testing Library, Jest setup with it . So, this repository can help you out in quickly getting started.
+
+
+## Features
+
+- **[React](https://react.dev)**: A popular JavaScript library for building user interfaces.
+- **[Typescript](https://www.typescriptlang.org/)**: A typed superset of JavaScript that helps catch errors early and improve code quality.
+- **[Jest](https://jestjs.io/)**: A testing utility for writing unit and integration tests with a user-centric approach.
+- **[React-Testing-Library](https://testing-library.com/)**: A testing library for React for writing unit and integration tests with a user-centric approach.
+- **[Tailwind](https://tailwindcss.com/)**: A utility-first CSS framework for rapidly building custom designs.
+
+## Getting Started
+Follow these steps to set up a new project based on this template:
+
+1. Click the "Use this template" button on this repository to create a new repository using this template.
+
+2. Clone your newly created repository to your local machine:
+
+   ```bash
+   git clone https://github.com/amitjimiwal/React-ts-jest-template.git
+   ```
+
+3. Navigate to the project directory:
+
+   ```bash
+   cd your-project-name
+   ```
+
+4. Install dependencies:
+
+   ```bash
+   npm install
+   ```
+
+5. Start the development server:
+
+   ```bash
+   npm run dev
+   ```
+
+6. Open your browser and visit `http://localhost:5173` to see your app in action.
+
+## Contributing
+
+Contributions to improve this template are welcome! If you find any issues or have suggestions for enhancements, feel free to open an issue or submit a pull request.
+
+1. Fork the repository.
+
+2. Create a new branch:
+
+   ```bash
+   git checkout -b feature/your-feature-name
+   ```
+
+3. Make your changes and commit them:
+
+   ```bash
+   git commit -m "Add your changes"
+   ```
+
+4. Push your changes to your forked repository:
+
+   ```bash
+   git push origin feature/your-feature-name
+   ```
+
+5. Open a pull request against the `main` branch of this repository.
+
+## License
+
+This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.

__tests__/Sampletest.test.tsx

@@ -0,0 +1,8 @@
+import {render} from '@testing-library/react';
+import React from 'react';
+import App from '../src/App';
+
+test('jest running', () => {
+  render(<App />);
+  expect(true).toBe(true)
+});

babel.config.cjs

@@ -0,0 +1,15 @@
+// eslint-disable-next-line no-undef
+module.exports = {
+  presets: [
+    [
+      "@babel/preset-env",
+      {
+        targets: {
+          node: "current",
+        },
+      },
+    ],
+    "@babel/preset-react",
+    "@babel/preset-typescript",
+  ],
+};

index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React + TS</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

jest-setup.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';