Add Fastapi react postgres template

.bunnyshell/templates/fastapi-react-postgres/README.md

@@ -0,0 +1,23 @@
+## Bunnyshell Environment Template for Python FastAPI + React + PostgreSQL
+
+This repository provides a template environment for developing a CRUD (Create, Read, Update, Delete) application using Python FastAPI, React, and PostgreSQL.
+The application also features a visually appealing user interface based on CreativeTim's Material 2 Pro React template.
+
+## Local Usage
+
+To set up and use this environment locally, please follow the steps below:
+
+1. Make sure that Docker and Docker Compose are installed on your system. If not, please install them first.
+2. Navigate to the "applications" directory using the command cd applications.
+3. Build the Docker images by running the command docker-compose build.
+4. Launch the Docker containers by executing the command docker-compose up.
+   You can now access the application by visiting http://0.0.0.0:8080/todo in your web browser.
+   Contributing
+   If you wish to contribute to this environment, please follow the steps outlined below:
+
+Fork this repository to your own GitHub account.
+Create a new branch on your forked repository.
+Implement your changes and commit them to your branch.
+Push your changes to your forked repository.
+Finally, submit a pull request from your branch to the original repository.
+Thank you for considering contributing to this project. Your contributions are highly appreciated!

.bunnyshell/templates/fastapi-react-postgres/bunnyshell.yaml

@@ -0,0 +1,57 @@
+kind: Environment
+name: Python (FastAPI) / React (CreativeTim Material Kit Pro react template) / PostgreSQL boilerplate
+type: primary
+components:
+  - kind: Application
+    name: backend
+    gitRepo: 'https://github.com/bunnyshell/templates.git'
+    gitBranch: main
+    gitApplicationPath: components/fastapi-todo-backend
+    dockerCompose:
+      build:
+        context: ./components/fastapi-todo-backend
+        dockerfile: .docker/Dockerfile
+      environment:
+        PORT: 8000
+        DATABASE_URL: postgresql://postgres:need-to-replace@db:5432/fastapi_test
+      ports:
+        - '8080:8000'
+    hosts:
+      - hostname: 'backend-{{ env.base_domain }}'
+        path: /
+        servicePort: 8080
+  - kind: Database
+    name: db
+    dockerCompose:
+      environment:
+        POSTGRES_DB: fastapi_test
+        POSTGRES_PASSWORD: need-to-replace
+        POSTGRES_USER: postgres
+      image: postgres:15.2-alpine3.17
+      ports:
+        - '5432:5432'
+    volumes:
+      - name: data-volume
+        mount: /var/lib/postgresql/data
+        subPath: ''
+  - kind: Application
+    name: frontend
+    gitRepo: 'https://github.com/bunnyshell/templates.git'
+    gitBranch: main
+    gitApplicationPath: components/react-todo-app
+    dockerCompose:
+      build:
+        context: ./components/react-todo-app
+        dockerfile: .docker/Dockerfile
+      environment:
+        REACT_APP_BACKEND_URL: 'https://{{ components.backend.ingress.hosts[0] }}'
+      ports:
+        - '8080:3000'
+    hosts:
+      - hostname: 'frontend-{{ env.base_domain }}'
+        path: /todo
+        servicePort: 8080
+volumes:
+  - name: data-volume
+    size: 1Gi
+    type: disk

.bunnyshell/templates/fastapi-react-postgres/template.yaml

@@ -0,0 +1,18 @@
+name: Python (FastAPI) + React (CreativeTim Material Kit Pro react template) + PostgreSQL
+description: This is boilerplate for creating a Python (FastAPI) + React (CreativeTim Material 2 Pro react template) + PostgreSQL environment. It contains basic CRUD example for a todo list making it a good starting point for your next project.
+tags:
+  - Python
+  - FastAPI
+  - PostgreSQL
+  - React
+  - CreativeTim Material Kit Pro react template
+icons: ['python', 'postgres', 'react']
+stack:
+  packages:
+    - name: Python
+      version: '3.10'
+    - name: PostgreSQL
+      version: '15.2'
+    - name: React
+      version: '18.2.0'
+discoverable: true

components/fastapi-todo-backend/.docker/Dockerfile

@@ -0,0 +1,11 @@
+FROM python:3
+
+WORKDIR /app
+
+COPY requirements.txt ./
+RUN --mount=type=cache,target=/root/.cache/pip \
+    pip install -r requirements.txt
+
+COPY ./app ./app
+
+ENTRYPOINT [ "python", "app/server.py" ]

components/fastapi-todo-backend/.docker/docker-compose.yml

@@ -0,0 +1,30 @@
+services:
+  api:
+    build:
+      context: ./../
+      dockerfile: .docker/Dockerfile
+    environment:
+      PORT: 8000
+      DATABASE_URL: postgresql://postgres:need-to-replace@db:5432/fastapi_test
+    ports:
+      - '8002:8000'
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock
+      - ./../:/app
+    restart: 'no'
+    depends_on:
+      - db
+  db:
+    image: postgres:15.2-alpine3.17
+    restart: always
+    user: postgres
+    volumes:
+      - db-data:/var/lib/postgresql/data
+    environment:
+      - POSTGRES_DB=fastapi_test
+      - POSTGRES_USER=postgres
+      - POSTGRES_PASSWORD=need-to-replace
+    expose:
+      - 5432
+volumes:
+  db-data:

