Initial commit

.github/workflows/deploy.production.yml

@@ -0,0 +1,26 @@
+name: Fly Deploy Production
+
+on: [workflow_dispatch]
+
+jobs:
+  deploy-web:
+    name: Deploy Web
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: superfly/flyctl-actions/setup-flyctl@master
+      - run: flyctl deploy --remote-only --config fly.production.toml
+        working-directory: ./web
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_WEB_PRODUCTION_API_TOKEN }}
+
+  deploy-api:
+    name: Deploy Api
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: superfly/flyctl-actions/setup-flyctl@master
+      - run: flyctl deploy --remote-only --config fly.production.toml
+        working-directory: ./api
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_API_PRODUCTION_API_TOKEN }}

.github/workflows/deploy.staging.yml

@@ -0,0 +1,29 @@
+name: Fly Deploy Staging
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  deploy-web:
+    name: Deploy Web
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: superfly/flyctl-actions/setup-flyctl@master
+      - run: flyctl deploy --remote-only --config fly.staging.toml
+        working-directory: ./web
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_WEB_STAGING_API_TOKEN }}
+
+  deploy-api:
+    name: Deploy Api
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: superfly/flyctl-actions/setup-flyctl@master
+      - run: flyctl deploy --remote-only --config fly.staging.toml
+        working-directory: ./api
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_API_STAGING_API_TOKEN }}

.gitignore

@@ -0,0 +1,3 @@
+*node_modules
+*.env
+*/dist

README.MD

