Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Initial Setup #3

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 17 additions & 0 deletions .env.declaration
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
#
# This source file is part of the Stanford Biodesign Digital Health Spezi Web Template Application open-source project
#
# SPDX-FileCopyrightText: 2023 Stanford University and the project authors (see CONTRIBUTORS.md)
#
# SPDX-License-Identifier: MIT
#

# File is needed for https://github.com/garronej/vite-envs, allowing
# for dynamic configuration via environment variables in Vite
VITE_PUBLIC_FIREBASE_API_KEY=''
VITE_PUBLIC_FIREBASE_APP_ID=''
VITE_PUBLIC_FIREBASE_AUTH_DOMAIN=''
VITE_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=''
VITE_PUBLIC_FIREBASE_PROJECT_ID=''
VITE_PUBLIC_FIREBASE_STORAGE_BUCKET=''
VITE_PUBLIC_EMULATOR=''
23 changes: 19 additions & 4 deletions .eslintrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,13 @@
"parserOptions": {
"project": "./tsconfig.json"
},
"settings": {
"import/resolver": {
"typescript": {
"project": ["./tsconfig.json"]
}
}
},
"parser": "@typescript-eslint/parser",
"extends": [
"plugin:@typescript-eslint/strict-type-checked",
Expand All @@ -16,8 +23,8 @@
"**/dist/*",
"/docs/**",
"/out/**",
"**/jest.config.js",
"**/next.config.js",
"/coverage/**",
"/public/authServiceWorker.js",
"**/postcss.config.js",
"**/tailwind.config.js"
],
Expand Down Expand Up @@ -77,6 +84,11 @@
// false negatives
"import/namespace": ["off"],
"no-empty-pattern": "off",
"@typescript-eslint/no-empty-object-type": [
"error",
// `interface SpecificVariantProps extends VariantProps {}` is fine
{ "allowInterfaces": "with-single-extends" }
],
// make sure to `await` inside try…catch
"@typescript-eslint/return-await": ["error", "in-try-catch"],
"@typescript-eslint/no-confusing-void-expression": [
Expand All @@ -99,11 +111,14 @@
"error",
{ "allowNumber": true, "allowBoolean": true }
],
"react/no-unescaped-entities": "off"
"react/no-unescaped-entities": "off",
// some tanstack router functions result are thrown, like notFound
"@typescript-eslint/only-throw-error": "off",
"@next/next/no-img-element": "off"
},
"overrides": [
{
"files": ["app/**/*.ts?(x)", "**/*.stories.ts?(x)"],
"files": ["app/**/*.ts?(x)", "**/*.stories.ts?(x)", "vite.config.ts"],
"rules": {
"import/no-default-export": "off"
}
Expand Down
5 changes: 5 additions & 0 deletions .firebaserc
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"projects": {
"default": "hrtex-3-dev"
}
}
4 changes: 4 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -51,3 +51,7 @@ docs

# editors
.idea/

# firebase
serviceAccountKey.json
*.log
12 changes: 5 additions & 7 deletions CITATION.cff
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
#
# This source file is part of the Stanford Biodesign Digital Health Next.js Template open-source project
# This source file is part of the Stanford Biodesign Digital Health Spezi Web Template Application open-source project
#
# SPDX-FileCopyrightText: 2023 Stanford University and the project authors (see CONTRIBUTORS.md)
#
Expand All @@ -12,9 +12,7 @@ authors:
- family-names: 'Schmiedmayer'
given-names: 'Paul'
orcid: 'https://orcid.org/0000-0002-8607-9148'
- family-names: 'Ravi'
given-names: 'Vishnu'
orcid: 'https://orcid.org/0000-0003-0359-1275'
title: 'NextJSTemplate'
doi: '10.5281/zenodo.10052055'
url: 'https://github.com/StanfordBDHG/NextJSTemplate'
- family-names: 'Nikolai'
given-names: 'Madlener'
title: 'Stanford Biodesign Digital Health Spezi Web Template Application'
url: 'https://github.com/StanfordSpezi/spezi-web-template-application'
6 changes: 3 additions & 3 deletions CONTRIBUTORS.md
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
<!--

This source file is part of the Stanford Biodesign Digital Health Next.js Template open-source project
This source file is part of the Stanford Biodesign Digital Health Spezi Web Template Application open-source project

SPDX-FileCopyrightText: 2023 Stanford University and the project authors (see CONTRIBUTORS.md)

SPDX-License-Identifier: MIT

-->

# Stanford Biodesign Digital Health Next.js Template Contributors
# Stanford Biodesign Digital Health Spezi Web Template Application open-source project

- [Paul Schmiedmayer](https://github.com/PSchmiedmayer)
- [Vishnu Ravi](https://github.com/vishnuravi)
- [Nikolai Madlener](https://github.com/NikolaiMadlener)
58 changes: 11 additions & 47 deletions Dockerfile
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
#
# This source file is part of the Stanford Biodesign Digital Health Next.js Template open-source project
# This source file is part of the Stanford Biodesign Digital Health Spezi Web Template Application open-source project
# Based on the docker file found at https://github.com/vercel/next.js/blob/canary/examples/with-docker/Dockerfile.
#
# SPDX-FileCopyrightText: 2023 Stanford University and the project authors (see CONTRIBUTORS.md)
Expand All @@ -8,60 +8,24 @@
#


FROM node:18-alpine AS base
FROM node:latest AS build

# Install dependencies only when needed
FROM base AS deps
# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
RUN apk add --no-cache libc6-compat
RUN mkdir /app
WORKDIR /app

# Install dependencies based on the preferred package manager
COPY package.json package-lock.json ./
RUN npm ci


# Rebuild the source code only when needed
FROM base AS builder
WORKDIR /app
COPY --from=deps /app/node_modules ./node_modules
COPY . .

# Next.js collects completely anonymous telemetry data about general usage.
# Learn more here: https://nextjs.org/telemetry
# Uncomment the following line in case you want to disable telemetry during the build.
ENV NEXT_TELEMETRY_DISABLED 1

RUN npm ci
RUN npm run build

# Production image, copy all the files and run next
FROM base AS runner
WORKDIR /app
FROM nginx:stable-alpine

ENV NODE_ENV production
# Uncomment the following line in case you want to disable telemetry during runtime.
# ENV NEXT_TELEMETRY_DISABLED 1

RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs

COPY --from=builder /app/public ./public

# Set the correct permission for prerender cache
RUN mkdir .next
RUN chown nextjs:nodejs .next

# Automatically leverage output traces to reduce image size
# https://nextjs.org/docs/advanced-features/output-file-tracing
COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static

USER nextjs
RUN mkdir -p /var/www
COPY --from=build /app/dist /usr/share/nginx/html
COPY nginx.conf /etc/nginx/conf.d/default.conf

EXPOSE 80

ENV PORT 80
# set hostname to localhost
ENV HOSTNAME "0.0.0.0"

CMD ["node", "server.js"]
# https://github.com/garronej/vite-envs
# enable env var configuration
ENTRYPOINT ["sh", "-c", "/usr/share/nginx/html/vite-envs.sh && nginx -g 'daemon off;'"]
71 changes: 37 additions & 34 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,33 +1,22 @@
<!--

This source file is part of the Stanford Biodesign Digital Health Next.js Template open-source project
This source file is part of the Stanford Biodesign Digital Health Spezi Web Template Application open-source project

SPDX-FileCopyrightText: 2023 Stanford University and the project authors (see CONTRIBUTORS.md)

SPDX-License-Identifier: MIT

-->

# Biodesign Digital Health Next.js Template
# Spezi Web Template Application

[![Build and Test](https://github.com/StanfordBDHG/NextJSTemplate/actions/workflows/build-and-test.yml/badge.svg)](https://github.com/StanfordBDHG/NextJSTemplate/actions/workflows/build-and-test.yml)
[![Deployment](https://github.com/StanfordBDHG/NextJSTemplate/actions/workflows/main.yml/badge.svg)](https://github.com/StanfordBDHG/NextJSTemplate/actions/workflows/main.yml)
[![codecov](https://codecov.io/gh/StanfordBDHG/NextJSTemplate/graph/badge.svg?token=dfQW5eZ2up)](https://codecov.io/gh/StanfordBDHG/NextJSTemplate)
[![DOI](https://zenodo.org/badge/DOI/10.5281/zenodo.10052055.svg)](https://doi.org/10.5281/zenodo.10052055)
[![Build and Test](https://github.com/StanfordSpezi/spezi-web-design-system/actions/workflows/build-and-test.yml/badge.svg)](https://github.com/StanfordSpezi/spezi-web-design-system/actions/workflows/build-and-test.yml)
[![Deployment](https://github.com/StanfordSpezi/spezi-web-design-system/actions/workflows/deployment.yml/badge.svg)](https://github.com/StanfordSpezi/spezi-web-design-system/actions/workflows/deployment.yml)
<!-- [![codecov](https://github.com/StanfordSpezi/spezi-web-design-system/graph/badge.svg?token=PsKyNz7Woe)](https://codecov.io/gh/StanfordBDHG/ENGAGE-HF-Web-Frontend) -->

## How To Use This Template
## How To Use

The template repository contains a template for a Next.js project providing automated GitHub Actions and setups for code linting, testing & test coverage reports, docker deployments, a docker compose setup, local packages for modular deployment, and documentation generation & deployment.

Follow these steps to customize it to your needs:

1. Rename the Next.js project.
2. Modify, add, or remove the local packages found at `/packages/*` to separate code into smaller modules.
3. Add dependencies and edit the project in `/app` and the local Node packages.

The main application is automatically deployed to https://stanfordbdhg.github.io/NextJSTemplate/.

The documentation of the local packages is automatically deployed to https://stanfordbdhg.github.io/NextJSTemplate/docs.
This repository contains the Spezi Web Template Application. It demonstrates using the Spezi Web ecosystem to build a modern digital health web application.

## Getting Started

Expand All @@ -39,46 +28,60 @@ You can run the project using the following command. You will need to install No
npm install
```

1. Start the Next.js Application
2. Setup Firebase Environment Values

Create an `.env.local` file or inject the following environment variables required for the Google Firebase Setup:

```
VITE_PUBLIC_FIREBASE_API_KEY=
VITE_PUBLIC_FIREBASE_AUTH_DOMAIN=
VITE_PUBLIC_FIREBASE_PROJECT_ID=
VITE_PUBLIC_FIREBASE_STORAGE_BUCKET=
VITE_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=
VITE_PUBLIC_FIREBASE_APP_ID=
```

3. Start the Firebase Emulator Suite

```bash
npm run dev
firebase emulators:start
```

4. Optionally Seed the Firestore Database

```bash
npm run seed
```

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.<!-- markdown-link-check-disable-line -->
5. Start the Spezi Web Template Application

You can edit the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
```bash
npm run dev
```

Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.<!-- markdown-link-check-disable-line -->

## Docker

1. [Install Docker](https://docs.docker.com/get-docker/) on your machine.
2. Build the image and run the docker compose setup: `docker compose -f docker-compose-development.yml up`.

You can view your images created with `docker images`.
You can view the images you create with `docker images`.

Open [http://localhost](http://localhost) with your browser to see the result. You can visit [http://localhost:8080](http://localhost:8080) to see the reverse proxy setup before the main application.<!-- markdown-link-check-disable-line -->

The `docker-compose.yml` setup contains a production-ready setup using a reverse proxy.

Every version of the application on the `main` branch is automatically packaged into docker images using the `main` tag. Every release is also published using the `latest` and respective version tags.

## 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.

You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!

## License

This project is licensed under the MIT License. See [Licenses](https://github.com/StanfordBDHG/NextJSTemplate/tree/main/LICENSES) for more information.
This project is licensed under the MIT License. See [Licenses](https://github.com/StanfordSpezi/spezi-web-design-system/tree/main/LICENSES) for more information.

## Contributors

This project is developed as part of the Stanford Byers Center for Biodesign at Stanford University.
See [CONTRIBUTORS.md](https://github.com/StanfordBDHG/NextJSTemplate/tree/main/CONTRIBUTORS.md) for a full list of all Next.js Template contributors.
See [CONTRIBUTORS.md](hhttps://github.com/StanfordSpezi/spezi-web-design-system/tree/main/CONTRIBUTORS.md) for a full list of all contributors.

![Stanford Byers Center for Biodesign Logo](https://raw.githubusercontent.com/StanfordBDHG/.github/main/assets/biodesign-footer-light.png#gh-light-mode-only)
![Stanford Byers Center for Biodesign Logo](https://raw.githubusercontent.com/StanfordBDHG/.github/main/assets/biodesign-footer-dark.png#gh-dark-mode-only)
13 changes: 0 additions & 13 deletions app/globals.css

This file was deleted.

28 changes: 0 additions & 28 deletions app/layout.tsx

This file was deleted.

34 changes: 0 additions & 34 deletions app/page.test.tsx

This file was deleted.

Loading
Loading