components/fastapi-todo-backend/app/app.py

@@ -0,0 +1,57 @@
+from fastapi import FastAPI
+from fastapi.middleware.cors import CORSMiddleware
+
+from sqlmodel import Session
+from db import engine
+from models import Todo
+
+app = FastAPI()
+
+
+origins = ["*"]
+
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=origins,
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+
+@app.get("/")
+def hello_world():
+    return {"message": "OK"}
+
+
+@app.get("/alive")
+def hello_world():
+    return {"message": "OK"}
+
+@app.post("/api/v1/add-todo")
+def add_todo(todo: Todo):
+    print('Adding todo', todo)
+
+    with Session(engine) as session:
+        session.add(todo)
+        session.commit()
+
+    return {"message": "OK"}
+
+
+@app.get("/api/v1/get-all-todos")
+def get_all_todos():
+    with Session(engine) as session:
+        todos = session.query(Todo).all()
+
+    return todos
+
+
+@app.delete("/api/v1/delete-todo/{todo_id}")
+def delete_todo_by_id(todo_id: int):
+    with Session(engine) as session:
+        todo = session.get(Todo, todo_id)
+        session.delete(todo)
+        session.commit()
+
+    return {"message": "OK"}

components/fastapi-todo-backend/app/db.py

@@ -0,0 +1,12 @@
+from sqlmodel import SQLModel, create_engine
+from models import *
+import os
+
+DATABASE_URL = os.environ.get("DATABASE_URL")
+
+engine = create_engine(DATABASE_URL)
+
+
+def create_db_and_tables():
+    print('Creating database and tables')
+    SQLModel.metadata.create_all(engine)

components/fastapi-todo-backend/app/models.py

@@ -0,0 +1,6 @@
+from sqlmodel import SQLModel, Field
+from typing import Optional
+
+class Todo(SQLModel, table=True):
+    id: Optional[int] = Field(default=None, primary_key=True)
+    todo: str

components/fastapi-todo-backend/app/server.py

@@ -0,0 +1,9 @@
+import uvicorn
+from db import create_db_and_tables
+import os
+
+if __name__ == "__main__":
+    create_db_and_tables()
+    port = int(os.environ.get('PORT', 8000))
+
+    uvicorn.run("app:app", host="0.0.0.0", port=port, reload=True)

components/fastapi-todo-backend/requirements.txt

@@ -0,0 +1,4 @@
+fastapi
+uvicorn
+psycopg2==2.9.5
+sqlmodel==0.0.8

components/react-todo-app/.docker/Dockerfile

@@ -0,0 +1,17 @@
+# Use an official Node.js runtime as a parent image
+FROM node:14-alpine
+
+WORKDIR /app/
+
+COPY ./package.json /app/
+
+# Install dependencies
+RUN npm install
+
+# Set up an anonymous volume for the node_modules directory
+VOLUME [ "/app/node_modules" ]
+
+# Copy the build directory to the container
+COPY . /app/
+
+ENTRYPOINT [ "npm", "run", "start"]

components/react-todo-app/.docker/docker-compose.yml

@@ -0,0 +1,18 @@
+services:
+  app:
+    build:
+      context: ./../
+      dockerfile: .docker/Dockerfile
+    environment:
+      HOST: 0.0.0.0
+      REACT_APP_BACKEND_URL: http://0.0.0.0:8002/
+    ports:
+      - '8080:3000'
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock
+      - ./../:/app
+    restart: 'no'
+    depends_on:
+      - api
+volumes:
+  db-data:

components/react-todo-app/.eslintrc.json

@@ -0,0 +1,35 @@
+{
+  "env": {
+    "browser": true,
+    "es2021": true
+  },
+  "extends": ["eslint:recommended", "plugin:react/recommended", "prettier"],
+  "parserOptions": {
+    "ecmaFeatures": {
+      "jsx": true
+    },
+    "ecmaVersion": 12,
+    "sourceType": "module"
+  },
+  "plugins": ["react", "prettier"],
+  "rules": {
+    "prettier/prettier": [
+      "error",
+      {
+        "endOfLine": "auto"
+      }
+    ],
+    "react/react-in-jsx-scope": "off",
+    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
+    "react/jsx-props-no-spreading": [
+      1,
+      {
+        "custom": "ignore"
+      }
+    ],
+    "react/jsx-curly-spacing": [2, "never"],
+    "default-param-last": "off",
+    "react/display-name": "off"
+  },
+  "settings": { "import/resolver": { "node": { "paths": ["src"] } } }
+}

components/react-todo-app/.gitignore

@@ -0,0 +1,27 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+.DS_Store
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+package-lock.json
+yarn.lock
+
+commit.sh

components/react-todo-app/.npmrc

@@ -0,0 +1,3 @@
+legacy-peer-deps=true
+auto-install-peers=true
+strict-peer-dependencies=false

components/react-todo-app/.prettierrc.json

@@ -0,0 +1,8 @@
+{
+  "printWidth": 100,
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "semi": true,
+  "singleQuote": false,
+  "endOfLine": "auto"
+}