Kickstart the repo with the template code (#3)

Applying the template to a Next.js+FastAPI application. Using the template app from https://github.com/digitros/nextjs-fastapi
VectorInstitute · Feb 15, 2024 · 7535f0f · 7535f0f
1 parent e06b4e9
commit 7535f0f
Show file tree

Hide file tree

Showing 39 changed files with 11,330 additions and 167 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}
diff --git a/.flake8 b/.flake8
@@ -0,0 +1,3 @@
+[flake8]
+max-line-length = 119
+ignore = E203, W503
diff --git a/.gitignore b/.gitignore
@@ -130,3 +130,39 @@ dmypy.json
 
 # pycharm
 .idea/
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/florist/.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
+/florist/tsconfig.json
diff --git a/assets/img/apple-icon.png b/assets/img/apple-icon.png
diff --git a/assets/img/favicon.png b/assets/img/favicon.png
diff --git a/assets/js/plugins/perfect-scrollbar.min.js b/assets/js/plugins/perfect-scrollbar.min.js
diff --git a/assets/js/plugins/smooth-scrollbar.min.js b/assets/js/plugins/smooth-scrollbar.min.js
diff --git a/florist/api/index.py b/florist/api/index.py
@@ -0,0 +1,8 @@
+from fastapi import FastAPI
+
+app = FastAPI()
+
+
+@app.get("/api/python")
+def hello_world() -> str:
+    return "hello world"
diff --git a/assets/css/material-dashboard.css → ...ist/app/assets/css/material-dashboard.css b/assets/css/material-dashboard.css → ...ist/app/assets/css/material-dashboard.css
diff --git a/assets/css/nucleo-icons.css → florist/app/assets/css/nucleo-icons.css b/assets/css/nucleo-icons.css → florist/app/assets/css/nucleo-icons.css
diff --git a/assets/css/nucleo-svg.css → florist/app/assets/css/nucleo-svg.css b/assets/css/nucleo-svg.css → florist/app/assets/css/nucleo-svg.css
diff --git a/florist/app/assets/fonts/nucleo-icons.eot b/florist/app/assets/fonts/nucleo-icons.eot
diff --git a/florist/app/assets/fonts/nucleo-icons.svg b/florist/app/assets/fonts/nucleo-icons.svg
diff --git a/florist/app/assets/fonts/nucleo-icons.ttf b/florist/app/assets/fonts/nucleo-icons.ttf
diff --git a/florist/app/assets/fonts/nucleo-icons.woff b/florist/app/assets/fonts/nucleo-icons.woff
diff --git a/florist/app/assets/fonts/nucleo-icons.woff2 b/florist/app/assets/fonts/nucleo-icons.woff2
diff --git a/florist/app/assets/fonts/nucleo.eot b/florist/app/assets/fonts/nucleo.eot
diff --git a/florist/app/assets/fonts/nucleo.ttf b/florist/app/assets/fonts/nucleo.ttf
diff --git a/florist/app/assets/fonts/nucleo.woff b/florist/app/assets/fonts/nucleo.woff
diff --git a/florist/app/assets/fonts/nucleo.woff2 b/florist/app/assets/fonts/nucleo.woff2
diff --git a/assets/img/logo-ct.png → florist/app/assets/img/logo-ct.png b/assets/img/logo-ct.png → florist/app/assets/img/logo-ct.png
diff --git a/assets/js/core/bootstrap.min.js → florist/app/assets/js/core/bootstrap.min.js b/assets/js/core/bootstrap.min.js → florist/app/assets/js/core/bootstrap.min.js
diff --git a/assets/js/core/popper.min.js → florist/app/assets/js/core/popper.min.js b/assets/js/core/popper.min.js → florist/app/assets/js/core/popper.min.js
diff --git a/assets/js/material-dashboard.min.js → ...t/app/assets/js/material-dashboard.min.js b/assets/js/material-dashboard.min.js → ...t/app/assets/js/material-dashboard.min.js
diff --git a/florist/app/client_imports.tsx b/florist/app/client_imports.tsx
@@ -0,0 +1,15 @@
+"use client"
+
+import { useEffect } from "react";
+
+function ClientImports(): null {
+    useEffect(() => {
+        require("./assets/js/core/popper.min.js");
+        require("./assets/js/core/bootstrap.min.js");
+        require("./assets/js/material-dashboard.min.js?v=3.0.0");
+    }, []);
+
+    return null;
+}
+
+export default ClientImports;
diff --git a/florist/app/layout.tsx b/florist/app/layout.tsx
@@ -0,0 +1,103 @@
+import "./assets/css/nucleo-icons.css";
+import "./assets/css/nucleo-svg.css";
+import "./assets/css/material-dashboard.css?v=3.0.0";
+
+import { Metadata } from "next";
+import { ReactElement } from "react/React";
+import Script from "next/script";
+import { useEffect } from "react";
+
+import Sidebar from "./sidebar";
+import ClientImports from './client_imports';
+
+export const metadata: Metadata = {
+  title: "Florist",
+};
+
+export default function RootLayout({
+    children,
+}: {
+    children: React.ReactNode
+}): ReactElement {
+    return (
+        <html lang="en">
+            <head>
+                {/*     Fonts and icons     */}
+                <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900|Roboto+Slab:400,700" />
+                {/*     Font Awesome Icons  */}
+                <Script src="https://kit.fontawesome.com/42d5adcbca.js" />
+                {/*     Material Icons      */}
+                <link href="https://fonts.googleapis.com/icon?family=Material+Icons+Round" rel="stylesheet" />
+                {/*     Copyright Notice    */}
+                <script dangerouslySetInnerHTML={{ __html: `
+                            <!--
+                            =========================================================
+                            * Material Dashboard 2 - v3.0.0
+                            =========================================================
+
+                            * Product Page: https://www.creative-tim.com/product/material-dashboard
+                            * Copyright 2021 Creative Tim (https://www.creative-tim.com)
+                            * Licensed under MIT (https://www.creative-tim.com/license)
+                            * Coded by Creative Tim
+
+                            =========================================================
+
+                            * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+                            -->
+                `}} />
+            </head>
+            <body className="g-sidenav-show  bg-gray-200">
+                {/* Sidebar */}
+                <Sidebar />
+                {/* Body */}
+                <main className="main-content position-relative max-height-vh-100 h-100 border-radius-lg ">
+                    {/* Navbar */}
+                    <nav className="navbar navbar-main navbar-expand-lg px-0 mx-4 shadow-none border-radius-xl" id="navbarBlur" navbar-scroll="true">
+                        <div className="container-fluid py-1 px-3">
+                            <nav aria-label="breadcrumb">
+                                <ol className="breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5">
+                                    {/* Breadcrumbs */}
+                                </ol>
+                            </nav>
+                            <div className="collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4" id="navbar">
+                                <div className="ms-md-auto pe-md-3 d-flex align-items-center">
+                                    <div className="input-group input-group-outline">
+                                        {/* Left aligned elements */}
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </nav>
+                    {/* End Navbar */}
+                    <div className="container-fluid py-4">
+                        <div className="row min-vh-80 h-100">
+                            <div className="col-12">
+                                {children}
+                            </div>
+                        </div>
+                        {/* Footer */}
+                        <footer className="footer pt-5">
+                            <div className="container-fluid">
+                                <div className="row align-items-center justify-content-lg-between">
+                                    <div className="col-lg-6 mb-lg-0 mb-4">
+                                        <div className="copyright text-center text-sm text-muted text-lg-start">
+                                            {/* Copyright */}
+                                        </div>
+                                    </div>
+                                    <div className="col-lg-6">
+                                        <ul className="nav nav-footer justify-content-center justify-content-lg-end">
+                                            {/* Bottom right navbar */}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                        </footer>
+                    </div>
+                </main>
+
+                <ClientImports />
+
+            </body>
+        </html>
+    );
+}
diff --git a/florist/app/page.tsx b/florist/app/page.tsx
@@ -0,0 +1,7 @@
+import { ReactElement } from "react/React";
+
+export default function Home(): ReactElement {
+    return (
+        <span>Content goes here</span>
+    );
+}
diff --git a/florist/app/sidebar.tsx b/florist/app/sidebar.tsx
@@ -0,0 +1,31 @@
+import logo_ct from "./assets/img/logo-ct.png";
+
+import Image from "next/image";
+import { ReactElement } from "react/React";
+
+export default function Sidebar(): ReactElement {
+    return (
+        <aside className="sidenav navbar navbar-vertical navbar-expand-xs border-0 border-radius-xl my-3 fixed-start ms-3   bg-gradient-dark" id="sidenav-main">
+            <div className="sidenav-header">
+                <i className="fas fa-times p-3 cursor-pointer text-white opacity-5 position-absolute end-0 top-0 d-none d-xl-none" aria-hidden="true" id="iconSidenav"></i>
+                <span className="navbar-brand m-0">
+                    <Image src={logo_ct} className="navbar-brand-img h-100" alt="main_logo" width={32} height={32}/>
+                    <span className="ms-1 font-weight-bold text-white">FLorist</span>
+                </span>
+            </div>
+            <hr className="horizontal light mt-0 mb-2" />
+            <div className="collapse navbar-collapse  w-auto  max-height-vh-100" id="sidenav-collapse-main">
+                <ul className="navbar-nav">
+                    <li className="nav-item">
+                        <a className="nav-link text-white active bg-gradient-primary" href="#">
+                            <div className="text-white text-center me-2 d-flex align-items-center justify-content-center">
+                                <i className="material-icons opacity-10">home</i>
+                            </div>
+                            <span className="nav-link-text ms-1">Home</span>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+        </aside>
+    );
+}
diff --git a/index.html b/index.html
diff --git a/mypy.ini b/mypy.ini
@@ -0,0 +1,11 @@
+[mypy]
+mypy_path=.
+follow_imports = normal
+ignore_missing_imports = True
+install_types = True
+pretty = True
+non_interactive = True
+disallow_untyped_defs = True
+no_implicit_optional = True
+check_untyped_defs = True
+exclude = venv
diff --git a/next.config.js b/next.config.js
@@ -0,0 +1,30 @@
+/** @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/openapi.json"
+            : "/api/openapi.json",
+      },
+    ];
+  },
+};
+
+module.exports = nextConfig;