feat: you can now use both fastAPI and NextJS in the backend

.gitignore

@@ -33,3 +33,7 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+
+# python
+__pycache__/
+venv

README.md

@@ -5,19 +5,20 @@
   </a>
 </p>
 
-<p align="center">Simple Next.js boilerplate that uses <a href="https://fastapi.tiangolo.com/">FastAPI</a> as the API backend.</p>
+<p align="center">Simple Next.js boilerplate that uses BOTH <a href="https://fastapi.tiangolo.com/">FastAPI</a> AND NEXTJS 13 as the API backend unlike <a href="https://github.com/digitros/nextjs-fastapi" >the example offered by NextJS</a>
 
 <br/>
 
 ## Introduction
 
-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.
+This is a hybrid Next.js + Python app that uses a fullstack Next.js application and FastAPI as another API backend. One great use case of this is to write Next.js apps that use Python AI libraries on the backend.
 
 ## How It Works
 
-The Python/FastAPI server is mapped into to Next.js app under `/api/`.
+The Python/FastAPI server is mapped into to Next.js app under `/api/py/`(easily changeable) and the NextJS is mapped to `/api/`.
 
-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.
+
+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/py/:path*` to the FastAPI API, which is hosted in the `/api` folder.
 
 On localhost, the rewrite will be made to the `127.0.0.1:8000` port, which is where the FastAPI server is running.
 
@@ -31,14 +32,14 @@ https://nextjs-fastapi-starter.vercel.app/
 
 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)
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fpsycho-baller%2Fnextjs-and-fastapi-backend%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"
+npx create-next-app nextjs-fastapi --example "https://github.com/psycho-baller/nextjs-and-fastapi-backend"
 ```
 
 ## Getting Started
@@ -53,6 +54,14 @@ yarn
 pnpm install
 ```
 
+Create a virtual environment and install the dependencies for the FastAPI server:
+
+```bash
+python3 -m venv venv
+source venv/bin/activate
+pip install -r requirements.txt
+```
+
 Then, run the development server:
 
 ```bash

api/index.py

@@ -1,7 +1,7 @@
 from fastapi import FastAPI
 
-app = FastAPI()
+app = FastAPI(docs_url="/api/py/docs", openapi_url="/api/py/openapi.json")
 
-@app.get("/api/python")
-def hello_world():
-    return {"message": "Hello World"}
+@app.get("/api/py/healthcheck")
+def healthchecker():
+    return {"status": "success", "message": "Integrated FastAPI Framework with Next.js successfully!"}

app/api/healthcheck/route.ts

@@ -0,0 +1,23 @@
+import { type NextRequest, NextResponse } from "next/server";
+
+export async function GET(req: NextRequest) {
+  const { searchParams } = new URL(req.url);
+
+  try {
+    return NextResponse.json(
+      {
+        message: "Hello from the NextJS API",
+      },
+      {
+        headers: {
+          "Access-Control-Allow-Origin": "*",
+          "Access-Control-Allow-Headers": "*",
+          "Access-Control-Allow-Methods": "*",
+          // "Content-Type": "application/json",
+        },
+      }
+    );
+  } catch (e) {
+    return NextResponse.error();
+  }
+}

next.config.js

@@ -3,25 +3,25 @@ const nextConfig = {
   rewrites: async () => {
     return [
       {
-        source: "/api/:path*",
+        source: "/api/py/:path*",
         destination:
           process.env.NODE_ENV === "development"
-            ? "http://127.0.0.1:8000/api/:path*"
+            ? "http://127.0.0.1:8000/api/py/:path*"
             : "/api/",
       },
       {
         source: "/docs",
         destination:
           process.env.NODE_ENV === "development"
-            ? "http://127.0.0.1:8000/docs"
-            : "/api/docs",
+            ? "http://127.0.0.1:8000/api/py/docs"
+            : "/api/py/docs",
       },
       {
         source: "/openapi.json",
         destination:
           process.env.NODE_ENV === "development"
-            ? "http://127.0.0.1:8000/openapi.json"
-            : "/api/openapi.json",
+            ? "http://127.0.0.1:8000/api/py/openapi.json"
+            : "/api/py/openapi.json",
       },
     ];
   },