feat: nextjs experimentation

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

.gitignore

@@ -1,6 +1,35 @@
-# NOTE: Please do not add random things here that should be globally ignored instead of in the project's .gitignore
-# See: https://sebastiandedeyne.com/setting-up-a-global-gitignore-file
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
-# project things
-.venv
-.ruff_cache
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

Makefile

@@ -1,9 +1,11 @@
 install:
 	@rye sync --force
+	@npm install
 
 lint:
 	@rye lint --fix
 	@rye fmt
+	@npm run lint
 
 fmt:
 	@rye fmt
@@ -13,3 +15,22 @@ fmt-check:
 
 test:
 	@rye test
+
+run:
+	@npm run dev
+
+run-api:
+	@rye run app run --debug --reload
+
+run-frontend:
+	@npm run next-dev
+
+build:
+	@npm run build
+
+docs-serve:
+	@echo "not implemented"\
+
+applet:
+	@echo "Generating new applet in 'src/pybama_org/components/'..."
+	@rye run copier copy gh:JacobCoffee/applet-template src/pybama_org/components/

README.md

@@ -1,27 +1,85 @@
-# pybama.org
+<p align="center">
+  <a href="https://nextjs-fastapi-starter.vercel.app/">
+    <img src="https://assets.vercel.com/image/upload/v1588805858/repositories/vercel/logo.png" height="96">
+    <h3 align="center">Next.js FastAPI Starter</h3>
+  </a>
+</p>
 
-> [!IMPORTANT] This is a proof-of-concept, non-official, non-endorsed, non-authorized, non-anything project for a
-> potential, future, hypothetical, possible, maybe, who-knows, organization called "PyBama" that seeks to promote Python
-> programming across the humid, giant-bug-infested, but generally "good enough" state of Alabama.
+<p align="center">Simple Next.js boilerplate that uses <a href="https://fastapi.tiangolo.com/">FastAPI</a> as the API backend.</p>
 
-## About
+<br/>
 
-This repository holds source code for the PyBama website, which is built with [Litestar][litestar]
+## Introduction
 
-## Local Development
+This is a hybrid Next.js + Python app that uses Next.js as the frontend and FastAPI as the API backend. One great use
+case of this is to write Next.js apps that use Python AI libraries on the backend.
 
-> [!NOTE] TODO
+## How It Works
 
-## Deployment
+The Python/FastAPI server is mapped into to Next.js app under `/api/`.
 
-Done via [Railway][railway].
+This is implemented using
+[`next.config.js` rewrites](https://github.com/digitros/nextjs-fastapi/blob/main/next.config.js) to map any request to
+`/api/:path*` to the FastAPI API, which is hosted in the `/api` folder.
 
-## Contributing
+On localhost, the rewrite will be made to the `127.0.0.1:8000` port, which is where the FastAPI server is running.
 
-Do it, especially if you are or have been a resident of Alabama, a transient passerby, are in the general southeastern
-region of the United States, have ever heard of the state of Alabama, or have a passing interest in Python programming,
-or are very bored and have read this far.
+In production, the FastAPI server is hosted as
+[Python serverless functions](https://vercel.com/docs/concepts/functions/serverless-functions/runtimes/python) on
+Vercel.
 
-[//]: # "Links"
-[litestar]: https://litestar.dev
-[railway]: https://railway.app
+## Demo
+
+https://nextjs-fastapi-starter.vercel.app/
+
+## Deploy Your Own
+
+You can clone & deploy it to Vercel with one click:
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fdigitros%2Fnextjs-fastapi%2Ftree%2Fmain)
+
+## Developing Locally
+
+You can clone & create this repo with the following command
+
+```bash
+npx create-next-app nextjs-fastapi --example "https://github.com/digitros/nextjs-fastapi"
+```
+
+## Getting Started
+
+First, install the dependencies:
+
+```bash
+npm install
+# or
+yarn
+# or
+pnpm install
+```
+
+Then, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+The FastApi server will be running on [http://127.0.0.1:8000](http://127.0.0.1:8000) – feel free to change the port in
+`package.json` (you'll also need to update it in `next.config.js`).
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+- [FastAPI Documentation](https://fastapi.tiangolo.com/) - learn about FastAPI features and API.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions
+are welcome!

next.config.js

@@ -0,0 +1,22 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  rewrites: async () => {
+    return [
+      {
+        source: "/api/:path*",
+        destination: process.env.NODE_ENV === "development" ? "http://127.0.0.1:8000/api/:path*" : "/api/",
+      },
+      {
+        source: "/docs",
+        destination: process.env.NODE_ENV === "development" ? "http://127.0.0.1:8000/docs" : "/api/docs",
+      },
+      {
+        source: "/openapi.json",
+        destination:
+          process.env.NODE_ENV === "development" ? "http://127.0.0.1:8000/api/openapi.json" : "/api/openapi.json",
+      },
+    ]
+  },
+}
+
+module.exports = nextConfig

nixpacks.toml

@@ -1,4 +1,14 @@
-providers = ['python']
+providers = ['python', 'node']
 
 [variables]
-    PIP_DISABLE_PIP_VERSION_CHECK = '1'
+LITESTAR_SKIP_NODEENV_INSTALL = 'true'
+NIXPACKS_PYTHON_VERSION = '3.12'
+NPM_CONFIG_FUND = 'false'
+NPM_CONFIG_UPDATE_NOTIFIER = 'false'
+PIP_DISABLE_PIP_VERSION_CHECK = '1'
+
+[phases.setup]
+nixPkgs = ['...']
+
+[start]
+cmd = '/opt/venv/bin/app run --host 0.0.0.0 --port $PORT'