chore: deploy refactored app

.eslintrc.json

@@ -1,9 +1,14 @@
 {
+  "plugins": [
+    "eslint-plugin-next-on-pages"
+  ],
   "extends": [
     "next/core-web-vitals",
-    "plugin:prettier/recommended"
+    "plugin:prettier/recommended",
+    "plugin:eslint-plugin-next-on-pages/recommended"
   ],
   "rules": {
-    "prettier/prettier": "error"
+    "prettier/prettier": "error",
+    "next-on-pages/no-unsupported-configs": "error"
   }
 }

.github/workflows/ci.yml

@@ -13,12 +13,14 @@ jobs:
       - uses: actions/checkout@v4
         with:
           fetch-depth: '0'
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: 18
-      - name: 🚀 Deploy 🚀
-        run: make deploy
-        env:
-          OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
-          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
-          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          node-version-file: '.node-version'
+      - name: 🔨 Install Dependencies 🔨
+        run: sudo apt-get update && sudo apt-get install make
+      # - name: 🚀 Deploy 🚀
+      #   run: make deploy
+      #   env:
+      #     OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
+      #     CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+      #     CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}

.gitignore

@@ -30,6 +30,9 @@ yarn-error.log*
 # vercel
 .vercel
 
+# Cloudflare
+.wrangler
+
 # typescript
 *.tsbuildinfo
 next-env.d.ts

.node-version

@@ -0,0 +1 @@
+18.16.1

.stylelintrc

@@ -0,0 +1,3 @@
+{
+  "extends": ["stylelint-prettier/recommended"]
+}

.tool-versions

@@ -0,0 +1 @@
+nodejs 18.16.1

Makefile

@@ -4,11 +4,16 @@ install:
 dev:
 	npm run dev
 
-.PHONY: build
-build:
+dev_cloudflare:
+	npm run pages:dev
+
+build: clean
 	npm run build
 
-start: build
+build_cloudflare:
+	npm run pages:build
+
+start:
 	npm run start
 
 lint:
@@ -18,13 +23,23 @@ lint_fix:
 	npm run lint:fix
 
 performance:
-	chmod +x ./script/$@.sh
-	./script/$@.sh "3000"
+	npm run lighthouse
+
+test: performance
+
+ensure_cloudflare_kv_exists:
+	chmod +x ./script/ensure-cloudflare-kv-exists.sh
+	./script/ensure-cloudflare-kv-exists.sh "IMAGE_ANALYZER_KV"
+
+ensure_cloudflare_page_exists:
+	chmod +x ./script/ensure-cloudflare-pages-exists.sh
+	./script/ensure-cloudflare-pages-exists.sh "image-analyzer-app"
 
-test: lint build
+ensure_cloudflare_infra_exists: ensure_cloudflare_page_exists ensure_cloudflare_kv_exists
 
-deploy: install test
-	npm run pages:deploy
+deploy: install test build_cloudflare ensure_cloudflare_infra_exists
+	chmod +x ./script/cloudflare-pages-deploy.sh
+	./script/cloudflare-pages-deploy.sh ".vercel/output/static" "image-analyzer-app"
 
 clean:
-	rm -rf node_modules/ .next/
+	rm -rf node_modules/ .next/ .vercel/ build/

README.md

@@ -1,5 +1,5 @@
 # image-analyzer-app
-> a NextJS application for analyzing images
+> a NextJS app that allows users to analyze images using MobileNet (via TensorflowJS), ChatGPT, and Cloudflare Pages
 
 ## Requirements
 
@@ -26,9 +26,4 @@ make test
 To deploy the application, run the following command:
 ```bash
 make deploy
-```
-
-## TODOS
-
-- [ ] Migrate [stockjs](https://github.com/tjmaynes/gists/tree/main/javascript/stockjs) app to web-playground
-- [ ] Migrate [tic-tac-toe](https://github.com/tjmaynes/gists/tree/main/javascript/tic-tac-toe) app to web-playground
+```

lighthouserc.js

@@ -1,14 +1,18 @@
 module.exports = {
   ci: {
     collect: {
-      url: 'http://localhost:3000',
+      startServerCommand: 'npm run start',
+      url: 'http://localhost:9900',
+      startServerReadyTimeout: 60 * 5, // 5 minutes
       numberOfRuns: 1,
     },
     assert: {
       preset: 'lighthouse:no-pwa',
       assertions: {
-        'categories:performance': ['error', { minScore: 0.9 }],
-        'categories:accessibility': ['error', { minScore: 0.9 }],
+        'bf-cache': 'off',
+        'csp-xss': 'off',
+        'uses-long-cache-ttl': 'off',
+        'total-byte-weight': 'off',
       },
     },
   },