@@ -0,0 +1,90 @@
+# React Template
+
+## Tech Stack
+
+This
+
+## Setup Runbook
+
+1.  Create a new repository with UoAWDCC as owner
+2.  Select repository template as `UoAWDCC/react-template`
+
+    ![Create Repo](images/create-repo.png)
+
+3.  Clone the app to your local machine
+
+4.  In `/api/fly.production.toml` change the app name to `wdcc-app-name-api` . For example, passport will be `wdcc-passport-api`
+    Then create the app on fly with this command:
+
+    ```jsx
+    PS C:\Users\alexw\OneDrive\Documents\GitHub\UoAWDCC\passport> fly apps create --name wdcc-passport-api --org wdcc-projects
+    New app created: wdcc-passport-api
+    ```
+
+5.  In the`/api` directory run
+
+    ```jsx
+    PS C:\Users\alexw\OneDrive\Documents\GitHub\UoAWDCC\passport\api> fly tokens create deploy --config fly.production.toml
+    FlyV1 ...IFIc=
+    ```
+
+    - Copy the output to your clipboard
+    - Go to repository settings on Github
+    - In secrets and variables select actions
+
+    ![Untitled](images/secrets.png)
+
+    - Create a new repository secret
+    - Name it `FLY_API_PRODUCTION_API_TOKEN` and paste in the secret
+
+6.  In `/api/fly.staging.toml` change the app name to `wdcc-app-name-api-staging`
+    Then create the app on fly with this command
+
+        PS C:\Users\alexw\OneDrive\Documents\GitHub\UoAWDCC\passport> fly apps create --name wdcc-passport-api-staging --org wdcc-projects
+        New app created: wdcc-passport-api-staging
+
+7.  In the `/api` directory run
+
+    ```jsx
+    PS C:\Users\alexw\OneDrive\Documents\GitHub\UoAWDCC\passport\api> fly tokens create deploy --config fly.staging.toml
+    FlyV1 ...IFIc=
+    ```
+
+    - Copy the output to your clipboard
+    - Go to repository settings on Github
+    - In secrets and variables select actions
+    - Create a new repository secret
+    - Name it `FLY_API_STAGING_API_TOKEN` and paste in the secret
+
+8.  In `/web/Dockerfile.production` change
+
+    ```jsx
+    ENV VITE_API_URL="https://react-template-api.fly.dev"
+    ```
+
+    to
+
+    ```jsx
+    ENV VITE_API_URL="https://wdcc-app-name-api.fly.dev"
+    ```
+
+    (change it to to the name of your production api app that you just created before
+
+9.  In `/web/Dockerfile.staging`change
+
+    ```jsx
+    ENV VITE_API_URL="https://react-template-api-staging.fly.dev"
+    ```
+
+    to
+
+    ```jsx
+    ENV VITE_API_URL="https://wdcc-app-name-api-staging.fly.dev"
+    ```
+
+    (change it to to the name of your staging api app that you just created before
+
+10. In `/web/fly.production.toml` change the name of the app to `wdcc-app-name` and run `fly apps create --name wdcc-app-name --org wdcc-projects`
+11. Now run `fly tokens create deploy --config fly.production.toml` and save that as a Github repository secret with the name `FLY_WEB_PRODUCTION_API_TOKEN`
+12. In `/web/fly.staging.toml` change the name of the app to `wdcc-app-name-staging` and run `fly apps create --name wdcc-app-name-staging --org wdcc-projects`
+13. Now run `fly tokens create deploy --config fly.staging.toml` and save that as a Github repository secret with the name `FLY_WEB_STAGING_API_TOKEN`

api/.dockerignore

@@ -0,0 +1,2 @@
+node_modules
+dist

api/Dockerfile

@@ -0,0 +1,44 @@
+# syntax = docker/dockerfile:1
+# Adjust NODE_VERSION as desired
+ARG NODE_VERSION=18.19.0
+FROM node:${NODE_VERSION}-slim as base
+
+LABEL fly_launch_runtime="Node.js"
+
+# Node.js app lives here
+WORKDIR /app
+
+# Set production environment
+ARG YARN_VERSION=1.22.19
+RUN npm install -g yarn@$YARN_VERSION --force
+
+
+# Throw-away build stage to reduce size of final image
+FROM base as install 
+
+# Install packages needed to build node modules
+RUN apt-get update -qq && \
+    apt-get install --no-install-recommends -y build-essential node-gyp pkg-config python-is-python3
+
+# Install node modules
+COPY --link package.json yarn.lock ./
+RUN yarn install --frozen-lockfile
+
+# Copy application code
+COPY --link . .
+
+FROM base as build
+
+COPY --from=install /app /app
+
+RUN yarn run build
+
+# Final stage for app image
+FROM base
+
+# Copy built application
+COPY --from=build /app /app
+
+# Start the server by default, this can be overwritten at runtime
+EXPOSE 3000
+CMD [ "yarn", "run", "start" ]

api/db/User.ts

@@ -0,0 +1,20 @@
+import { Schema, model } from 'mongoose';
+
+const userSchema = new Schema({
+  firstName: {
+    type: String,
+    required: true,
+  },
+  lastName: String,
+  email: {
+    type: String,
+    required: true,
+    unique: true,
+    maxLength: 40,
+    minLength: 1,
+  },
+});
+
+const User = model('User', userSchema);
+
+export default User;

api/fly.production.toml

@@ -0,0 +1,18 @@
+app = 'react-template-api'
+primary_region = 'syd'
+
+[build]
+  dockerfile = "Dockerfile"
+
+[http_service]
+  internal_port = 3000
+  force_https = true
+  auto_stop_machines = true
+  auto_start_machines = true
+  min_machines_running = 0
+  processes = ['app']
+
+[[vm]]
+  cpu_kind = 'shared'
+  cpus = 4
+  memory_mb = 2048

api/fly.staging.toml

@@ -0,0 +1,18 @@
+app = 'react-template-api-staging'
+primary_region = 'syd'
+
+[build]
+  dockerfile = "Dockerfile"
+
+[http_service]
+  internal_port = 3000
+  force_https = true
+  auto_stop_machines = true
+  auto_start_machines = true
+  min_machines_running = 0
+  processes = ['app']
+
+[[vm]]
+  cpu_kind = 'shared'
+  cpus = 1
+  memory_mb = 1024

api/index.ts

@@ -0,0 +1,25 @@
+import express, { json } from 'express';
+import cors from 'cors';
+import { connect } from 'mongoose';
+import { config } from 'dotenv';
+
+// Import Routers
+import helloRoutes from './routes/hello';
+
+const app = express();
+config();
+
+// const databaseUrl: string = process.env.DATABASE_URL!;
+// connect(databaseUrl);
+
+app.use(json());
+app.use(cors());
+app.use(express.static('public'));
+
+// Routes
+app.use('/hello', helloRoutes);
+
+const port = Number.parseInt(process.env.PORT || '3000');
+app.listen(port, () => {
+  console.log(`Listening on port ${port}`);
+});

api/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "passport-api",
+  "version": "0.0.0",
+  "main": "index.js",
+  "repository": "https://github.com/UoAWDCC/passport",
+  "author": "WDCC Projects <[email protected]>",
+  "license": "MIT",
+  "private": true,
+  "scripts": {
+    "build": "tsc",
+    "start": "node dist/index.js",
+    "dev": "nodemon index.ts",
+    "email": "email dev"
+  },
+  "devDependencies": {
+    "@types/jsonwebtoken": "^9.0.5",
+    "@types/node": "^20.11.17",
+    "@types/react": "^18.2.55",
+    "@types/react-dom": "^18.2.18",
+    "nodemon": "^3.0.3",
+    "typescript": "^5.3.3"
+  },
+  "dependencies": {
+    "@types/cors": "^2.8.17",
+    "@types/express": "^4.17.21",
+    "@types/nodemailer": "^6.4.14",
+    "cors": "^2.8.5",
+    "dotenv": "^16.4.1",
+    "express": "^4.18.2",
+    "express-cors": "^0.0.3",
+    "jsonwebtoken": "^9.0.2",
+    "mongoose": "^8.1.1",
+    "ts-node": "^10.9.2",
+    "zod": "^3.22.4"
+  }
+}

api/routes/hello.ts

@@ -0,0 +1,23 @@
+/* 
+  Example Route File
+*/
+import { Router } from 'express';
+import type { Request, Response } from 'express';
+import { z } from 'zod';
+
+const helloRoutes = Router();
+
+helloRoutes.get('/:name', async (req: Request, res: Response) => {
+  const Name = z.object({
+    name: z.string(),
+  });
+
+  const result = Name.safeParse(req.params);
+  if (!result.success) return res.status(400).send(result.error);
+
+  const { name }: z.infer<typeof Name> = result.data;
+
+  return res.status(200).send(`Kia Ora ${name}`);
+});
+
+export default helloRoutes;