initialized project with, latest nextJs, tailwind, jest, typescript, eslint, husky, and created a DFS visualizer by created a binary tree

Author: AlaminPu1007

.env.example

@@ -0,0 +1,6 @@
+node_modules/
+build/
+coverage/
+*.json
+*.css
+out

.eslintignore

@@ -0,0 +1,65 @@
+/*
+Configure eslint for nextJs
+Read more about it: https://dev.to/azadshukor/setting-up-nextjs-13-with-typescript-eslint-47an
+Read about env : https://eslint.org/docs/latest/use/configure/language-options-deprecated#using-configuration-files
+*/
+{
+    "env": {
+        "browser": true,
+        "node": true,
+        "jest": true
+    },
+    "extends": [
+        "next/core-web-vitals",
+        "eslint:recommended",
+        "plugin:@typescript-eslint/recommended",
+        "plugin:testing-library/react", // for jest unit testing
+        "plugin:jest-dom/recommended" // for jest unit testing
+    ],
+    "parser": "@typescript-eslint/parser",
+    "plugins": ["@typescript-eslint"],
+    "rules": {
+        // Note: you must disable the base rule as it can report incorrect errors
+        // instead we enabled -> @typescript-eslint/no-unused-vars
+        "no-unused-vars": "off",
+        "@typescript-eslint/no-unused-vars": "error",
+        "react/jsx-no-bind": [
+            "error",
+            {
+                "allowArrowFunctions": true,
+                "allowBind": false,
+                "ignoreRefs": true
+            }
+        ],
+        "semi": "error",
+        "prefer-const": "error",
+        "no-console": "warn",
+        "react/no-did-update-set-state": "error",
+        "react/no-unknown-property": "error",
+        "react/no-unused-prop-types": "error",
+        "react/prop-types": "error",
+        "react/react-in-jsx-scope": "off",
+        "react-hooks/rules-of-hooks": "error",
+        "react-hooks/exhaustive-deps": "warn",
+
+        // ES6 and Beyond
+        // "arrow-body-style": ["error", "as-needed"],
+        // "arrow-parens": ["error", "always"],
+        "no-var": "error",
+        "prefer-arrow-callback": "error",
+
+        // Code Readability and Consistency
+        "indent": ["error", 2],
+        // "quotes": ["error", "single", "backtick"],
+        // "camelcase": "error",
+
+        // Error Prevention
+        "no-undef": "error",
+        "eqeqeq": "error",
+        "no-implicit-coercion": "error",
+        "no-unused-expressions": "error",
+        "no-extra-boolean-cast": "error",
+        "no-eval": "error"
+    },
+    "root": true
+}

.eslintrc.json

@@ -0,0 +1,38 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+.env*.production
+.env*.development
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

.gitignore

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npm run format && npm run lint && git add -A . 

.husky/pre-commit.sh

@@ -0,0 +1 @@
+node_modules/ 

.prettierignore

@@ -0,0 +1,10 @@
+{
+    "trailingComma": "es5",
+    "bracketSpacing": true,
+    "endOfLine": "lf",
+    "semi": true,
+    "tabWidth": 2,
+    "singleQuote": true,
+    "jsxSingleQuote": true,
+    "plugins": ["prettier-plugin-tailwindcss"]
+}

.prettierrc.json

@@ -0,0 +1,36 @@
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+
+## Deploy on Vercel
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

README.md

@@ -0,0 +1,14 @@
+/**
+ * Write a test case for home page
+ */
+
+import { render, screen } from '@testing-library/react';
+import Page from '../src/app/page';
+
+describe('Home component', () => {
+  it('Should have a Hello World text', () => {
+    render(<Page />);
+    const getText = screen.getByText('Hello world!');
+    expect(getText).toBeInTheDocument();
+  });
+});

__test__/HomeComponent.test.tsx

@@ -0,0 +1,18 @@
+import type { Config } from 'jest';
+import nextJest from 'next/jest.js';
+
+const createJestConfig = nextJest({
+  // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
+  dir: './',
+});
+
+// Add any custom config to be passed to Jest
+const config: Config = {
+  coverageProvider: 'v8',
+  testEnvironment: 'jsdom',
+  // Add more setup options before each test is run
+  setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
+};
+
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+export default createJestConfig(config);

jest.config.ts

@@ -0,0 +1,22 @@
+/*
+ This file contains common setup logic to be executed before running each test file in Jest.
+  It initializes any necessary configurations, mocks, or environment setups required for testing purposes.
+  Developers can define global setup functions, such as setting up mock modules or configuring test environments,
+  to ensure consistent behavior across all tests in the project.
+ */
+
+import '@testing-library/jest-dom';
+
+// do setup once, for entire other test files also
+//This setup is necessary because IntersectionObserver isn't available in the test environment
+
+beforeAll(() => {
+  // IntersectionObserver isn't available in test environment
+  const mockIntersectionObserver = jest.fn();
+  mockIntersectionObserver.mockReturnValue({
+    observe: () => null,
+    unobserve: () => null,
+    disconnect: () => null,
+  });
+  window.IntersectionObserver = mockIntersectionObserver;
+});

jest.setup.ts

@@ -0,0 +1,4 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {};
+
+export default nextConfig;