chore: project setup

kettei-sproutty · May 12, 2024 · 2d597aa · 2d597aa
commit 2d597aa
Show file tree

Hide file tree

Showing 22 changed files with 2,307 additions and 0 deletions.
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,6 @@
+root = true
+
+[*]
+indent_size = 2
+indent_style = space
+tab_width = 2
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,18 @@
+# Node
+node_modules
+
+# Next
+.next
+out
+
+# Misc
+.DS_Store
+
+# Debug
+.pnpm-debug.log*
+
+# Envs
+.env*.local
+
+# Typescript
+next-env.d.ts
diff --git a/.lefthook/commit-msg/commitlint.sh b/.lefthook/commit-msg/commitlint.sh
@@ -0,0 +1 @@
+echo $(head -n1 $1) | npx commitlint --color
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
@@ -0,0 +1,3 @@
+{
+  "recommendations": ["biomejs.biome", "tailwindcss.intellisense", "tamasfe.even-better-toml"]
+}
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,12 @@
+{
+  "editor.defaultFormatter": "biomejs.biome",
+  "[toml]": {
+    "editor.defaultFormatter": "tamasfe.even-better-toml",
+    "evenBetterToml.taploConfig": "./taplo.toml"
+  },
+  "tailwindCSS.experimental.classRegex": [
+    ["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
+    ["cx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"],
+    ["cn\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
+  ]
+}
diff --git a/LICENSE.md b/LICENSE.md
@@ -0,0 +1,20 @@
+Copyright (c) 2012-2024 `<your name>`
+
+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/README.md b/README.md
@@ -0,0 +1,7 @@
+# NextJS modern starter
+
+This is a modern template for NextJS applications, using:
+- [biome](https://github.com/biomejs/biome/) instead of eslint
+- [lefthook](https://github.com/evilmartians/lefthook) instead of lint-staged
+- [tailwindcss](https://github.com/tailwindlabs/tailwindcss)
+- [commitlint](https://github.com/conventional-changelog/commitlint)
diff --git a/app/globals.css b/app/globals.css
@@ -0,0 +1,16 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/** Explained in the article below
+ * https://adrianroselli.com/2024/03/the-ultimate-ideal-bestest-base-font-size-that-everyone-is-keeping-a-secret-especially-chet.html
+ */
+html {
+  font-size: 100%;
+}
+
+@media print {
+  body {
+    font-size: 8pt;
+  }
+}
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -0,0 +1,21 @@
+import type { Metadata } from 'next'
+import type { PropsWithChildren } from 'react'
+import './globals.css'
+
+export const metadata: Metadata = {
+  title: {
+    default: '<your title>',
+    template: '%s | <your title>',
+  },
+  description: '<your description>',
+}
+
+const RootLayout = ({ children }: PropsWithChildren) => {
+  return (
+    <html lang="en" dir="ltr">
+      <body>{children}</body>
+    </html>
+  )
+}
+
+export default RootLayout
diff --git a/app/not-found.tsx b/app/not-found.tsx
@@ -0,0 +1,9 @@
+const NotFoundPage = () => {
+  return (
+    <div>
+      <h1>404 - Page Not Found</h1>
+    </div>
+  )
+}
+
+export default NotFoundPage
diff --git a/app/page.tsx b/app/page.tsx
@@ -0,0 +1,7 @@
+import { Button } from '@/components/button'
+
+const HomePage = () => {
+  return <Button type="button">Click me</Button>
+}
+
+export default HomePage
diff --git a/app/robots.ts b/app/robots.ts
@@ -0,0 +1,4 @@
+const robots = () => ({
+  rules: [{ userAgent: '*' }],
+  host: 'https://example.com',
+})
diff --git a/biome.json b/biome.json
@@ -0,0 +1,40 @@
+{
+  "$schema": "https://biomejs.dev/schemas/1.7.3/schema.json",
+  "organizeImports": { "enabled": true },
+  "formatter": {
+    "enabled": true,
+    "formatWithErrors": false,
+    "indentStyle": "space",
+    "indentWidth": 2,
+    "lineEnding": "lf",
+    "lineWidth": 100,
+    "attributePosition": "auto"
+  },
+  "linter": {
+    "rules": {
+      "recommended": true,
+      "a11y": { "noBlankTarget": "error" },
+      "correctness": {
+        "noChildrenProp": "error",
+        "useExhaustiveDependencies": "warn",
+        "useHookAtTopLevel": "error",
+        "useJsxKeyInIterable": "error"
+      },
+      "security": { "noDangerouslySetInnerHtml": "error" },
+      "suspicious": { "noCommentText": "error", "noDuplicateJsxProps": "error" }
+    }
+  },
+  "javascript": {
+    "formatter": {
+      "jsxQuoteStyle": "double",
+      "quoteProperties": "asNeeded",
+      "trailingComma": "all",
+      "semicolons": "asNeeded",
+      "arrowParentheses": "always",
+      "bracketSpacing": true,
+      "bracketSameLine": false,
+      "quoteStyle": "single",
+      "attributePosition": "auto"
+    }
+  }
+}
diff --git a/commitlint.config.mjs b/commitlint.config.mjs
@@ -0,0 +1,3 @@
+export default {
+  extends: ['@commitlint/config-conventional'],
+}
diff --git a/components/button.tsx b/components/button.tsx
@@ -0,0 +1,42 @@
+import { type VariantProps, cva } from 'class-variance-authority'
+import type { ButtonHTMLAttributes, PropsWithChildren } from 'react'
+
+const button = cva(['font-semibold', 'border', 'rounded'], {
+  variants: {
+    intent: {
+      primary: ['bg-blue-500', 'text-white', 'border-transparent', 'hover:bg-blue-600'],
+      secondary: ['bg-white', 'text-gray-800', 'border-gray-400', 'hover:bg-gray-100'],
+    },
+    size: {
+      small: ['text-sm', 'py-1', 'px-2'],
+      medium: ['text-base', 'py-2', 'px-4'],
+    },
+  },
+  compoundVariants: [
+    {
+      intent: 'primary',
+      size: 'medium',
+      class: 'uppercase',
+    },
+  ],
+  defaultVariants: {
+    intent: 'primary',
+    size: 'medium',
+  },
+})
+
+type ButtonProps = PropsWithChildren<
+  VariantProps<typeof button> & {
+    type: Exclude<ButtonHTMLAttributes<HTMLButtonElement>[`type`], undefined>
+  }
+>
+
+export const Button = ({ children, intent, size, type }: ButtonProps) => {
+  const classes = button({ intent, size })
+
+  return (
+    <button type={type} className={classes}>
+      {children}
+    </button>
+  )
+}
diff --git a/lefthook.toml b/lefthook.toml
@@ -0,0 +1,13 @@
+[pre-commit]
+parallel = true
+
+[pre-commit.commands.check-js]
+glob = "*.{js,ts,cjs,mjs,d.cts,d.mts,jsx,tsx,json,jsonc,yml,yaml}"
+run = "pnpm biome check --apply --no-errors-on-unmatched --files-ignore-unknown=true {staged_files} && git update-index --again"
+
+[pre-commit.commands.check-toml]
+glob = "*.toml"
+run = "pnpm taplo format {staged_files} && git update-index --again"
+
+[commit-msg.scripts."commitlint.sh"]
+runner = "bash"
diff --git a/package.json b/package.json
@@ -0,0 +1,42 @@
+{
+  "name": "next-starter",
+  "description": "NextJS modern starter",
+  "license": "MIT",
+  "version": "0.1.0",
+  "scripts": {
+    "postinstall": "lefthook install",
+    "dev": "next --turbo",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.1",
+    "next": "^14.2.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "tailwind-merge": "^2.3.0"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "^1.7.3",
+    "@commitlint/cli": "^19.3.0",
+    "@commitlint/config-conventional": "^19.2.2",
+    "@taplo/cli": "^0.7.0",
+    "@tsconfig/strictest": "^2.0.5",
+    "@types/node": "^20.12.11",
+    "@types/react": "^18.3.2",
+    "@types/react-dom": "^18.3.0",
+    "autoprefixer": "^10.4.19",
+    "lefthook": "^1.6.10",
+    "postcss": "^8.4.38",
+    "tailwindcss": "^3.4.3",
+    "typescript": "^5.4.5"
+  },
+  "engines": {
+    "node": "20.x",
+    "pnpm": "8.15.8"
+  },
+  "volta": {
+    "node": "20.12.2"
+  }
+}