Shift to Svelte and DRF (#12)

* Shift to Svelte and DRF

* Changed the tests to make it correct, and update README

* Updated README file

* Added some more components

* Removed Django static assets

* Fixed some URLs

* Added file mounts for code and updated README

* Fix issues with development workflow

* Fix some more issues

* Add Storybook

* Configure storybook to work with tailwind

* Fixed some issues with storybook

* Run pre-commit on all files

Signed-off-by: Nishant Nayak <nishantnayak2001@gmail.com>

* Update the base_url for Django for ease of development

Signed-off-by: Nishant Nayak <nishantnayak2001@gmail.com>

* Update README.md

Signed-off-by: Nishant Nayak <nishantnayak2001@gmail.com>

---------

Signed-off-by: Nishant Nayak <nishantnayak2001@gmail.com>
Co-authored-by: Nishant Nayak <nishantnayak2001@gmail.com>

.github/workflows/django_tests.yml

@@ -10,13 +10,13 @@ jobs:
         uses: actions/checkout@v3
 
       - name: Copy config files
-        run: cp .env.example .env
+        run: cp env.example .env
 
       - name: Start Containers
         run: docker compose -f "docker-compose.yml" up -d --build
 
       - name: Run Tests
-        run: docker compose exec web python manage.py test
+        run: docker compose exec backend python manage.py test
 
       - name: Stop Containers
         if: always()

.gitignore

@@ -10,7 +10,7 @@ local_settings.py
 db.sqlite3
 db.sqlite3-journal
 media
-static
+backend/static
 
 # 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.
@@ -167,7 +167,7 @@ dmypy.json
 cython_debug/
 
 # VSCode
-.vscode/*
+.vscode/
 
 # PyCharm
 #  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
@@ -178,6 +178,6 @@ cython_debug/
 
 # End of https://www.toptal.com/developers/gitignore/api/django
 
-# Corpus Specific gitignores
-django.env
-mariadb.env
+# Node Modules
+node_modules/
+.svelte-kit/

.tool-versions

@@ -1 +1,2 @@
 python 3.11.1
+nodejs 18.16.0

README.md

@@ -4,10 +4,10 @@ A Django based web application to manage all things IEEE NITK.
 
 ## Setup Instructions
 
-1. Run the following command to create a copy of the environment file.
+1. Run the following command to create a copy of the environment file. Change the environment variables as necessary in the copied file.
 
 ```sh
-cp .env.example .env
+cp env.example .env
 ```
 
 2. Run docker compose
@@ -30,4 +30,68 @@ docker compose down
 
 To remove all the previous data as well, you will have to remove the volumes too. You can do that by appending `-v` to the `down` command.
 
-For more guidance, refer to the [Docker Compose](https://docs.docker.com/compose/) documentation.
+For more guidance, refer to the [Docker Compose](https://docs.docker.com/compose/) documentation.
+
+## Development Instructions
+
+Versions for all the languages used in the project can be found in the `.tool-versions` file. Support will be provided for all Unix (MacOS, Debian/Ubuntu) based systems. If you choose to develop on Windows, we cannot promise anything xD. We also will not be supporting RHEL-based operating systems.
+
+If you do not have access to a Unix machine, Docker is the recommended way for development.
+
+### Docker Development
+
+This is the preferred way for development. All modern editors allow you to open code in Docker containers remotely. If that is not possible, all code is mounted to Docker containers, so you can make changes that can be checked live.
+
+For development, use the development Docker Compose file.
+
+```shell
+cp env.example .env
+
+# Make required changes to the .env file
+
+docker compose -f dev-docker-compose.yml up --build
+```
+
+This Compose file will mount your codebase and add automatic reloading to the frontend code.
+
+If you still choose to go ahead and work on development on individual folders, instructions are given below. However, before development, make sure you source the `.env` file so that all necessary environment variables are picked up.
+
+```shell
+set -a
+source .env
+```
+
+### Frontend
+
+To work on the frontend, make sure you have Nodejs installed on your system. Once you have done that, you can install dependencies and run the server.
+
+```sh
+npm install
+npm run dev
+```
+
+Make sure you properly mark any unnecessary and script generated files in `.gitignore` and `.dockerignore` files.
+
+### Backend
+
+The backend is a Django Rest Framework application. The recommended approach is to create a Python virtual environment, and setup the project.
+
+```sh
+python -m venv venv
+source venv/bin/activate (on Windows: venv\Scripts\activate)
+pip install --upgrade pip
+pip install -r requirements.txt
+```
+
+After installing dependencies, you can setup the Django Project.
+
+```sh
+python manage.py makemigrations
+python manage.py migrate
+python manage.py createsuperuser
+python manage.py runserver
+```
+
+Corpus depends on PostgreSQL. You might have it setup on your local system, or running it as a Docker container. Please make sure that you edit your environment variables accordingly so that proper configurations are set. You may also change the `ENVIRONMENT` to `DEVELOPMENT` to ensure that you have the Django debugging features available.
+
+_--- Made and maintained by the Corpus team, IEEE NITK ---_

corpus/Dockerfile → backend/Dockerfile

@@ -1,16 +1,16 @@
-FROM python:3.11.1-alpine3.17
+FROM python:3.11.1-slim-buster
 
-WORKDIR /usr/src/app
+RUN mkdir /corpus
+WORKDIR /corpus
 
 ENV PYTHONDONTWRITEBYTECODE 1
 ENV PYTHONUNBUFFERED 1
 
-RUN apk add --no-cache mariadb-connector-c-dev g++ make bash
-COPY requirements.txt .
-COPY start.sh .
+RUN apt update && apt install -y gcc libpq-dev
 
+COPY requirements.txt .
 RUN pip install --upgrade pip
 RUN pip install -r requirements.txt
 
+COPY . .
 RUN chmod +x ./start.sh
-CMD [ "/usr/src/app/start.sh" ]

corpus/corpus/asgi.py → backend/corpus/asgi.py

@@ -4,13 +4,12 @@
 It exposes the ASGI callable as a module-level variable named ``application``.
 
 For more information on this file, see
-https://docs.djangoproject.com/en/4.1/howto/deployment/asgi/
+https://docs.djangoproject.com/en/4.2/howto/deployment/asgi/
 """
-
 import os
 
 from django.core.asgi import get_asgi_application
 
-os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'corpus.settings')
+os.environ.setdefault("DJANGO_SETTINGS_MODULE", "corpus.settings")
 
 application = get_asgi_application()

backend/corpus/base_url.py

@@ -0,0 +1,7 @@
+from django.urls import include
+from django.urls import path
+
+# DO NOT EDIT!
+# This file is used for convenience since nginx routes all requests
+# to the /api/ endpoint.
+urlpatterns = [path("api/", include("corpus.urls"))]

corpus/corpus/settings.py → backend/corpus/settings.py

@@ -1,38 +1,34 @@
 """
 Django settings for corpus project.
 
-Generated by 'django-admin startproject' using Django 4.1.3.
+Generated by 'django-admin startproject' using Django 4.2.2.
 
 For more information on this file, see
-https://docs.djangoproject.com/en/4.1/topics/settings/
+https://docs.djangoproject.com/en/4.2/topics/settings/
 
 For the full list of settings and their values, see
-https://docs.djangoproject.com/en/4.1/ref/settings/
+https://docs.djangoproject.com/en/4.2/ref/settings/
 """
 import os
 from pathlib import Path
 
-from dotenv import load_dotenv
-
-load_dotenv()
-
 # 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/4.1/howto/deployment/checklist/
+# See https://docs.djangoproject.com/en/4.2/howto/deployment/checklist/
 
 # SECURITY WARNING: keep the secret key used in production secret!
-SECRET_KEY = os.environ["DJANGO_SECRET"]
+SECRET_KEY = os.environ["SECRET_KEY"]
 
 # SECURITY WARNING: don't run with debug turned on in production!
-DEBUG = os.environ["DEBUG"] == "True"
+DEBUG = os.environ["ENVIRONMENT"] == "DEVELOPMENT"
+
+ALLOWED_HOSTS = ["localhost", "127.0.0.1"]
+if os.environ["ENVIRONMENT"] == "PRODUCTION":
+    ALLOWED_HOSTS.append("ieee.nitk.ac.in")
 
-if DEBUG:
-    ALLOWED_HOSTS = ["localhost", "127.0.0.1", "wpad"]
-else:
-    ALLOWED_HOSTS = ["ieee.nitk.ac.in"]
 
 # Application definition
 
@@ -43,6 +39,7 @@
     "django.contrib.sessions",
     "django.contrib.messages",
     "django.contrib.staticfiles",
+    "rest_framework",
 ]
 
 MIDDLEWARE = [
@@ -55,7 +52,7 @@
     "django.middleware.clickjacking.XFrameOptionsMiddleware",
 ]
 
-ROOT_URLCONF = "corpus.urls"
+ROOT_URLCONF = "corpus.base_url"
 
 TEMPLATES = [
     {
@@ -77,25 +74,22 @@
 
 
 # Database
-# https://docs.djangoproject.com/en/4.1/ref/settings/#databases
+# https://docs.djangoproject.com/en/4.2/ref/settings/#databases
 
 DATABASES = {
     "default": {
-        "ENGINE": "django.db.backends.mysql",
-        "NAME": os.environ["DB_NAME"],
-        "USER": os.environ["DB_USER"],
-        "PASSWORD": os.environ["DB_PASSWORD"],
-        "HOST": os.environ["DB_HOST"],
-        "PORT": os.environ["DB_PORT"],
-        "OPTIONS": {
-            "init_command": "SET sql_mode='STRICT_TRANS_TABLES', innodb_strict_mode=1",
-        },
+        "ENGINE": "django.db.backends.postgresql",
+        "NAME": os.environ["POSTGRES_DB"],
+        "USER": os.environ["POSTGRES_USER"],
+        "PASSWORD": os.environ["POSTGRES_PASSWORD"],
+        "HOST": os.environ["POSTGRES_HOST"],
+        "PORT": os.environ["POSTGRES_PORT"],
     }
 }
 
 
 # Password validation
-# https://docs.djangoproject.com/en/4.1/ref/settings/#auth-password-validators
+# https://docs.djangoproject.com/en/4.2/ref/settings/#auth-password-validators
 
 AUTH_PASSWORD_VALIDATORS = [
     {
@@ -114,7 +108,7 @@
 
 
 # Internationalization
-# https://docs.djangoproject.com/en/4.1/topics/i18n/
+# https://docs.djangoproject.com/en/4.2/topics/i18n/
 
 LANGUAGE_CODE = "en-us"
 
@@ -126,12 +120,15 @@
 
 
 # Static files (CSS, JavaScript, Images)
-# https://docs.djangoproject.com/en/4.1/howto/static-files/
+# https://docs.djangoproject.com/en/4.2/howto/static-files/
 
-STATIC_URL = "static/"
-STATIC_ROOT = BASE_DIR / "static"
+if not DEBUG:
+    STATIC_URL = "static/"
+    STATIC_ROOT = os.path.join(BASE_DIR, "static")
+else:
+    STATIC_URL = "/api/static/"
 
 # Default primary key field type
-# https://docs.djangoproject.com/en/4.1/ref/settings/#default-auto-field
+# https://docs.djangoproject.com/en/4.2/ref/settings/#default-auto-field
 
 DEFAULT_AUTO_FIELD = "django.db.models.BigAutoField"

corpus/corpus/urls.py → backend/corpus/urls.py

@@ -1,7 +1,8 @@
-"""corpus URL Configuration
+"""
+URL configuration for corpus project.
 
 The `urlpatterns` list routes URLs to views. For more information please see:
-    https://docs.djangoproject.com/en/4.1/topics/http/urls/
+    https://docs.djangoproject.com/en/4.2/topics/http/urls/
 Examples:
 Function views
     1. Add an import:  from my_app import views
@@ -14,8 +15,10 @@
     2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
 """
 from django.contrib import admin
+from django.urls import include
 from django.urls import path
 
 urlpatterns = [
-    path('admin/', admin.site.urls),
+    path("admin/", admin.site.urls),
+    path("api-auth/", include("rest_framework.urls")),
 ]

corpus/corpus/wsgi.py → backend/corpus/wsgi.py

@@ -4,13 +4,12 @@
 It exposes the WSGI callable as a module-level variable named ``application``.
 
 For more information on this file, see
-https://docs.djangoproject.com/en/4.1/howto/deployment/wsgi/
+https://docs.djangoproject.com/en/4.2/howto/deployment/wsgi/
 """
-
 import os
 
 from django.core.wsgi import get_wsgi_application
 
-os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'corpus.settings')
+os.environ.setdefault("DJANGO_SETTINGS_MODULE", "corpus.settings")
 
 application = get_wsgi_application()

backend/dev-Dockerfile

@@ -0,0 +1,13 @@
+FROM python:3.11.1-slim-buster
+
+RUN mkdir /corpus
+WORKDIR /corpus
+
+ENV PYTHONDONTWRITEBYTECODE 1
+ENV PYTHONUNBUFFERED 1
+
+RUN apt update && apt install -y gcc libpq-dev
+
+COPY requirements.txt .
+RUN pip install --upgrade pip
+RUN pip install -r requirements.txt

corpus/manage.py → backend/manage.py

@@ -6,7 +6,7 @@
 
 def main():
     """Run administrative tasks."""
-    os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'corpus.settings')
+    os.environ.setdefault("DJANGO_SETTINGS_MODULE", "corpus.settings")
     try:
         from django.core.management import execute_from_command_line
     except ImportError as exc:
@@ -18,5 +18,5 @@ def main():
     execute_from_command_line(sys.argv)
 
 
-if __name__ == '__main__':
+if __name__ == "__main__":
     main()