chore: build tool updates (#24)

* chore: build tool updates

* chore: update readme docs

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npm run lint:staged

.secretlintrc.json

@@ -0,0 +1,18 @@
+{
+  "rules": [
+    {
+      "id": "@secretlint/secretlint-rule-preset-recommend"
+    },
+    {
+      "id": "@secretlint/secretlint-rule-pattern",
+      "options": {
+        "patterns": [
+          {
+            "name": "Fal API key",
+            "pattern": "/\\b[0-9a-f]{8}-[0-9a-f]{4}-4[0-9a-f]{3}-[89abAB][0-9a-f]{3}-[0-9a-f]{12}:[0-9a-fA-F]{32}\\b/"
+          }
+        ]
+      }
+    }
+  ]
+}

README.md

@@ -18,7 +18,7 @@ The `serverless-js` library serves as a client for fal serverless Python functio
 This client library is crafted as a lightweight layer atop platform standards like `fetch`. This ensures a hassle-free integration into your existing codebase. Moreover, it addresses platform disparities, guaranteeing flawless operation across various JavaScript runtimes.
 
 > **Note:**
-> Ensure you've reviewed the [fal-serverless getting started guide](https://fal.ai/docs) to acquire your credentials and register your functions.
+> Ensure you've reviewed the [getting started guide](https://fal.ai/docs) to acquire your credentials, browser existing APIs, or create your custom functions.
 
 1. Start by configuring your credentials:
 
@@ -40,9 +40,11 @@ const result = await fal.run('my-function-id');
 
 The result's type is contingent upon your Python function's output. Types in Python are mapped to their corresponding types in JavaScript.
 
+See the available [model APIs](https://fal.ai/models) for more details.
+
 ### The fal client proxy
 
-Although the fal client is designed to work in any JS environment, including client-side, **it is not recommended** to store your credentials in your client source code. The common practice is to use your own server to serve as a proxy to serverless APIs. Luckily fal supports that out-of-the-box with plug-and-play proxy functions for the most common engines/framrworks.
+Although the fal client is designed to work in any JS environment, including directly in your browser, **it is not recommended** to store your credentials in your client source code. The common practice is to use your own server to serve as a proxy to serverless APIs. Luckily fal supports that out-of-the-box with plug-and-play proxy functions for the most common engines/frameworks.
 
 For example, if you are using Next.js, you can:
 
@@ -56,7 +58,7 @@ For example, if you are using Next.js, you can:
    import * as fal from '@fal-ai/serverless-js';
    fal.config({
      requestMiddleware: fal.withProxy({
-       targetUrl: '/api/_fal/proxy',
+       targetUrl: '/api/fal/proxy',
      }),
    });
    ```
@@ -66,11 +68,13 @@ See [libs/proxy](./libs/proxy/) for more details.
 
 ### The example Next.js app
 
-You can find a minimal Next.js + fal application examples in [apps/demo-nextjs-app/](https://github.com/fal-ai/serverless-js/tree/main/apps/demo-nextjs-app).
+You can find a minimal Next.js + fal application examples in [apps/demo-nextjs-page-router/](https://github.com/fal-ai/serverless-js/tree/main/apps/demo-nextjs-page-router).
 
 1. Run `npm install` on the repository root.
 2. Create a `.env.local` file and add your API Key as `FAL_KEY` environment variable (or export it any other way your prefer).
-3. Run `npx nx serve demo-nextjs-app` to start the Next.js app.
+3. Run `npx nx serve demo-nextjs-page-router` to start the Next.js app.
+
+Check our [Next.js integration docs](https://fal.ai/docs/integrations/nextjs) for more details.
 
 ## Roadmap
 

apps/demo-express-app/.env.example

@@ -0,0 +1,3 @@
+# Rename this file to .env.local and add your fal credentials
+# Visit https://fal.ai to get started
+FAL_KEY="FAL_KEY_ID:FAL_KEY_SECRET";

apps/demo-nextjs-app-router/.env.example

@@ -0,0 +1,3 @@
+# Rename this file to .env.local and add your fal credentials
+# Visit https://fal.ai to get started
+FAL_KEY="FAL_KEY_ID:FAL_KEY_SECRET";

apps/demo-nextjs-app-router/app/page.tsx

@@ -5,9 +5,10 @@ import { useMemo, useState } from 'react';
 
 // @snippet:start(client.config)
 fal.config({
+  // credentials: 'FAL_KEY_ID:FAL_KEY_SECRET',
   requestMiddleware: fal.withProxy({
     targetUrl: '/api/fal/proxy', // the built-int nextjs proxy
-    // targetUrl: 'http://localhost:3333/api/_fal/proxy', // or your own external proxy
+    // targetUrl: 'http://localhost:3333/api/fal/proxy', // or your own external proxy
   }),
 });
 // @snippet:end

apps/demo-nextjs-page-router/.env.example

@@ -0,0 +1,3 @@
+# Rename this file to .env.local and add your fal credentials
+# Visit https://fal.ai to get started
+FAL_KEY="FAL_KEY_ID:FAL_KEY_SECRET";

cspell-dictionary.txt

@@ -0,0 +1,2 @@
+quickstart
+runtimes

cspell.json

@@ -0,0 +1,14 @@
+{
+  "$schema": "https://raw.githubusercontent.com/streetsidesoftware/cspell/main/cspell.schema.json",
+  "version": "0.2",
+  "language": "en",
+  "languageId": "markdown",
+  "dictionaryDefinitions": [
+    {
+      "name": "project-words",
+      "path": "./cspell-dictionary.txt",
+      "addWords": true
+    }
+  ],
+  "dictionaries": ["en_US", "project-words", "typescript", "python"]
+}

libs/proxy/README.md

@@ -12,7 +12,9 @@ The `@fal-ai/serverless-proxy` library enables you to route client requests thro
 npm install --save @fal-ai/serverless-proxy
 ```
 
-## Next.js integration
+## Next.js page router integration
+
+For Next.js applications using the page router:
 
 1. Create an API route in your Next.js app, as a convention we suggest using `pages/api/_fal/proxy.js` (or `.ts` if you're using TypeScript):
 2. Re-export the proxy handler from the library as the default export:
@@ -21,6 +23,21 @@ npm install --save @fal-ai/serverless-proxy
    ```
 3. Ensure you've set the `FAL_KEY` as an environment variable in your server, containing a valid API Key.
 
+## Next.js app router integration
+
+For Next.js applications using the app router:
+
+1. Create an API route in your Next.js app, as a convention we suggest using `app/api/fal/proxy/route.js` (or `.ts` if you're using TypeScript):
+2. Re-export the proxy handler from the library as the default export:
+
+   ```ts
+   import { route } from '@fal-ai/serverless-proxy/nextjs';
+
+   export const { GET, POST } = route;
+   ```
+
+3. Ensure you've set the `FAL_KEY` as an environment variable in your server, containing a valid API Key.
+
 ## Express integration
 
 For Express applications:
@@ -52,7 +69,7 @@ import * as fal from '@fal-ai/serverless-js';
 
 fal.config({
   requestMiddleware: fal.withProxy({
-    targetUrl: '/api/_fal/proxy', // or https://my.app.com/api/_fal/proxy
+    targetUrl: '/api/fal/proxy', // or https://my.app.com/api/fal/proxy
   }),
 });
 ```