- Introduction
- Features
- Project Structure
- Project Setup
- Development Workflow
- Tech Stack
- Error Logging
- Deployment
- Other Services
- Contributing
- Feedback
- Acknowledgements
Website for the students at Industrial Economics and Technology Management at NTNU Trondheim. Built with Django, Next.js, and a GraphQL API. Maintained by Rubberdøk NTNU.
- 🏔 Book the luxurious cabins Oksen and Bjørnen
- 💸 Register for upcoming events and purchase tickets through Vipps
- 🎉 Find and apply for the ideal student organization at Indøk
- 🔒 Simple login through Feide
- 📝 Easily navigate through the archive of Indøk documents
frontendcontains the indokntnu.no web application, written in TypeScript with React and Next.js.srccontains the source code of the frontend.pagescontains page components, where each file corresponds to a URL on the website. For example,pages/about/board.tsxis the component that is rendered at indokntnu.no/about/board. Files/folders in [brackets] are variables in the URL, sopages/about/organizations/[slug].tsxgives access to theslugvariable in that page component, which is e.g.rubberdokin indokntnu.no/about/organizations/rubberdok.componentscontains React components used to build up the website.pages(undercomponents) are components for specific pages. The folder structure here mirrors the folders in the top-levelpages, so components for the pages inpages/eventsare incomponents/pages/events.- Other folders here are for components used across pages.
layoutscontains React components that are part of the base website layout on every page, e.g. the navigation bar and footer.graphqlcontains GraphQL queries and mutations that the frontend uses to talk to the backend API.- The folders here are grouped by backend app, so
graphql/eventscontains queries/mutations for the backend app inbackend/apps/events. - Each folder has a
queries.graphqlfile for requests that only fetch data, and amutations.graphqlfile for requests that change data.- To use a query from a
queries.graphqlfile:- Run
yarn generateinindok-web/frontendto generate data and types for the request (ending up ingenerated/graphql.ts). - At the top of the React component file where you want to use it:
import { useQuery } from "@apollo/client";import { [QUERY_NAME]Document } from "@/generated/graphql";
- Inside the component:
const { data, loading, error } = useQuery([QUERY_NAME]Document)
- Now, after checking that there is no
errororloading, we can use thedata.
- Run
- To use a query from a
- The folders here are grouped by backend app, so
themecontains customizations for Material UI, the styled component library we use for React.overridescontains customizations for specific Material UI components.
libcontains functions defined by us to make it easier to work with some of our libraries.utilscontains utility functions.
.huskyconfigures Husky, the tool we use for pre-commit hooks (checks that run on each Git commit).contentcontains files for static content used by our React components.cypressdefines our Cypress end-to-end tests, which essentially involve a robot clicking through our website to check that everything works as expected.publiccontains public files, such as images, served by our frontend.package.jsonlists the TypeScript dependencies of the project, and also defines the scripts for use by Yarn. Runningyarninstalls the dependencies listed here, while running e.g.yarn devruns the command in"scripts": ... "dev":..eslintrc.jsonconfigures ESLint, our linter (a tool to enforce code standards) for TypeScript..prettierrcconfigures Prettier, the tool we use to format our TypeScript code.codegen.ymlconfiguresgraphql-codegen, the tool we use to generate TypeScript code from our backend's GraphQL API schema and the.graphqlfiles we write in our frontend. This is what runs in theyarn generatecommand.tsconfig.jsonconfigures the rules TypeScript should enforce when type checking our code..envfiles define the environment variables for the different environments of the project (development, production, testing).- To override environment variables for your local development environment, add a
.env.localfile with your variables. This file is ignored by Git.
- To override environment variables for your local development environment, add a
backendcontains the backend server at api.indokntnu.no, written in Python with Django and Graphene.api/authcontains the logic for authenticating users on their requests.appscontains the different Django apps (essentially modules) for the backend. Each app follows this structure (or at least parts of it):fixturescontains example data for local development, loaded throughpython manage.py loaddata initial_data.migrationscontains Django files for migrating (updating) the database after every change to a Django model in the app. Most of these are generated through thepython manage.py makemigrationscommand, though some are custom-written for more complex updates of the database. The code in these files is what runs when you dopython manage.py migrate.admin.pyconfigures what parts of the app should be shown in the Django admin panel.apps.pyconfigures the app.constants.pycontains constant values used by the app.dataloader.pycontains custom logic for loading data for particular GraphQL queries (read more here).models.pydefines the Django models of the app, which is how objects of the app are stored in the database.mutations.pydefines classes for each GraphQL mutation in the app's API (GraphQL requests that change data), and their arguments.resolvers.pydefines methods for resolving each GraphQL query in the app's API (GraphQL requests that only fetch data).schema.pydefines the GraphQL schema for the app's API. It imports the mutations and query resolvers frommutations.pyandresolvers.py, and defines the types for the queries.signals.pycontains Django signals, which are functions that run on a specific trigger (e.g. when an object of a particular model is saved to the database).tests.pycontains tests of the app's logic.types.pydefines the GraphQL API types for models in the app. You can think of a type in this context as how an object is represented in our API (to our frontend), while a model is how it is represented in the database. An API type typically inherits from Graphene'sDjangoObjectTypeand bases itself on the fields of its corresponding Django model. However, it can also add custom fields that are not on the database model, in which case it defines aresolve_[field_name]on the type with the logic for resolving that field.
configconfigures the Django project, and ties together the different apps.settingscontains Django settings for the project.base.pyhas settings for every version of the project.local.pyhas settings for local development of the project.production.pyhas settings for the production environment (the live website) of the project.
urlsdefines the URL endpoints of the backend server. It follows the same file structure assettings.schema.pydefines the GraphQL schema for the whole API of the backend. It simply imports each app's schema from theirschema.pyfiles, and combines them.
decoratorsdefines our custom Python decorators, which are the functions used with the@syntax.entrypointscontains scripts for running the backend, used by Docker and our Continuous Integration pipelines.requirementslist the Python dependencies of our project, to make it easier to install with e.g.pip install -r requirements/local.txt.base.txtcontains the main dependencies for all versions of the project.local.txtincludes our Python formatter and linter for development.production.txtincludes a library for logging production errors to Sentry, our error logging service.
staticcontains static content served by our backend.templatescontains Django templates, which is HTML but with slots for inserting values in Python.utilscontains shared utility classes and functions for use by our backend.schema.jsonis a JSON representation of the backend's GraphQL API schema defined in ourschema.pyfiles. It is generated with thepython manage.py graphql_schemacommand, and can then be used by our frontend to generate TypeScript code for interacting with our API. So you can essentially think ofschema.jsonas a language-agnostic "translation step" for letting the TypeScript frontend use the API types from our Python backend.mypy.iniconfigures MyPy, a type checker for Python.pyproject.tomlconfigures Black, the tool we use to format our Python code.tox.iniconfigures flake8, our linter (a tool to enforce code standards) for Python..envfiles contain the environment variables for the different environments of the project (development, production, testing).- To override environment variables for your local development environment, add a
.envfile with your variables. This file is ignored by Git.
- To override environment variables for your local development environment, add a
.gitignoretells Git which files should not be included in the repository (these are grayed out in VSCode's file explorer).docker-compose.ymlconfigures the Docker containers that can be run with thedocker composecommand. Our frontend and backend also have aDockerfileeach for configuring their Docker containers.
With Docker below describes how to set up the project fully in Docker. This may not work perfectly for everyone, particularly those using Windows - they may instead wish to follow the steps under Without Docker. Finally, VSCode describes how to configure your development environment in the VSCode editor.
- Download, install and start Docker Desktop: https://www.docker.com/products/docker-desktop
- In the terminal, move to where you want to store the project (easiest is just where you are when you open the terminal)
- Type
git clone https://github.com/rubberdok/indok-web.git- This creates a new folder named
indok-web, which contains the project
- This creates a new folder named
- Type
cd indok-webto move into the new folder - (optional, but recommended) Set up the backend locally, to get linting, auto-complete and environment variables
- Follow steps 1-9 under Without Docker: Backend below
- (optional, but recommended) Set up the frontend locally, to get pre-commit hooks, linting, auto-complete and
environment variables
- Follow steps 1-8 under Without Docker: Frontend below
- Type
docker compose buildto build the project - Type
docker compose upto run the frontend, backend and database - Open a new terminal, and navigate back to
indok-web - Type
docker compose exec backend python manage.py migrateto update the database - Type
docker compose exec backend python manage.py loaddata initial_datato load example data into the database- Only works if you followed the backend env setup from step 5
The frontend runs on http://localhost:3000, and the backend on http://localhost:8000. The GraphQL API endpoint is http://localhost:8000/graphql, and the Django panel is at http://localhost:8000/admin.
If you want to close the app, press Ctrl + C in the terminal running Docker, or type docker compose down inside the
indok-web folder in another terminal. To start the app again, type docker compose up, also in the
indok-web folder (and make sure Docker Desktop is running!). If you want to clear the database, go to the Volumes
tab in Docker Desktop, and delete indok-web_postgres_data.
Some users, particularly those using Windows, may have issues running the app through Docker. Some functionality such as hot reloading (which drastically improves developer experience) only work when you have the whole project in WSL (Windows Subsystem for Linux, which is what Docker on Windows uses). Therefore, you may prefer to run the project without Docker — in that case, follow the below steps to set up the frontend, backend and database locally.
Before following the steps below, make sure to clone the project with Git:
- In the terminal, move to where you want to store the project (easiest is just where you are when you open the terminal)
- Type
git clone https://github.com/rubberdok/indok-web.git- This creates a new folder named
indok-web, which contains the project
- This creates a new folder named
- Type
cd indok-webto move into the new folder - If using VSCode, you can type
code .to open the current folder in VSCode
The project uses PostgreSQL as its database. Even when running the frontend and backend outside of Docker, we still recommend running Postgres through Docker, since you don't need hot reloading there and it makes the setup simpler.
To set up PostgreSQL in Docker, follow these steps:
- Download, install and start Docker Desktop: https://www.docker.com/products/docker-desktop
- Open the
indok-webfolder in VSCode - Make a new file called
.envinsidebackend - Paste the following line in that file, and save:
DB_HOST=localhost
- Navigate to
indok-webin the terminal (cd indok-web) - Type
docker compose up postgres
Now Postgres should be up and running! Leave the terminal window open to keep the database running in the background.
If you want to close the database, press Ctrl + C in the terminal running Postgres, or type docker compose down
inside the indok-web folder in another terminal. To start Postgres again, type docker compose up postgres, also in
the indok-web folder (and make sure Docker Desktop is running!). If you want to clear the database, go to the
Volumes tab in Docker Desktop, and delete indok-web_postgres_data.
If you still want to run Postgres without Docker, download and install it from here instead: https://www.postgresql.org/download/. Then follow steps 2-4 as above.
- Download and install
pyenv(Python version manager): https://github.com/pyenv/pyenv#installation- If on Windows, install
pyenv-wininstead: https://github.com/pyenv-win/pyenv-win#installation - Type
pyenv --versionin a new terminal to check that it was installed correctly
- If on Windows, install
- Type
pyenv install --list | grep " 3.9"to get the list of available Python 3.9 versions- If on Windows, type
pyenv install --list | findstr " 3.9"instead
- If on Windows, type
- Type
pyenv install 3.9.X, whereXis the latest version found from the previous step - Type
pyenv global 3.9.X, whereXis the same as the previous step- If you do not want to use Python 3.9 globally, type
pyenv local 3.9.Xinstead (make sure you are in theindok-webfolder when you do this) - Type
python --versionto verify that it has been set to3.9.X
- If you do not want to use Python 3.9 globally, type
- Type
cd indok-webto move into the project folder (if you weren't already there) - Type
python -m venv venv- This sets up a Python virtual environment, to isolate this project from others
- Type
source venv/bin/activateto activate the virtual environment- If on Windows, type
.\venv\scripts\activateinstead
- If on Windows, type
- Type
cd backendto move into thebackendfolder - Type
python -m pip install -r requirements/local.txtto install dependencies- If on Windows, also install the GTK3 runtime from the
.exehere: https://github.com/tschoonj/GTK-for-Windows-Runtime-Environment-Installer/releases (one of the Python libraries we use depends on this)
- If on Windows, also install the GTK3 runtime from the
- Ask the project maintainers for dev environment variables (not strictly required, but step 14 will not work without this)
- If you're a member of Rubberdøk:
- Go to the
#devchannel in Slack - Find the pinned post with dev environment variables
- Copy the variables for
backend/.envinto your own.envfile inindok-web/backend(make sure not to overwrite theDB_HOSTvariable from the database setup)
- Go to the
- If you're a member of Rubberdøk:
- Set the environment variable
DJANGO_READ_DOT_ENV_FILEtotrue- On Mac/Linux:
- Type
code ~/.zshrcto open thezshconfig in VSCode- If
codedoesn't work, tryopen ~/.zshrcto open it in another text editor
- If
- Paste this line somewhere in that file:
export DJANGO_READ_DOT_ENV_FILE=true - Save the file, and re-open the terminal
- Type
- On Windows (with the PowerShell terminal):
- Type
code $profileto open the PowerShell config in VSCode- If
codedoesn't work, typeecho $profileand open that file in some other text editor
- If
- Paste this line somewhere in that file:
$env:DJANGO_READ_DOT_ENV_FILE = "true" - Save the file, and re-open PowerShell
- Type
- On Mac/Linux:
- Type
python manage.py runserverto run the backend server- If it fails, make sure that you:
- are in the
indok-web/backendfolder - have your virtual environment active
- have the database running
- are in the
- If it fails, make sure that you:
- Open a new terminal (leave the previous terminal open to keep the server running!)
- Type
cd indok-webto move intoindok-web(orcd ..if you were put inindok-web/backend) - Type
source venv/bin/activate(Mac) or.\venv\scripts\activate(Windows) to re-activate the virtual environment in this new terminal - Type
cd backendto get back to the backend folder
- Type
- Type
python manage.py migrateto update the database with our backend models - Type
python manage.py loaddata initial_datato load example data into the database- This also creates an admin user with username
adminand passwordadmin123
- This also creates an admin user with username
Now the backend should be running at localhost:8000! You can check out the GraphQL API at localhost:8000/graphql, or
use the Django admin panel at localhost:8000/admin (log in with the admin user from step 14).
If you want to close the backend, press Ctrl + C in the terminal where it runs. To start it again:
- Move into the
indok-webfolder (cd indok-web) - Activate your virtual environment
- On Mac:
source venv/bin/activate - On Windows:
.\venv\scripts\activate
- On Mac:
- Move into the backend folder (
cd backend) - Type
python manage.py runserver - If you need to run migrations:
- Open a new terminal, and repeat steps 1-3
- If you've made changes to Django models and want to generate new migrations:
python manage.py makemigrations - Run migrations with
python manage.py migrate
- Download and install
nvm(Node Version Manager): https://github.com/nvm-sh/nvm#installing-and-updating- If on Windows, install
nvm-windowsinstead: https://github.com/coreybutler/nvm-windows/releases- Scroll down on that page to find
nvm-setup.exe, and download it - Open the terminal as administrator (
PowerShell/Command Prompt/Windows Terminal) - Use
cdto navigate to where you downloaded the.exefile (e.g.cd downloads) - Type
.\nvm-setup.exe, and go through the installer
- Scroll down on that page to find
- Type
nvm versionin a new terminal to check that it was installed correctly
- If on Windows, install
- Type
nvm install 16in the terminal to install Node.js version 16 - Type
nvm use 16.X.Y, where16.X.Yis the version shown in the terminal after running the previous command- If on Windows, you may have to run the terminal as administrator
- Open the
indok-webfolder in VSCode, and create a file called.env.local - Ask the project maintainers for dev environment variables
- If you're a member of Rubberdøk:
- Go to the
#devchannel in Slack - Find the pinned post with dev environment variables
- Copy the variables for
frontend/.env.localinto your own.env.localfile inindok-web/backend
- Go to the
- If you're a member of Rubberdøk:
- Type
cd indok-web/frontendto move into the frontend folder (or justcd frontendif you were already in indok-web) - Type
npm install -g yarn- This installs Yarn, which we use to manage dependencies in the frontend
- Type
yarnto fetch dependencies - Type
yarn devto run the frontend
Now the frontend should be running at localhost:3000! You can check it out in the web browser.
If you want to close the frontend, press Ctrl + C in the terminal where it runs. To start it again, type yarn dev
inside indok-web/frontend (if dependencies have changed, you may have to run yarn first).
First of all, we recommend installing the following extensions:
Next, open the indok-web folder in VSCode, create a folder called .vscode at the top level, and a settings.json
file inside that. Paste the following in it:
{
// Sets VSCode to auto-format files when saving
"editor.formatOnSave": true,
// Configures Prettier, our formatter for TypeScript
"[html][css][json][jsonc][yaml][javascript][javascriptreact][typescript][typescriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// Configures Black, our formatter for Python
"python.formatting.provider": "black",
"python.formatting.blackArgs": ["--config=backend/pyproject.toml"],
// Configures flake8, our linter for Python
"python.linting.flake8Enabled": true,
"python.linting.flake8Args": ["--config=backend/tox.ini"],
// Allows the Python VSCode extension to suggest correct auto-import paths when having the project open in indok-web
"python.analysis.extraPaths": ["backend"]
}
Finally, if you're on Mac, we recommend pressing Cmd + Shift + P, searching for "shell command", and clicking
Shell Command: Install 'code' command in PATH. This lets you open your current folder in the terminal, using code ..
The python manage.py loaddata initial_data command used in the setup above sets up one admin user and two test users:
| Username | Password | Indøk |
|---|---|---|
| eva_student | 5tgb | true |
| asbjorn_elevg | 1qaz | false |
| admin | admin123 | super |
To log in as one of these test users when testing out the frontend locally, click "Other login alternatives" on the Feide login screen, then "Feide Test Users".
An outline of how a developer may work with this project:
- Move to
indok-webin the terminal (cd indok-web) - If you are on the
mainbranch, pull the latest updates- In the terminal:
- Type
git statusto see which branch you are on - If you're not on the
mainbranch but want to move back to it, typegit checkout main - Type
git pullto get the latest updates
- Type
- In VSCode:
- Check which branch you are on in the bottom left corner of the window
- To change branch, click it and select e.g.
main
- To change branch, click it and select e.g.
- Go to the Source Control tab on the left
- Click
...->Pull
- Check which branch you are on in the bottom left corner of the window
- In the terminal:
- Run the frontend, backend and database
- With Docker:
- Have Docker Desktop open, and type
docker compose upinsideindok-web- You may sometimes have to do
docker compose buildfirst
- You may sometimes have to do
- If the backend complains about unapplied migrations:
- Open a new terminal in
indok-web - Type
docker compose exec backend python manage.py migrate
- Open a new terminal in
- Have Docker Desktop open, and type
- Without Docker (one terminal for each, in the
indok-webfolder):- Database (still with Docker):
- Type
docker compose up postgres
- Type
- Backend:
- Activate your Python virtual environment
- Mac: type
source venv/bin/activate - Windows: type
.\venv\scripts\activate - If you've followed the steps in the
#devchannel in the Rubberdøk Slack: simply typevenv
- Mac: type
- Type
cd backendto move into the backend folder - Type
python manage.py runserver - If it says you have unapplied migrations:
- Open a new terminal in
indok-web, activate your virtual environment again, thencd backend - Type
python manage.py migrate
- Open a new terminal in
- If it complains about missing dependencies:
- Close the server (
Ctrl + C) - Type
pip install -r requirements/local.txtto install dependencies - Type
python manage.py runserveragain
- Close the server (
- Activate your Python virtual environment
- Frontend:
- Type
cd frontendto move into the frontend folder - Type
yarn devto start the app - If it complains about missing dependencies:
- Close the app (
Ctrl + C) - Type
yarnto install dependencies - Type
yarn devagain
- Close the app (
- Type
- Database (still with Docker):
- With Docker:
- Open another terminal, and move back to
indok-web - Open the project in VSCode, or your favorite code editor
- Type
code .to open the current terminal folder in VSCode
- Type
- Create a new Git branch for your changes
- In the terminal:
- Type
git checkout -b add-example-featureto create a new Git branch calledadd-example-feature- Replace this name with a short, descriptive name for your branch!
- Type
- In VSCode:
- Click the branch name in the bottom left of the window, then
Create new branch...
- Click the branch name in the bottom left of the window, then
- In the terminal:
- Make your changes to the code!
- If you want to update a page on the website:
- Navigate to the file in
frontend/src/pagesthat matches the URL of the page you want to update- For example,
pages/events/index.tsxis the page component for indokntnu.no/events
- For example,
- Update the page component as you wish
- If what you want to change is not shown in the page component, it's probably in a sub-component
- Sub-components for a specific page are in
frontend/src/components/pages/...- For example, components for event pages are in
components/pages/events
- For example, components for event pages are in
- In VSCode, you can move to a sub-component on a page by right-clicking it in the HTML of the page component,
and clicking
Go to Definition
- Sub-components for a specific page are in
- If what you want to change is not shown in the page component, it's probably in a sub-component
- Navigate to the file in
- If you want to add/update a GraphQL query/mutation to fetch/change data from the backend:
- Find the
queries.graphql/mutations.graphqlfile in the appropriate feature folder underfrontend/src/graphql - Add/change your query/mutation
- Generate TypeScript code for your query/mutation
cdintofrontend, and typeyarn generate
- Find the
- If you want to add/change a field on a backend database model:
- Change the model class in the
models.pyfile, in the appropriate feature folder underbackend/apps - Generate a Django migration to update the database
cdintobackend, and typepython manage.py makemigrations(with your virtual environment activated!)- Update your local database with
python manage.py migrate- If running the backend through Docker: type
docker compose exec backend python manage.py migrateinstead
- If running the backend through Docker: type
- Change the model class in the
- If you want to add/change a field on a type in the GraphQL API:
- Change the type class in the
types.pyfile, in the appropriate feature folder underbackend/apps - If it's a new field from the type's Django model:
- Simply add the field name in the
fieldslist on the type'sMetaclass
- Simply add the field name in the
- If it's a field that only exists on the API type, but not on the database model:
- Add
field_name = graphene.FieldType()under the class name, replacingfield_nameandFieldTypewith the appropriate name and type for your field - Add a method
resolve_field_namewith the@staticmethoddecorator on the class, with the logic for how to get data for the field
- Add
- Re-generate the backend's
schema.jsoncdintobackend, and typepython manage.py graphql_schema(with your virtual environment activated!)
- Change the type class in the
- If you want to add/change a query (to fetch data) or mutation (to change data) in the GraphQL API:
- Find the query resolver method in
resolvers.py, or the mutation class inmutations.py, in the appropriate feature folder underbackend/apps- Examples:
- The resolver for the
allOrganizationsquery is theresolve_all_organizationsmethod on theOrganizationResolversclass inbackend/apps/organizations/resolvers.py - The
createOrganizationmutation corresponds to theCreateOrganizationclass inbackend/apps/organizations/mutations.py, with anOrganizationInputclass for its arguments, and amutatemethod for the actual mutation logic
- The resolver for the
- Examples:
- Add/change your query resolver method or mutation class
- If you added a new query/mutation, update the
schema.pyfile in the same folder to expose it through the API:- For a query: add a new field for the query in the
...Queriesclass, with the appropriategraphenetype for what the query returns - For a mutation: import
YourMutationclass from.mutations, and addyour_mutation = YourMutation.Field()to the...Mutationsclass (obviously replacingyour_mutation/YourMutationwith the name of your mutation)
- For a query: add a new field for the query in the
- Re-generate the backend's
schema.jsoncdintobackend, and typepython manage.py graphql_schema(with your virtual environment activated!)
- Find the query resolver method in
- If you want to update a page on the website:
- Commit your changes to Git
- If your changes are large, consider splitting it up into different commits for different files
- In the terminal:
- Type
git statusto see which files you have changed - If you want to add them all, type
git add .fromindok-web- Otherwise, you can do
git addfollowed by the path of the specific file you want to add
- Otherwise, you can do
- Type
git commit -m "add example component for example feature"- Replace the message here with your own short, descriptive message describing the changes!
- Git commit messages should be written in imperative, e.g.
addrather thanadds/added
- Type
- In VSCode:
- Go to the Source Control tab on the left
- Click
+on the files you want to add to the commit - Write a commit message in the text box, then click
Commit
- If it complains about missing
black/flake8:- This is because we have configured "pre-commit hooks" to format and lint your code on commit
- Since
blackandflake8are part of your Python virtual environment, you have to activate your virtual environment for these to work- In the terminal, type
source venv/bin/activate(Mac) /.\venv\scripts\activate(Windows) /venv(from Rubberdøk Slack) - If committing through the terminal, just run
git commitagain after this - If committing through VSCode, you may have to restart VSCode from the terminal to use your virtual environment
(
code .)
- In the terminal, type
- If you get errors from pre-commit hooks, look through the error message to see what you have to fix
- Push your branch to GitHub
- In the terminal:
- Type
git push -u origin add-example-feature, replacingadd-example-featurewith your branch name
- Type
- In VSCode:
- Go to the Source Control tab on the left
- Click
...->Push- If it asks if you want to publish your branch, click
OK
- If it asks if you want to publish your branch, click
- In the terminal:
- Make a Pull Request on GitHub
- Go to github.com/rubberdok/indok-web/branches
- Click
New Pull Requeston your branch - Write a concise, but descriptive summary of your changes
- Request a review from another developer
- Respond to any questions or concerns they may have with your Pull Request
- If an automatic test fails, click
Detailson it to see what went wrong in the logs - Once your Pull Request is approved, and the tests pass, you can merge it - now your changes are live!
- Frontend
- TypeScript (programming language, "JavaScript with types")
- React (library for building UI with components)
- Next.js (framework for structuring and server-side rendering React apps)
- Docs: https://nextjs.org/docs
- Apollo Client (library for handling GraphQL requests in the frontend)
- Backend
- Python (programming language)
- Django (web framework)
- Graphene (library for building GraphQL APIs)
- Docs: https://docs.graphene-python.org/en/latest/
- Graphene-Django docs (the integration we use for Django): https://docs.graphene-python.org/projects/django/en/latest/
The project has error logging through Sentry, and can be accessed by logging in with GitHub.
The app is deployed through AWS ECS.
- E2E testing through Cypress, publicly accessible.
- Code coverage through Codecov, accessible with Github SSO.
- Domains managed through domene.shop.
- Postmark as e-mail service, contact an administrator for access.
- Vipps, contact an administrator for access.
- Feide, contact an administrator for access.
- AWS for various services, contact an administrator for access.
- Google Workspace for account management, contact an administrator for access.
- Slack for communication, available with a rubberdok.no domain.
This project is completely open source and is intended to serve as a platform for students who are interested in web development to have a project where they can find inspiration and contribute, and as such, we gladly welcome outside contributors to the project. If you're interested in how to get started, no matter what level of experience you have, please see CONTRIBUTING.
Found a bug, got a suggestion, or something we should know about? Take a look at the roadmap and file an issue if it's not on the roadmap!
Logo created by Skraagen