initial

Author: dev-muhammad-adel

.editorconfig

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

.eslintignore

@@ -0,0 +1,5 @@
+build/
+dist/
+node_modules/
+.snapshots/
+*.min.js

.eslintrc

@@ -0,0 +1,34 @@
+{
+  "root": true,
+  "extends": [
+    "prettier",
+    "plugin:prettier/recommended",
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:@typescript-eslint/eslint-recommended",
+    "plugin:@typescript-eslint/recommended"
+  ],
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["@typescript-eslint", "prettier", "react", "react-hooks"],
+  "rules": {
+    "react-hooks/rules-of-hooks": "error",
+    "no-debugger": "off",
+    "no-useless-escape": "off",
+    "react-hooks/exhaustive-deps": "warn",
+    "@typescript-eslint/no-non-null-assertion": "off",
+    "@typescript-eslint/ban-ts-comment": "off",
+    "@typescript-eslint/no-explicit-any": "off"
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "env": {
+    "browser": true,
+    "node": true
+  },
+  "globals": {
+    "JSX": true
+  }
+}

.gitignore

@@ -0,0 +1,3 @@
+node_modules
+dist
+yarn-error.logs

.prettierrc.json

@@ -0,0 +1,10 @@
+{
+  "bracketSpacing": true,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "tabWidth": 2,
+  "semi": false,
+  "printWidth": 120,
+  "jsxSingleQuote": true,
+  "endOfLine": "auto"
+}

LICENSE

@@ -0,0 +1,21 @@
+# React Router Filebased
+
+Copyright (c) 2023 Mohamed Hussien
+
+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.

README.md

@@ -0,0 +1,67 @@
+# react-router-filebased
+
+## About React-Router-Filebased
+
+React-Router-Filebased is a lightweight npm package designed to simplify your React application's routing process. This package is built on top of the popular React Router Dom v6 library and includes file-based routing with lazy loading capabilities, making it easier to manage your application's routes.
+
+With React-Router-Filebased, you can create routes directly from your file structure. This means you can organize your components and routes in a logical way that makes sense for your application. In addition, the package supports lazy loading, so your components and routes will only be loaded when they are needed, reducing the initial load time of your application.
+
+## Install
+
+```bash
+cd project-name
+npm install --save react-router-filebased
+mkdir src/pages
+```
+
+## Usage
+
+```tsx
+// src/App.tsx
+import React from 'react'
+import FileBasedProvider from 'react-router-filebased'
+
+function App() {
+  return <FileBasedProvider />
+}
+export default App
+```
+
+```tsx
+// src/pages/index.tsx
+import React from 'react'
+
+function Home() {
+  return <h1>Home Page</h1>
+}
+export default Home
+```
+
+```tsx
+// src/pages/[id].tsx
+import React from 'react'
+import { useParams } from 'react-router-dom'
+
+function DynamicRoute() {
+  const { id } = useParams()
+  return <h1>DynamicRoute with id : {id}</h1>
+}
+export default DynamicRoute
+```
+
+```tsx
+// src/pages/layout.tsx
+import React, { ReactNode } from 'react'
+
+type Props = {
+  children: ReactNode
+}
+function RootLayout({ children }: Props) {
+  return <div>{children}</div>
+}
+export default RootLayout
+```
+
+## License
+
+MIT © [dev-mohamed-hussien](https://github.com/dev-mohamed-hussien)

jestconfig.json

@@ -0,0 +1,15 @@
+{
+    "transform": {
+        "^.+\\.(t|j)sx?$": "ts-jest"
+    },
+    "testRegex": "(/tests/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
+    "moduleFileExtensions": [
+        "ts",
+        "tsx",
+        "js",
+        "jsx",
+        "json",
+        "node"
+    ],
+    "testEnvironment": "jsdom"
+}