feat(vite): Switch to vite to build the app more flexibly

.github/renovate.json

@@ -1,7 +1,3 @@
 {
-  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": [
-    "github>tarampampam/.github//renovate/default",
-    ":rebaseStalePrs"
-  ]
+  "$schema": "https://docs.renovatebot.com/renovate-schema.json"
 }

.github/workflows/deploy.yml

@@ -5,10 +5,6 @@ name: 🚀 Deploy
 
 on:
   workflow_dispatch: {}
-  push:
-    #release: {types: [published]} # TODO: uncomment this line when ready to deploy via releases
-    branches: [master, main]
-    paths: [wrangler.json, src/**, public/**, .github/workflows/deploy.yml]
 
 concurrency:
   group: ${{ github.ref }}-deploy
@@ -20,18 +16,19 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
-      - run: |
-          cat <<< $(jq '.name = "${{ vars.CLOUDFLARE_PROJECT_NAME }}"' $FILE) > $FILE
-          cat <<< $(jq '.kv_namespaces[0].id = "${{ vars.CLOUDFLARE_KV_ID }}"' $FILE) > $FILE
-          cat <<< $(jq '.vars.AUTH_TOKEN = "${{ secrets.AUTH_TOKEN }}"' $FILE) > $FILE
-        env: {FILE: wrangler.json}
       - {uses: actions/setup-node@v4, with: {node-version-file: ./package.json, cache: 'npm'}}
-      - run: npm install && npm run gen
+      - run: npm install
+      - run: npm run gen
+      - run: npm run build
+        env:
+          PROJECT_NAME: ${{ vars.CLOUDFLARE_PROJECT_NAME }}
+          KV_ID: ${{ vars.CLOUDFLARE_KV_ID }}
+          AUTH_TOKEN: ${{ secrets.AUTH_TOKEN }}
       - uses: cloudflare/wrangler-action@v3
         with:
           apiToken: ${{ secrets.CLOUDFLARE_PAGES_DEPLOY_TOKEN }}
           accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
           gitHubToken: ${{ secrets.GITHUB_TOKEN }}
           # docs: https://developers.cloudflare.com/workers/wrangler/commands/#deploy
-          command: deploy --name=${{ vars.CLOUDFLARE_PROJECT_NAME }}
+          command: deploy ./dist --name=${{ vars.CLOUDFLARE_PROJECT_NAME }}
         env: {WRANGLER_SEND_METRICS: false}

.github/workflows/tests.yml

@@ -0,0 +1,38 @@
+# yaml-language-server: $schema=https://json.schemastore.org/github-workflow.json
+# docs: https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions
+
+name: 🧪 Tests
+
+on:
+  push:
+    branches: [master, main]
+    tags-ignore: ['**']
+    paths-ignore: ['**.md']
+  pull_request:
+    paths-ignore: ['**.md']
+
+concurrency:
+  group: ${{ github.ref }}
+  cancel-in-progress: true
+
+env: {FORCE_COLOR: 'true'}
+
+jobs:
+  gitleaks:
+    name: Check for GitLeaks
+    runs-on: ubuntu-latest
+    steps:
+      - {uses: actions/checkout@v4, with: {fetch-depth: 0}}
+      - uses: gacts/gitleaks@v1
+
+  test-and-build:
+    name: Test and build
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - {uses: actions/setup-node@v4, with: {node-version-file: ./package.json, cache: 'npm'}}
+      - run: npm install -dd --no-audit
+      - run: npm run gen
+      - run: npm run lint
+      - run: npm run test
+      - run: npm run build

.gitignore

@@ -5,13 +5,17 @@
 ## Node
 /node_modules
 
-## Generaated types
-/types.gen.d.ts
+## Dist
+/dist
+
+## Generaated content
+*.gen.*
 
 ## Temp dirs & trash
 /temp
 /tmp
 /.cache
 /.wrangler
+*.tsbuildinfo
 .dev.vars
 .DS_Store

Makefile

@@ -0,0 +1,24 @@
+#!/usr/bin/make
+# Makefile readme: <https://www.gnu.org/software/make/manual/html_node/index.html#SEC_Contents>
+
+.DEFAULT_GOAL := build
+.MAIN := build
+
+NODE_IMAGE = docker.io/library/node:20-bookworm
+RUN_ARGS = --rm -v "$(shell pwd):/src:rw" \
+	-t --workdir "/src" \
+	-u "$(shell id -u):$(shell id -g)" \
+	-e "NPM_CONFIG_UPDATE_NOTIFIER=false" \
+	-e PATH="$$PATH:/src/node_modules/.bin" $(NODE_IMAGE)
+
+install: ## Install all dependencies
+	docker run $(RUN_ARGS) npm install
+
+shell: ## Start shell into a container with node
+	docker run -i $(RUN_ARGS) bash
+
+dev: ## Start development server
+	docker run -p "8787:8787/tcp" -i $(RUN_ARGS) npm run dev
+
+gen fmt test lint build: ## Run the specified npm script
+	docker run $(RUN_ARGS) npm run $@

README.md

@@ -1,6 +1,21 @@
-# url-shortener
+<p align="center">
+  <a href="https://github.com/tarampampam/url-shortener#readme">
+    <picture>
+      <source media="(prefers-color-scheme: dark)" srcset="https://socialify.git.ci/tarampampam/url-shortener/image?description=1&font=Raleway&forks=1&issues=1&owner=1&pulls=1&pattern=Solid&stargazers=1&theme=Dark">
+      <img align="center" src="https://socialify.git.ci/tarampampam/url-shortener/image?description=1&font=Raleway&forks=1&issues=1&owner=1&pulls=1&pattern=Solid&stargazers=1&theme=Light">
+    </picture>
+  </a>
+</p>
 
-Steps to reproduce the project:
+# URL shortener
+
+This is a simple URL shortener application that allows users to create short links for long URLs. The app is
+built using Cloudflare Workers and uses Workers KV for storage.
+
+> [!TIP]
+> To prevent abuse, the app may be protected by an authentication token.
+
+## Steps to reproduce the project
 
 * Issue a [new Cloudflare API token][new_cf_token] with the following scopes (`Workers KV Storage:Edit`,
   `Workers Scripts:Edit`) and save it

eslint.config.js

@@ -0,0 +1,25 @@
+import { defineConfig } from 'eslint/config'
+import globals from 'globals'
+import js from '@eslint/js'
+import tseslint from 'typescript-eslint'
+
+export default defineConfig([
+  {
+    ignores: ['dist/*', 'src/server/*.gen.d.ts'],
+  },
+  {
+    files: ['**/*.{js,ts,tsx}'],
+  },
+  {
+    files: ['src/client/**/*.{js,ts,tsx}'],
+    languageOptions: {
+      globals: globals.browser,
+    },
+  },
+  {
+    files: ['**/*.{js,ts,tsx}'],
+    plugins: { js },
+    extends: ['js/recommended'],
+  },
+  tseslint.configs.recommended,
+])