Added demo code

2021-08-30 10:44:17 -07:00 · 2021-08-30 10:44:17 -07:00 · 2c4b0c9190
--- a/CODE_OF_CONDUCT.md
+++ b/CODE_OF_CONDUCT.md
@ -0,0 +1,9 @@
+# Microsoft Open Source Code of Conduct
+
+This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/).
+
+Resources:
+
+- [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
+- [Microsoft Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/)
+- Contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with questions or concerns
--- a/21
+++ b/21
@ -0,0 +1,21 @@
+    MIT License
+
+    Copyright (c) Microsoft Corporation.
+
+    Permission is hereby granted, free of charge, to any person obtaining a copy
+    of this software and associated documentation files (the "Software"), to deal
+    in the Software without restriction, including without limitation the rights
+    to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+    copies of the Software, and to permit persons to whom the Software is
+    furnished to do so, subject to the following conditions:
+
+    The above copyright notice and this permission notice shall be included in all
+    copies or substantial portions of the Software.
+
+    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+    AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+    SOFTWARE
--- a/README.md
+++ b/README.md
@ -0,0 +1,35 @@
+# Beginner's Series: Django
+
+Welcome to the supporting page for [Beginner's Series: Django](https://aka.ms/BeginnersSeriesDjango)! Here you can find links to relevant resources and source code.
+
+## Learn More
+
+- [Video Series on YouTube](https://aka.ms/BeginnersSeriesDjango)
+- [Learn more on Microsoft Learn](https://aka.ms/LearnDjango)
+- [Official Documentation](https://djangoproject.com)
+- [Sample code](./relecloud/README.md)
+
+## Tooling
+
+- [Visual Studio Code](https://code.visualstudio.com)
+- [Django Extension for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=batisteo.vscode-django)
+- [Python Extension for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=ms-python.python)
+
+## Azure
+
+- [Sign up for free Azure credits](https://www.azure.com/free)
+- [Create an Azure for Students account](https://aka.ms/a4s)
+- [Azure Database for PostgreSQL - Pricing](https://azure.microsoft.com/pricing/details/postgresql/server/)
+
+## Contributing
+
+This project welcomes contributions and suggestions.  Most contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. For details, visit https://cla.opensource.microsoft.com.
+
+When you submit a pull request, a CLA bot will automatically determine whether you need to provide a CLA and decorate the PR appropriately (e.g., status check, comment). Simply follow the instructions provided by the bot. You will only need to do this once across all repos using our CLA.
+
+This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.
+
+## Trademarks
+
+This project may contain trademarks or logos for projects, products, or services. Authorized use of Microsoft trademarks or logos is subject to and must follow [Microsoft's Trademark & Brand Guidelines](https://www.microsoft.com/legal/intellectualproperty/trademarks/usage/general).
+Use of Microsoft trademarks or logos in modified versions of this project must not cause confusion or imply Microsoft sponsorship.Any use of third-party trademarks or logos are subject to those third-party's policies.
--- a/demo-code/.gitignore
+++ b/demo-code/.gitignore
@ -0,0 +1,243 @@
+# Commented out sqlite so the database will be there for testing purposes
+# db.sqlite3
+# db.sqlite3-journal
+
+
+# Created by https://www.toptal.com/developers/gitignore/api/python,django,visualstudiocode,dotenv
+# Edit at https://www.toptal.com/developers/gitignore?templates=python,django,visualstudiocode,dotenv
+
+### Django ###
+*.log
+*.pot
+*.pyc
+__pycache__/
+local_settings.py
+media
+
+# If your build process includes running collectstatic, then you probably don't need or want to include staticfiles/
+# in your Git repository. Update and uncomment the following line accordingly.
+# <django-project-name>/staticfiles/
+
+### Django.Python Stack ###
+# Byte-compiled / optimized / DLL files
+*.py[cod]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+parts/
+sdist/
+var/
+wheels/
+pip-wheel-metadata/
+share/python-wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.nox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+*.py,cover
+.hypothesis/
+.pytest_cache/
+pytestdebug.log
+
+# Translations
+*.mo
+
+# Django stuff:
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+doc/_build/
+
+# PyBuilder
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# IPython
+profile_default/
+ipython_config.py
+
+# pyenv
+.python-version
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+#Pipfile.lock
+
+# poetry
+#poetry.lock
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow
+__pypackages__/
+
+# Celery stuff
+celerybeat-schedule
+celerybeat.pid
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+# .env
+.env/
+.venv/
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+pythonenv*
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+.dmypy.json
+dmypy.json
+
+# Pyre type checker
+.pyre/
+
+# pytype static type analyzer
+.pytype/
+
+# operating system-related files
+*.DS_Store #file properties cache/storage on macOS
+Thumbs.db #thumbnail cache on Windows
+
+# profiling data
+.prof
+
+
+### dotenv ###
+.env
+
+### Python ###
+# Byte-compiled / optimized / DLL files
+
+# C extensions
+
+# Distribution / packaging
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+
+# Installer logs
+
+# Unit test / coverage reports
+
+# Translations
+
+# Django stuff:
+
+# Flask stuff:
+
+# Scrapy stuff:
+
+# Sphinx documentation
+
+# PyBuilder
+
+# Jupyter Notebook
+
+# IPython
+
+# pyenv
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+
+# poetry
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow
+
+# Celery stuff
+
+# SageMath parsed files
+
+# Environments
+# .env
+
+# Spyder project settings
+
+# Rope project settings
+
+# mkdocs documentation
+
+# mypy
+
+# Pyre type checker
+
+# pytype static type analyzer
+
+# operating system-related files
+
+# profiling data
+
+
+### VisualStudioCode ###
+.vscode/*
+!.vscode/tasks.json
+!.vscode/launch.json
+*.code-workspace
+
+### VisualStudioCode Patch ###
+# Ignore all local history of files
+.history
+.ionide
+
+# End of https://www.toptal.com/developers/gitignore/api/python,django,visualstudiocode,dotenv
--- a/demo-code/README.md
+++ b/demo-code/README.md
@ -0,0 +1,36 @@
+# ReleCloud sample
+
+This is a sample Django project used for [Beginner's Series: Django](https://aka.ms/BeginnersSeriesDjango). It's a fictitious company offering tours to space.
+
+## Install and startup steps
+
+1. Clone the repository
+
+    ```bash
+    git clone https://github.com/microsoft/beginners-django
+    cd beginners-django/demo-code
+    ```
+
+1. Install the prerequisites
+
+    ```bash
+    # Linux/macOS/BASH
+    python3 -m venv venv
+    source ./venv/bin/activate
+    pip install -r requirements.txt
+
+    # Windows
+    python -m venv venv
+    .\\venv\\scripts\\activate
+    pip install -r requirements.txt
+    ```
+
+1. Open the project in Visual Studio Code
+
+    ```bash
+    code .
+    ```
+
+## SQLite database
+
+For this sample, the SQLite database is included. Typically this would be ignored in the .gitignore file. To ensure a working site with data was provided, the starting database is included.
--- a/demo-code/db.sqlite3
+++ b/demo-code/db.sqlite3
--- a/demo-code/manage.py
+++ b/demo-code/manage.py
@ -0,0 +1,22 @@
+#!/usr/bin/env python
+"""Django's command-line utility for administrative tasks."""
+import os
+import sys
+
+
+def main():
+    """Run administrative tasks."""
+    os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'project.settings')
+    try:
+        from django.core.management import execute_from_command_line
+    except ImportError as exc:
+        raise ImportError(
+            "Couldn't import Django. Are you sure it's installed and "
+            "available on your PYTHONPATH environment variable? Did you "
+            "forget to activate a virtual environment?"
+        ) from exc
+    execute_from_command_line(sys.argv)
+
+
+if __name__ == '__main__':
+    main()
--- a/demo-code/project/init.py
+++ b/demo-code/project/init.py
--- a/demo-code/project/asgi.py
+++ b/demo-code/project/asgi.py
@ -0,0 +1,16 @@
+"""
+ASGI config for project project.
+
+It exposes the ASGI callable as a module-level variable named ``application``.
+
+For more information on this file, see
+https://docs.djangoproject.com/en/3.1/howto/deployment/asgi/
+"""
+
+import os
+
+from django.core.asgi import get_asgi_application
+
+os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'project.settings')
+
+application = get_asgi_application()
--- a/demo-code/project/settings.py
+++ b/demo-code/project/settings.py
@ -0,0 +1,124 @@
+"""
+Django settings for project project.
+
+Generated by 'django-admin startproject' using Django 3.1.7.
+
+For more information on this file, see
+https://docs.djangoproject.com/en/3.1/topics/settings/
+
+For the full list of settings and their values, see
+https://docs.djangoproject.com/en/3.1/ref/settings/
+"""
+
+from pathlib import Path
+
+# Build paths inside the project like this: BASE_DIR / 'subdir'.
+BASE_DIR = Path(__file__).resolve().parent.parent
+
+
+# Quick-start development settings - unsuitable for production
+# See https://docs.djangoproject.com/en/3.1/howto/deployment/checklist/
+
+# SECURITY WARNING: keep the secret key used in production secret!
+SECRET_KEY = '_*&5c@1153xw6=489*2*=&*%=4)8f^m54kb@3ca-cb(wm%b@wm'
+
+# SECURITY WARNING: don't run with debug turned on in production!
+DEBUG = True
+
+ALLOWED_HOSTS = []
+
+
+# Application definition
+
+INSTALLED_APPS = [
+    'django.contrib.admin',
+    'django.contrib.auth',
+    'django.contrib.contenttypes',
+    'django.contrib.sessions',
+    'django.contrib.messages',
+    'django.contrib.staticfiles',
+    'crispy_forms',
+    'relecloud.apps.RelecloudConfig',
+]
+
+CRISPY_TEMPLATE_PACK = 'bootstrap4'
+
+MIDDLEWARE = [
+    'django.middleware.security.SecurityMiddleware',
+    'django.contrib.sessions.middleware.SessionMiddleware',
+    'django.middleware.common.CommonMiddleware',
+    'django.middleware.csrf.CsrfViewMiddleware',
+    'django.contrib.auth.middleware.AuthenticationMiddleware',
+    'django.contrib.messages.middleware.MessageMiddleware',
+    'django.middleware.clickjacking.XFrameOptionsMiddleware',
+]
+
+ROOT_URLCONF = 'project.urls'
+
+TEMPLATES = [
+    {
+        'BACKEND': 'django.template.backends.django.DjangoTemplates',
+        'DIRS': [],
+        'APP_DIRS': True,
+        'OPTIONS': {
+            'context_processors': [
+                'django.template.context_processors.debug',
+                'django.template.context_processors.request',
+                'django.contrib.auth.context_processors.auth',
+                'django.contrib.messages.context_processors.messages',
+            ],
+        },
+    },
+]
+
+WSGI_APPLICATION = 'project.wsgi.application'
+
+
+# Database
+# https://docs.djangoproject.com/en/3.1/ref/settings/#databases
+
+DATABASES = {
+    'default': {
+        'ENGINE': 'django.db.backends.sqlite3',
+        'NAME': BASE_DIR / 'db.sqlite3',
+    }
+}
+
+
+# Password validation
+# https://docs.djangoproject.com/en/3.1/ref/settings/#auth-password-validators
+
+AUTH_PASSWORD_VALIDATORS = [
+    {
+        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
+    },
+    {
+        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
+    },
+    {
+        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
+    },
+    {
+        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
+    },
+]
+
+
+# Internationalization
+# https://docs.djangoproject.com/en/3.1/topics/i18n/
+
+LANGUAGE_CODE = 'en-us'
+
+TIME_ZONE = 'UTC'
+
+USE_I18N = True
+
+USE_L10N = True
+
+USE_TZ = True
+
+
+# Static files (CSS, JavaScript, Images)
+# https://docs.djangoproject.com/en/3.1/howto/static-files/
+
+STATIC_URL = '/static/'
--- a/demo-code/project/urls.py
+++ b/demo-code/project/urls.py
@ -0,0 +1,22 @@
+"""project URL Configuration
+
+The `urlpatterns` list routes URLs to views. For more information please see:
+    https://docs.djangoproject.com/en/3.1/topics/http/urls/
+Examples:
+Function views
+    1. Add an import:  from my_app import views
+    2. Add a URL to urlpatterns:  path('', views.home, name='home')
+Class-based views
+    1. Add an import:  from other_app.views import Home
+    2. Add a URL to urlpatterns:  path('', Home.as_view(), name='home')
+Including another URLconf
+    1. Import the include() function: from django.urls import include, path
+    2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
+"""
+from django.contrib import admin
+from django.urls import path, include
+
+urlpatterns = [
+    path('', include('relecloud.urls')),
+    path('admin/', admin.site.urls),
+]
--- a/demo-code/project/wsgi.py
+++ b/demo-code/project/wsgi.py
@ -0,0 +1,16 @@
+"""
+WSGI config for project project.
+
+It exposes the WSGI callable as a module-level variable named ``application``.
+
+For more information on this file, see
+https://docs.djangoproject.com/en/3.1/howto/deployment/wsgi/
+"""
+
+import os
+
+from django.core.wsgi import get_wsgi_application
+
+os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'project.settings')
+
+application = get_wsgi_application()
--- a/demo-code/relecloud/init.py
+++ b/demo-code/relecloud/init.py
--- a/demo-code/relecloud/admin.py
+++ b/demo-code/relecloud/admin.py
@ -0,0 +1,7 @@
+from django.contrib import admin
+from . import models
+
+# Register your models here.
+admin.site.register(models.Cruise)
+admin.site.register(models.Destination)
+admin.site.register(models.InfoRequest)
--- a/demo-code/relecloud/apps.py
+++ b/demo-code/relecloud/apps.py
@ -0,0 +1,5 @@
+from django.apps import AppConfig
+
+
+class RelecloudConfig(AppConfig):
+    name = 'relecloud'
--- a/demo-code/relecloud/migrations/0001_initial.py
+++ b/demo-code/relecloud/migrations/0001_initial.py
@ -0,0 +1,40 @@
+# Generated by Django 3.1.7 on 2021-03-30 21:46
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies = [
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='Cabin',
+            fields=[
+                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('name', models.CharField(max_length=50, unique=True)),
+                ('description', models.TextField(max_length=2000)),
+            ],
+        ),
+        migrations.CreateModel(
+            name='Cruise',
+            fields=[
+                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('destination', models.CharField(max_length=50, unique=True)),
+                ('description', models.TextField(max_length=2000)),
+            ],
+        ),
+        migrations.CreateModel(
+            name='CruiseCabin',
+            fields=[
+                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('price', models.DecimalField(decimal_places=2, max_digits=10)),
+                ('cabin', models.ForeignKey(on_delete=django.db.models.deletion.PROTECT, to='relecloud.cabin')),
+                ('cruise', models.ForeignKey(on_delete=django.db.models.deletion.PROTECT, to='relecloud.cruise')),
+            ],
+        ),
+    ]
--- a/demo-code/relecloud/migrations/0002_auto_20210330_2200.py
+++ b/demo-code/relecloud/migrations/0002_auto_20210330_2200.py
@ -0,0 +1,60 @@
+# Generated by Django 3.1.7 on 2021-03-30 22:00
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('relecloud', '0001_initial'),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='Destination',
+            fields=[
+                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('name', models.CharField(max_length=50, unique=True)),
+                ('description', models.TextField(max_length=2000)),
+            ],
+        ),
+        migrations.CreateModel(
+            name='InfoRequest',
+            fields=[
+                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('name', models.CharField(max_length=50, unique=True)),
+                ('email', models.EmailField(max_length=254)),
+                ('notes', models.TextField(max_length=2000)),
+            ],
+        ),
+        migrations.RemoveField(
+            model_name='cruisecabin',
+            name='cabin',
+        ),
+        migrations.RemoveField(
+            model_name='cruisecabin',
+            name='cruise',
+        ),
+        migrations.RenameField(
+            model_name='cruise',
+            old_name='destination',
+            new_name='name',
+        ),
+        migrations.DeleteModel(
+            name='Cabin',
+        ),
+        migrations.DeleteModel(
+            name='CruiseCabin',
+        ),
+        migrations.AddField(
+            model_name='inforequest',
+            name='cruise',
+            field=models.ForeignKey(on_delete=django.db.models.deletion.PROTECT, to='relecloud.cruise'),
+        ),
+        migrations.AddField(
+            model_name='cruise',
+            name='destinations',
+            field=models.ManyToManyField(to='relecloud.Destination'),
+        ),
+    ]
--- a/demo-code/relecloud/migrations/0003_auto_20210331_1932.py
+++ b/demo-code/relecloud/migrations/0003_auto_20210331_1932.py
@ -0,0 +1,18 @@
+# Generated by Django 3.1.7 on 2021-03-31 19:32
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('relecloud', '0002_auto_20210330_2200'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='cruise',
+            name='destinations',
+            field=models.ManyToManyField(related_name='cruises', to='relecloud.Destination'),
+        ),
+    ]
--- a/demo-code/relecloud/migrations/0004_auto_20210331_2016.py
+++ b/demo-code/relecloud/migrations/0004_auto_20210331_2016.py
@ -0,0 +1,18 @@
+# Generated by Django 3.1.7 on 2021-03-31 20:16
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('relecloud', '0003_auto_20210331_1932'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='inforequest',
+            name='name',
+            field=models.CharField(max_length=50),
+        ),
+    ]
--- a/demo-code/relecloud/migrations/init.py
+++ b/demo-code/relecloud/migrations/init.py
--- a/demo-code/relecloud/models.py
+++ b/demo-code/relecloud/models.py
@ -0,0 +1,53 @@
+from django.db import models
+
+# Create your models here.
+class Destination(models.Model):
+    name = models.CharField(
+        unique=True,
+        max_length=50,
+        null=False,
+        blank=False,
+    )
+    description = models.TextField(
+        max_length=2000,
+        null=False,
+        blank=False
+    )
+    def __str__(self):
+        return self.name
+
+class Cruise(models.Model):
+    name = models.CharField(
+        unique=True,
+        max_length=50,
+        null=False,
+        blank=False,
+    )
+    description = models.TextField(
+        max_length=2000,
+        null=False,
+        blank=False
+    )
+    destinations = models.ManyToManyField(
+        Destination,
+        related_name='cruises'
+    )
+    def __str__(self):
+        return self.name
+
+class InfoRequest(models.Model):
+    name = models.CharField(
+        max_length=50,
+        null=False,
+        blank=False,
+    )
+    email = models.EmailField()
+    notes = models.TextField(
+        max_length=2000,
+        null=False,
+        blank=False
+    )
+    cruise = models.ForeignKey(
+        Cruise,
+        on_delete=models.PROTECT
+    )
--- a/demo-code/relecloud/static/res/css/theme.css
+++ b/demo-code/relecloud/static/res/css/theme.css
--- a/demo-code/relecloud/static/res/css/theme.css.map
+++ b/demo-code/relecloud/static/res/css/theme.css.map
--- a/demo-code/relecloud/static/res/img/astronaut.jpeg
+++ b/demo-code/relecloud/static/res/img/astronaut.jpeg
--- a/demo-code/relecloud/static/res/img/bit_cosmos.png
+++ b/demo-code/relecloud/static/res/img/bit_cosmos.png
--- a/demo-code/relecloud/static/res/img/cosmos-db.jpeg
+++ b/demo-code/relecloud/static/res/img/cosmos-db.jpeg
--- a/demo-code/relecloud/static/res/img/small-logo.png
+++ b/demo-code/relecloud/static/res/img/small-logo.png
--- a/demo-code/relecloud/static/scss/custom.scss
+++ b/demo-code/relecloud/static/scss/custom.scss
@ -0,0 +1,577 @@
+@import "../node_modules/bootstrap/scss/bootstrap";
+
+// Brand Colors
+$blue: #20448c;
+$indigo: #011640;
+$purple: #6232a6;
+$pink: #c04bf2;
+$red: #dc3545;
+$orange: #fd7e14;
+$yellow: #ffc107;
+$green: #28a745;
+$teal: #20c997;
+$cyan: #224d73;
+$white: #fff;
+$gray-100: #f8f9fa;
+$gray-200: #e9ecef;
+$gray-300: #dee2e6;
+$gray-400: #ced4da;
+$gray-500: #adb5bd;
+$gray-600: #868e96;
+$gray-700: #495057;
+$gray-800: #343a40;
+$gray-900: #212529;
+$black: #000;
+$grays: (100: $gray-100, 200: $gray-200, 300: $gray-300, 400: $gray-400, 500: $gray-500, 600: $gray-600, 700: $gray-700, 800: $gray-800, 900: $gray-900);
+$theme-colors: (primary: $indigo, secondary: $purple, success: $indigo, info: $cyan, warning: $pink, danger: $cyan, light: $gray-100, dark: $gray-800);
+$colors: (blue: $blue, indigo: $indigo, purple: $purple, pink: $pink, red: $red, orange: $orange, yellow: $yellow, green: $green, teal: $teal, cyan: $cyan, white: $white, gray: $gray-600,gray-dark: $gray-800);
+$theme-color-interval: 8%;
+
+
+// Spacing
+$spacer: 1rem;
+$spacers: (0: 0, 1: ($spacer * 0.25), 2: ($spacer * 0.5), 3: $spacer, 4: ($spacer * 1.5), 5: ($spacer * 3));
+$sizes: (25: 25%, 50: 50%, 75: 75%, 100: 100%);
+
+
+// Options
+$enable-rounded: true;
+$enable-shadows: false;
+$enable-gradients: false;
+$enable-transitions: true;
+$enable-hover-media-query: false;
+$enable-grid-classes: true;
+$enable-print-styles: true;
+
+
+// Body
+$body-bg: $white;
+$body-color: $indigo;
+
+
+// Links
+$link-color: $purple;
+$link-decoration: underline;
+$link-hover-color: darken($link-color, 15%);
+$link-hover-decoration: underline;
+
+
+// Grid
+$grid-breakpoints: (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px);
+$container-max-widths: (sm: 540px, md: 720px, lg: 960px, xl: 1140px);
+$grid-columns: 12;
+$grid-gutter-width: 30px;
+
+
+// Components
+$line-height-lg: 1.5;
+$line-height-sm: 1.5;
+$border-width: 1px;
+$border-radius: 0.25rem;
+$border-radius-lg: 0.3rem;
+$border-radius-sm: 0.2rem;
+$component-active-color: $white;
+$component-active-bg: theme-color('primary');
+$caret-width: 0.3em;
+$transition-base: all 0.2s ease-in-out;
+$transition-fade: opacity 0.15s linear;
+$transition-collapse: height 0.35s ease;
+
+
+// Fonts
+$font-family-sans-serif: "Raleway", Arial, sans-serif;
+$font-family-monospace: Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
+$font-family-base: $font-family-sans-serif;
+$font-size-base: 1rem;
+$font-size-lg: 1.25rem;
+$font-size-sm: 0.875rem;
+$font-weight-normal: normal;
+$font-weight-bold: bold;
+$font-weight-base: $font-weight-normal;
+$line-height-base: 1.5;
+$h1-font-size: 2.5rem;
+$h2-font-size: 2rem;
+$h3-font-size: 1.75rem;
+$h4-font-size: 1.5rem;
+$h5-font-size: 1.25rem;
+$h6-font-size: 1rem;
+$headings-margin-bottom: ($spacer / 2);
+$headings-font-family: "Elevon", Arial;
+$headings-font-weight: bold;
+$headings-line-height: 1.1;
+$headings-color: $indigo;
+$display1-size: 6rem;
+$display2-size: 5.5rem;
+$display3-size: 4.5rem;
+$display4-size: 3.5rem;
+$display1-weight: 300;
+$display2-weight: 300;
+$display3-weight: 300;
+$display4-weight: 300;
+$display-line-height: $headings-line-height;
+$lead-font-size: 1.25rem;
+$lead-font-weight: 300;
+$small-font-size: 80%;
+$text-muted: $gray-600;
+$blockquote-small-color: $gray-600;
+$blockquote-font-size: ($font-size-base * 1.25);
+$hr-border-color: rgba($black, 0.1);
+$hr-border-width: $border-width;
+$mark-padding: 0.2em;
+$dt-font-weight: $font-weight-bold;
+$kbd-box-shadow: inset 0 -0.1rem 0 rgba($black, 0.25);
+$nested-kbd-font-weight: $font-weight-bold;
+$list-inline-padding: 5px;
+$mark-bg: #fcf8e3;
+
+
+// Buttons
+$input-btn-padding-y: 0.5rem;
+$input-btn-padding-x: 0.75rem;
+$input-btn-line-height: 1.25;
+$input-btn-padding-y-sm: 0.25rem;
+$input-btn-padding-x-sm: 0.5rem;
+$input-btn-line-height-sm: 1.5;
+$input-btn-padding-y-lg: 0.5rem;
+$input-btn-padding-x-lg: 1rem;
+$input-btn-line-height-lg: 1.5;
+$btn-font-weight: $font-weight-normal;
+$btn-box-shadow: inset 0 1px 0 rgba($white, 0.15), 0 1px 1px rgba($black, 0.075);
+$btn-focus-box-shadow: 0 0 0 3px rgba(theme-color('primary'), 0.25);
+$btn-active-box-shadow: inset 0 3px 5px rgba($black, 0.125);
+$btn-link-disabled-color: $gray-600;
+$btn-block-spacing-y: 0.5rem;
+$btn-border-radius: $border-radius;
+$btn-border-radius-lg: $border-radius-lg;
+$btn-border-radius-sm: $border-radius-sm;
+$btn-transition: all 0.15s ease-in-out;
+
+
+// Forms
+$input-bg: $white;
+$input-disabled-bg: $gray-200;
+$input-color: $gray-700;
+$input-border-color: rgba($black, 0.15);
+$input-btn-border-width: $border-width;
+$input-box-shadow: inset 0 1px 1px rgba($black, 0.075);
+$input-border-radius: $border-radius;
+$input-border-radius-lg: $border-radius-lg;
+$input-border-radius-sm: $border-radius-sm;
+$input-focus-bg: $input-bg;
+$input-focus-border-color: lighten(theme-color('primary'), 25%);
+$input-focus-box-shadow: $input-box-shadow, $btn-focus-box-shadow;
+$input-focus-color: $input-color;
+$input-placeholder-color: $gray-600;
+$input-height-border: $input-btn-border-width * 2;
+$input-height-inner: ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2);
+$input-height: calc(#{$input-height-inner} + #{$input-height-border});
+$input-height-inner-sm: ($font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2);
+$input-height-sm: calc(#{$input-height-inner-sm} + #{$input-height-border});
+$input-height-inner-lg: ($font-size-sm * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2);
+$input-height-lg: calc(#{$input-height-inner-lg} + #{$input-height-border});
+$input-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
+$form-text-margin-top: 0.25rem;
+$form-check-margin-bottom: 0.5rem;
+$form-check-input-gutter: 1.25rem;
+$form-check-input-margin-y: 0.25rem;
+$form-check-input-margin-x: 0.25rem;
+$form-check-inline-margin-x: 0.75rem;
+$form-group-margin-bottom: 1rem;
+$input-group-addon-bg: $gray-200;
+$input-group-addon-border-color: $input-border-color;
+$custom-control-gutter: 1.5rem;
+$custom-control-spacer-y: 0.25rem;
+$custom-control-spacer-x: 1rem;
+$custom-control-indicator-size: 1rem;
+$custom-control-indicator-bg: #ddd;
+$custom-control-indicator-bg-size: 50% 50%;
+$custom-control-indicator-box-shadow: inset 0 0.25rem 0.25rem rgba($black, 0.1);
+$custom-control-indicator-disabled-bg: $gray-200;
+$custom-control-description-disabled-color: $gray-600;
+$custom-control-indicator-checked-color: $white;
+$custom-control-indicator-checked-bg: theme-color('primary');
+$custom-control-indicator-checked-box-shadow: none;
+$custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, 0 0 0 3px theme-color('primary');
+$custom-control-indicator-active-color: $white;
+$custom-control-indicator-active-bg: lighten(theme-color('primary'), 35%);
+$custom-control-indicator-active-box-shadow: none;
+$custom-checkbox-indicator-border-radius: $border-radius;
+$custom-checkbox-indicator-indeterminate-bg: theme-color('primary');
+$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color;
+$custom-checkbox-indicator-indeterminate-box-shadow: none;
+$custom-radio-indicator-border-radius: 50%;
+$custom-select-padding-y: 0.375rem;
+$custom-select-padding-x: 0.75rem;
+$custom-select-height: $input-height;
+$custom-select-indicator-padding: 1rem;
+$custom-select-line-height: $input-btn-line-height;
+$custom-select-color: $input-color;
+$custom-select-disabled-color: $gray-600;
+$custom-select-bg: $white;
+$custom-select-disabled-bg: $gray-200;
+$custom-select-bg-size: 8px 10px;
+$custom-select-indicator-color: #333;
+$custom-select-border-width: $input-btn-border-width;
+$custom-select-border-color: $input-border-color;
+$custom-select-border-radius: $border-radius;
+$custom-select-focus-border-color: lighten(theme-color('primary'), 25%);
+$custom-select-focus-box-shadow: inset 0 1px 2px rgba($black, 0.075), 0 0 5px rgba($custom-select-focus-border-color, 0.5);
+$custom-select-font-size-sm: 75%;
+$custom-select-height-sm: $input-height-sm;
+$custom-file-height: 2.5rem;
+$custom-file-width: 14rem;
+$custom-file-focus-box-shadow: 0 0 0 0.075rem $white, 0 0 0 0.2rem theme-color('primary');
+$custom-file-padding-y: 1rem;
+$custom-file-padding-x: 0.5rem;
+$custom-file-line-height: 1.5;
+$custom-file-color: $gray-700;
+$custom-file-bg: $white;
+$custom-file-border-width: $border-width;
+$custom-file-border-color: $input-border-color;
+$custom-file-border-radius: $border-radius;
+$custom-file-box-shadow: inset 0 0.2rem 0.4rem rgba($black, 0.05);
+$custom-file-button-color: $custom-file-color;
+$custom-file-button-bg: $gray-200;
+$custom-file-text: (placeholder: (en: 'Choose file...'), button-label: (en: 'Browse'));
+$form-feedback-valid-color: theme-color('success');
+$form-feedback-invalid-color: theme-color('danger');
+
+
+// Dropdown
+$dropdown-min-width: 10rem;
+$dropdown-padding-y: 0.5rem;
+$dropdown-spacer: 0.125rem;
+$dropdown-bg: $white;
+$dropdown-border-color: rgba($black, 0.15);
+$dropdown-border-width: $border-width;
+$dropdown-divider-bg: $gray-200;
+$dropdown-box-shadow: 0 0.5rem 1rem rgba($black, 0.175);
+$dropdown-link-color: $gray-900;
+$dropdown-link-hover-color: darken($gray-900, 5%);
+$dropdown-link-hover-bg: $gray-100;
+$dropdown-link-active-color: $component-active-color;
+$dropdown-link-active-bg: $component-active-bg;
+$dropdown-link-disabled-color: $gray-600;
+$dropdown-item-padding-y: 0.25rem;
+$dropdown-item-padding-x: 1.5rem;
+$dropdown-header-color: $gray-600;
+
+
+// Navs
+$nav-link-padding-y: 0.5rem;
+$nav-link-padding-x: 1rem;
+$nav-link-disabled-color: $gray-600;
+$nav-tabs-border-color: #ddd;
+$nav-tabs-border-width: $border-width;
+$nav-tabs-border-radius: $border-radius;
+$nav-tabs-link-hover-border-color: $gray-200;
+$nav-tabs-link-active-color: $gray-700;
+$nav-tabs-link-active-bg: $body-bg;
+$nav-tabs-link-active-border-color: #ddd;
+$nav-pills-border-radius: $border-radius;
+$nav-pills-link-active-color: $component-active-color;
+$nav-pills-link-active-bg: $component-active-bg;
+
+
+// Navbar
+$navbar-padding-y: ($spacer / 2);
+$navbar-padding-x: $spacer;
+$navbar-brand-font-size: $font-size-lg;
+$nav-link-height: $navbar-brand-font-size * $line-height-base;
+$navbar-brand-height: ($font-size-base * $line-height-base + $nav-link-padding-y * 2);
+$navbar-brand-padding-y: ($navbar-brand-height - $nav-link-height) / 2;
+$navbar-toggler-padding-y: 0.25rem;
+$navbar-toggler-padding-x: 0.75rem;
+$navbar-toggler-font-size: $font-size-lg;
+$navbar-toggler-border-radius: $btn-border-radius;
+$navbar-dark-color: rgba($white, 0.5);
+$navbar-dark-hover-color: rgba($white, 0.75);
+$navbar-dark-active-color: rgba($white, 1);
+$navbar-dark-disabled-color: rgba($white, 0.25);
+$navbar-dark-toggler-border-color: rgba($white, 0.1);
+$navbar-light-color: rgba($black, 0.5);
+$navbar-light-hover-color: rgba($black, 0.7);
+$navbar-light-active-color: rgba($black, 0.9);
+$navbar-light-disabled-color: rgba($black, 0.3);
+$navbar-light-toggler-border-color: rgba($black, 0.1);
+
+
+// Tables
+$table-cell-padding: 0.75rem;
+$table-cell-padding-sm: 0.3rem;
+$table-bg: transparent;
+$table-accent-bg: rgba($black, 0.05);
+$table-hover-bg: rgba($black, 0.075);
+$table-active-bg: $table-hover-bg;
+$table-border-width: $border-width;
+$table-border-color: $gray-200;
+$table-head-bg: $gray-200;
+$table-head-color: $gray-700;
+$table-inverse-bg: $gray-900;
+$table-inverse-accent-bg: rgba($white, 0.05);
+$table-inverse-hover-bg: rgba($white, 0.075);
+$table-inverse-border-color: lighten($gray-900, 7.5%);
+$table-inverse-color: $body-bg;
+
+
+// Z Index
+$zindex-dropdown: 1000;
+$zindex-sticky: 1020;
+$zindex-fixed: 1030;
+$zindex-modal-backdrop: 1040;
+$zindex-modal: 1050;
+$zindex-popover: 1060;
+$zindex-tooltip: 1070;
+
+
+// Pagination
+$pagination-padding-y: 0.5rem;
+$pagination-padding-x: 0.75rem;
+$pagination-padding-y-sm: 0.25rem;
+$pagination-padding-x-sm: 0.5rem;
+$pagination-padding-y-lg: 0.75rem;
+$pagination-padding-x-lg: 1.5rem;
+$pagination-line-height: 1.25;
+$pagination-color: $link-color;
+$pagination-bg: $white;
+$pagination-border-width: $border-width;
+$pagination-border-color: #ddd;
+$pagination-hover-color: $link-hover-color;
+$pagination-hover-bg: $gray-200;
+$pagination-hover-border-color: #ddd;
+$pagination-active-color: $white;
+$pagination-active-bg: theme-color('primary');
+$pagination-active-border-color: theme-color('primary');
+$pagination-disabled-color: $gray-600;
+$pagination-disabled-bg: $white;
+$pagination-disabled-border-color: #ddd;
+
+
+// Jumbotron
+$jumbotron-padding: 2rem;
+$jumbotron-bg: $gray-200;
+
+
+// Cards
+$card-spacer-y: 0.75rem;
+$card-spacer-x: 1.25rem;
+$card-border-width: 1px;
+$card-border-radius: $border-radius;
+$card-border-color: rgba($black, 0.125);
+$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width});
+$card-cap-bg: rgba($black, 0.03);
+$card-bg: $white;
+$card-img-overlay-padding: 1.25rem;
+$card-deck-margin: ($grid-gutter-width / 2);
+$card-columns-count: 3;
+$card-columns-gap: 1.25rem;
+$card-columns-margin: $card-spacer-y;
+
+
+// Tooltip
+$tooltip-max-width: 200px;
+$tooltip-color: $white;
+$tooltip-bg: $black;
+$tooltip-opacity: 0.9;
+$tooltip-padding-y: 3px;
+$tooltip-padding-x: 8px;
+$tooltip-margin: 0;
+$tooltip-arrow-width: 5px;
+$tooltip-arrow-height: 5px;
+$tooltip-arrow-color: $tooltip-bg;
+
+
+// Popovers
+$popover-inner-padding: 1px;
+$popover-bg: $white;
+$popover-max-width: 276px;
+$popover-border-width: $border-width;
+$popover-border-color: rgba($black, 0.2);
+$popover-box-shadow: 0 5px 10px rgba($black, 0.2);
+$popover-header-bg: darken($popover-bg, 3%);
+$popover-header-color: $headings-color;
+$popover-header-padding-y: 8px;
+$popover-header-padding-x: 14px;
+$popover-body-color: $body-color;
+$popover-body-padding-y: 9px;
+$popover-body-padding-x: 14px;
+$popover-arrow-width: 10px;
+$popover-arrow-height: 5px;
+$popover-arrow-color: $popover-bg;
+$popover-arrow-outer-width: ($popover-arrow-width + 1px);
+$popover-arrow-outer-color: fade-in($popover-border-color, 0.05);
+
+
+// Badges
+$badge-color: $white;
+$badge-font-size: 75%;
+$badge-font-weight: $font-weight-bold;
+$badge-padding-y: 0.25em;
+$badge-padding-x: 0.4em;
+$badge-pill-padding-x: 0.6em;
+$badge-pill-border-radius: 10rem;
+
+
+// Modals
+$modal-inner-padding: 15px;
+$modal-dialog-margin: 10px;
+$modal-dialog-margin-y-sm-up: 30px;
+$modal-title-line-height: $line-height-base;
+$modal-content-bg: $white;
+$modal-content-border-color: rgba($black, 0.2);
+$modal-content-border-width: $border-width;
+$modal-content-box-shadow-xs: 0 3px 9px rgba($black, 0.5);
+$modal-content-box-shadow-sm-up: 0 5px 15px rgba($black, 0.5);
+$modal-backdrop-bg: $black;
+$modal-backdrop-opacity: 0.5;
+$modal-header-border-color: $gray-200;
+$modal-footer-border-color: $modal-header-border-color;
+$modal-header-border-width: $modal-content-border-width;
+$modal-footer-border-width: $modal-header-border-width;
+$modal-header-padding: 15px;
+$modal-lg: 800px;
+$modal-md: 500px;
+$modal-sm: 300px;
+$modal-transition: transform 0.3s ease-out;
+
+
+// Alerts
+$alert-padding-y: 0.75rem;
+$alert-padding-x: 1.25rem;
+$alert-margin-bottom: 1rem;
+$alert-border-radius: $border-radius;
+$alert-link-font-weight: $font-weight-bold;
+$alert-border-width: $border-width;
+
+
+// Progress bars
+$progress-height: 1rem;
+$progress-font-size: 0.75rem;
+$progress-bg: $gray-200;
+$progress-border-radius: $border-radius;
+$progress-box-shadow: inset 0 0.1rem 0.1rem rgba($black, 0.1);
+$progress-bar-color: $white;
+$progress-bar-bg: theme-color('primary');
+$progress-bar-animation-timing: 1s linear infinite;
+$progress-bar-transition: width 0.6s ease;
+
+
+// List group
+$list-group-bg: $white;
+$list-group-border-color: rgba($black, 0.125);
+$list-group-border-width: $border-width;
+$list-group-border-radius: $border-radius;
+$list-group-item-padding-y: 0.75rem;
+$list-group-item-padding-x: 1.25rem;
+$list-group-hover-bg: $gray-100;
+$list-group-active-color: $component-active-color;
+$list-group-active-bg: $component-active-bg;
+$list-group-active-border-color: $list-group-active-bg;
+$list-group-disabled-color: $gray-600;
+$list-group-disabled-bg: $list-group-bg;
+$list-group-action-color: $gray-700;
+$list-group-action-hover-color: $list-group-action-color;
+$list-group-action-active-color: $body-color;
+$list-group-action-active-bg: $gray-200;
+
+
+// Image thumbnails
+$thumbnail-padding: 0.25rem;
+$thumbnail-bg: $body-bg;
+$thumbnail-border-width: $border-width;
+$thumbnail-border-color: #ddd;
+$thumbnail-border-radius: $border-radius;
+$thumbnail-box-shadow: 0 1px 2px rgba($black, 0.075);
+$thumbnail-transition: all 0.2s ease-in-out;
+
+
+// Figures
+$figure-caption-font-size: 90%;
+$figure-caption-color: $gray-600;
+
+
+// Breadcrumbs
+$breadcrumb-padding-y: 0.75rem;
+$breadcrumb-padding-x: 1rem;
+$breadcrumb-item-padding: 0.5rem;
+$breadcrumb-bg: $gray-200;
+$breadcrumb-divider-color: $gray-600;
+$breadcrumb-active-color: $gray-600;
+$breadcrumb-divider: '/';
+
+
+// Carousel
+$carousel-control-color: $white;
+$carousel-control-width: 15%;
+$carousel-control-opacity: 0.5;
+$carousel-indicator-width: 30px;
+$carousel-indicator-height: 3px;
+$carousel-indicator-spacer: 3px;
+$carousel-indicator-active-bg: $white;
+$carousel-caption-width: 70%;
+$carousel-caption-color: $white;
+$carousel-control-icon-width: 20px;
+$carousel-transition: transform 0.6s ease;
+
+
+// Close
+$close-font-size: $font-size-base * 1.5;
+$close-font-weight: $font-weight-bold;
+$close-color: $black;
+$close-text-shadow: 0 1px 0 $white;
+
+
+// Code
+$code-font-size: 90%;
+$code-padding-y: 0.2rem;
+$code-padding-x: 0.4rem;
+$code-color: #bd4147;
+$code-bg: $gray-100;
+$kbd-color: $white;
+$kbd-bg: $gray-900;
+$pre-color: $gray-900;
+$pre-scrollable-max-height: 340px;
+
+
+// Options
+$enable-rounded: true;
+$enable-shadows: false;
+$enable-gradients: false;
+$enable-transitions: true;
+$enable-hover-media-query: false;
+$enable-grid-classes: true;
+$enable-print-styles: true;
+
+body {
+    font-family: $font-family-sans-serif;
+    color: $indigo;
+}
+
+.display-1, .display-2, .display-3 {
+    font-family: $headings-font-family;
+}
+
+.nav-link {
+    font-family: "Elevon", Arial
+}
+
+.navbar { 
+    font-size: 16pt !important;
+    color: white;
+}
+
+.main-header {
+    min-height: 600px;
+    border-radius: 0;
+    padding-top: 100px;
+}
+
+.main-header * {
+    color: white;
+}
+
+.bg-translucent-secondary {
+    background-color: rgba(192, 75, 242, 0.5) !important;
+}
+
+@import url("https://use.typekit.net/abj6ial.css");
--- a/demo-code/relecloud/templates/about.html
+++ b/demo-code/relecloud/templates/about.html
@ -0,0 +1,12 @@
+{% extends 'base.html' %}
+
+{% block title %}
+ReleCloud - About
+{% endblock %}
+
+{% block content %}
+<h1>About ReleCloud</h1>
+<p>
+Formed in 2021, ReleCloud is a Redmond, WA based company with our head in the clouds - or stars really. We want to offer people the best possible experience for passengers exploring space.
+</p>
+{% endblock content %}
--- a/demo-code/relecloud/templates/base.html
+++ b/demo-code/relecloud/templates/base.html
@ -0,0 +1,83 @@
+{% load static %}
+
+<html>
+
+<head>
+    <link rel="stylesheet" href="{% static 'res/css/theme.css' %}" />
+    <title>
+        {% block title %}
+        ReleCloud - Expand your horizons
+        {% endblock %}
+    </title>
+</head>
+
+<body>
+    <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-translucent-secondary">
+        <img src="{% static 'res/img/small-logo.png' %}" width="60" height="auto" alt="Rocket ship logo" />
+        <a class="navbar-brand tk-elevon" href="#">&nbsp; ReleCloud Space Tourism</a>
+        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#mainNavbar"
+            aria-controls="mainNavbar" aria-expanded="false" aria-label="Toggle navigation">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+
+        <div class="collapse navbar-collapse" id="mainNavbar">
+            <ul class="navbar-nav ml-auto">
+                <li class="nav-item">
+                    <a class="nav-link" href="{% url 'info_request' %}">Request Information</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="{% url 'destinations' %}">Destinations</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="{% url 'about' %}">About</a>
+                </li>
+                {% comment %} <li class="nav-item">
+                    <a class="nav-link" href="#">Login</a>
+                </li> {% endcomment %}
+            </ul>
+        </div>
+    </nav>
+
+    <main role="main">
+        <div class="jumbotron main-header" style="background-image: url({% static 'res/img/cosmos-db.jpeg' %}); background-size: cover;">
+            <div class="container">
+                <div class="row">
+                    <div class="col-md-4">
+                        <img src="{% static 'res/img/bit_cosmos.png' %}" class="img img-fluid" />
+                    </div>
+                    <div class="col-md-8 ml-md-auto align-self-center">
+                        <h1 class="display-1">Expand your horizons</h1>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        {% if messages %}
+            {% for message in messages %}'
+            <div class="alert alert-{{message.tags}}" role="alert">
+                <p>{{ message }}</p>
+            </div>   
+            {% endfor %}
+        {% endif %}
+
+        <div class="container">
+            <div class="row">
+                <div class="col-md-4">
+                    <img class="mr-3 img-fluid" src="{% static 'res/img/astronaut.jpeg' %}" alt="Astronaut looking into space" />
+                </div>
+                <div class="col-md-8">
+                    {% block content %}
+                    <h1 class="display-4 tk-elevon">Lorem Ipsum Dolor</h1>
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+                    {% endblock %}
+                </div>
+            </div>
+        </div>
+    </main>
+
+    <footer class="container">
+        <p>&copy; Microsoft 2021</p>
+    </footer>
+</body>
+
+</html>
--- a/demo-code/relecloud/templates/cruise_detail.html
+++ b/demo-code/relecloud/templates/cruise_detail.html
@ -0,0 +1,18 @@
+{% extends 'base.html' %}
+
+{% block title %}
+ReleCloud - {{ cruise }}
+{% endblock %}
+
+{% block content %}
+<h1>{{ cruise }}</h1>
+<p>
+{{ cruise.description }}
+</p>
+<p>You can explore {{ cruise }} on the following cruises:</p>
+<ul class="list-group">
+    {% for destination in cruise.destinations.all %}
+    <a class="list-group-item list-group-item-action" href="{% url 'destination_detail' destination.id %}">{{ destination }}</a>
+    {% endfor %}
+</ul>
+{% endblock content %}
--- a/demo-code/relecloud/templates/destination_detail.html
+++ b/demo-code/relecloud/templates/destination_detail.html
@ -0,0 +1,18 @@
+{% extends 'base.html' %}
+
+{% block title %}
+ReleCloud - {{ destination }}
+{% endblock %}
+
+{% block content %}
+<h1>{{ destination }}</h1>
+<p>
+{{ destination.description }}
+</p>
+<p>You can explore {{ destination }} on the following cruises:</p>
+<ul class="list-group">
+    {% for cruise in destination.cruises.all %}
+    <a class="list-group-item list-group-item-action" href="{% url 'cruise_detail' cruise.id %}">{{ cruise }}</a>
+    {% endfor %}
+</ul>
+{% endblock content %}
--- a/demo-code/relecloud/templates/destinations.html
+++ b/demo-code/relecloud/templates/destinations.html
@ -0,0 +1,19 @@
+{% extends 'base.html' %}
+
+{% block title %}
+ReleCloud - Destinations
+{% endblock %}
+
+{% block content %}
+<h1>Cruise destinations</h1>
+<p>
+If you can imagine it, we travel to it! Below is our list of confirmed destinations.
+</p>
+<ul class="list-group">
+    {% for destination in destinations %}
+    <a class="list-group-item list-group-item-action" href="{% url 'destination_detail' destination.id %}">
+        {{ destination }}
+    </a>
+    {% endfor %}
+</ul>
+{% endblock content %}
--- a/demo-code/relecloud/templates/index.html
+++ b/demo-code/relecloud/templates/index.html
@ -0,0 +1,12 @@
+{% extends 'base.html' %}
+
+{% block title %}
+ReleCloud - Expand your horizons
+{% endblock %}
+
+{% block content %}
+<h1>Welcome to ReleCloud</h1>
+<p>
+We are the premier space travel company. We have a scheduled first launch in 2030, but why wait? You can learn more about our destinations, and signup to be notified of our first launch. This is a once in a lifetime experience you certainly don't want to miss!
+</p>
+{% endblock content %}
--- a/demo-code/relecloud/templates/info_request_create.html
+++ b/demo-code/relecloud/templates/info_request_create.html
@ -0,0 +1,19 @@
+{% extends 'base.html' %}
+
+{% load crispy_forms_tags %}
+
+{% block title %}
+ReleCloud - Request information
+{% endblock title %}
+
+{% block content %}
+<h1>Request information</h1>
+<h2>Fillout the form below to request information about our cruises</h2>
+
+<form method="post">
+    {% csrf_token %}
+    {{ form|crispy }}
+    <button type="submit" class="btn btn-primary">Save</button>
+</form>
+
+{% endblock content %}
--- a/demo-code/relecloud/tests.py
+++ b/demo-code/relecloud/tests.py
@ -0,0 +1,3 @@
+from django.test import TestCase
+
+# Create your tests here.
--- a/demo-code/relecloud/urls.py
+++ b/demo-code/relecloud/urls.py
@ -0,0 +1,12 @@
+from django.urls import path
+
+from . import views
+
+urlpatterns = [
+    path('', views.index, name='index'),
+    path('about', views.about, name='about'),
+    path('destinations/', views.destinations, name='destinations'),
+    path('destination/<int:pk>', views.DestinationDetailView.as_view(), name='destination_detail'),
+    path('cruise/<int:pk>', views.CruiseDetailView.as_view(), name='cruise_detail'),
+    path('info_request', views.InfoRequestCreate.as_view(), name='info_request'),
+]
--- a/demo-code/relecloud/views.py
+++ b/demo-code/relecloud/views.py
@ -0,0 +1,33 @@
+from django.shortcuts import render
+from django.urls import reverse_lazy
+from . import models
+from django.views import generic
+from django.contrib.messages.views import SuccessMessageMixin
+
+# Create your views here.
+def index(request):
+    return render(request, 'index.html')
+
+def about(request):
+    return render(request, 'about.html')
+
+def destinations(request):
+    all_destinations = models.Destination.objects.all()
+    return render(request, 'destinations.html', { 'destinations': all_destinations})
+
+class DestinationDetailView(generic.DetailView):
+    template_name = 'destination_detail.html'
+    model = models.Destination
+    context_object_name = 'destination'
+
+class CruiseDetailView(generic.DetailView):
+    template_name = 'cruise_detail.html'
+    model = models.Cruise
+    context_object_name = 'cruise'
+
+class InfoRequestCreate(SuccessMessageMixin, generic.CreateView):
+    template_name = 'info_request_create.html'
+    model = models.InfoRequest
+    fields = ['name', 'email', 'cruise', 'notes']
+    success_url = reverse_lazy('index')
+    success_message = 'Thank you, %(name)s! We will email you when we have more information about %(cruise)s!'
--- a/demo-code/requirements.txt
+++ b/demo-code/requirements.txt
@ -0,0 +1,2 @@
+django
+django-crispy-forms