diff --git a/README.md b/README.md index c8605fa..aa2caa2 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,7 @@ -# Hypso Space Outreach +# Hypso Space Outreach Website +The Hypso Space Outreach Website is an interactive web page developed for the general public. It includes features such as a mission tracker, mission status, maps, and an easy to use blog. - - -## Project Objectives - -* Develop an interactive web page for the general public. -* Include features such as mission tracker, mission status, maps, and automatic posting. -* Prioritize operational cost-effectiveness and ease of maintenance in technology and framework choices. +![alt text](docs/images/image.png) ## General Information @@ -15,28 +10,21 @@ * Platform: Web * Framework: React * Period: Spring 2024 -* Status: In Progress +* Status: Done ## Project Structure -* `/docs/`: Contains technical documentation. -* `/backend/`: Backend code and local setup instructions. -* `/frontend/`: Frontend code and local setup instructions. -* `/.vscode/`: IDE settings (if applicable). -* `/.github/`: GitHub repository settings (e.g., issue templates, workflows). +* [`/docs/`](/docs/): Contains technical documentation. +* [`/backend/`](/backend/): Backend code and local setup instructions. +* [`/frontend/`](/frontend/): Frontend code and local setup instructions. +* [`/.vscode/`](/.vscode/): IDE settings (if applicable). +* [`/.github/`](/.github/): GitHub repository settings (e.g., issue templates, workflows). ## Getting Started -**Instructions:** +Goto [`/docs/README.md`](/docs/README.md) to read more about the project. -1. Clone this repository. -2. Navigate to the `backend/` directory and follow the instructions within. -3. Navigate to the `frontend/` directory and follow the instructions within ## Contributing -We welcome contributions! - -## More Info - -If looking for more information about the project please refer to the submitted report which Small Satellite Lab should have access to as well as the documentation in the `/docs/` folder. +Contributions are welcome, for more information, refer to the documentation in the `/docs/` folder. diff --git a/docs/README.md b/docs/README.md index f55c00e..45c22e8 100644 --- a/docs/README.md +++ b/docs/README.md @@ -1,21 +1,13 @@ # Documentation Folder -See `deployment.md` for info regarding deployment. - ## Overview -Welcome to the `docs/` directory! This folder is an essential part of the Hypso Outreach Portal project. It serves as a central repository for all our documentation-related materials. - -## Contents -In this folder, you will find a range of documents that support and explain the project. This includes but is not limited to: -- **User Guides:** Step-by-step guides and manuals for end-users, ensuring ease of use and accessibility of our platform. -- **Technical References:** References to technologies, frameworks, libraries, and tools used in the project. +Welcome to the `docs/` directory! It serves as a central repository for all our documentation-related materials. -Other information about the project is within the submitted report detailing architecture, reasoning and more. - -## Purpose -The primary purpose of this folder is to: +## Contents -1. **Organize Information:** Keep all documentation in one accessible location. -2. **Facilitate Collaboration:** Provide team members with easy access to essential project information. -3. **Support Maintenance:** Aid future developers in understanding and maintaining the system. \ No newline at end of file +- [`./deployment.md`](./deployment.md) lists everything that needs to be done to deploy the server on an NTNU semi-managed server. +- [`./tech-stack.md`](./tech-stack.md) Quickly shows our tech stack and networking setup. +- [`./developing.md`](./deployment.md) Explains how to get started adding new pages and features. +- [`./design/`](./design/) Contains screenshots of our previous design iterations. +- [`./images/`](./images/) Contains images used in the docs. diff --git a/docs/deployment.md b/docs/deployment.md index 9173e5c..22e0eb5 100644 --- a/docs/deployment.md +++ b/docs/deployment.md @@ -1,81 +1,86 @@ -See the following docs for more info about strapi deployment: -[https://docs.strapi.io/dev-docs/deployment](https://docs.strapi.io/dev-docs/deployment) +# Deployment -### Setting up ntnu halfadministrated server +See the Strapi [docs](https://docs.strapi.io/dev-docs/deployment) for more info about deployment -#### Firewall +See [here](https://nextjs.org/docs/app/building-your-application/deploying) for information regarding Next.js deployment with app router. -We have created firewall rules to access website and api. +## Setting up ntnu semi-managed server -`/etc/local/firewall.d $ touch ipv4-magnastr-docker-website-git-autodeply.conf` +Look [here](https://www.ntnu.no/wiki/display/ntnuitubuntu/Semi-managed+Linux+servers) for more info about semi-managed servers -do `sudo nano ipv4-magnastr-docker-website-git-autodeply.conf` to enter the file and edit the content +### Firewall -paste the lines +We have created firewall rules to make the website accesible. -``` --I INPUT -p tcp -m tcp --dport 3000 -j ACCEPT +1. Goto + `cd /etc/local/firewall.d` -# Frontend (next.js node) Open TCP port 3000 for the world: --I DOCKER-USER -p tcp -m conntrack --ctorigdstport 3000 -j ACCEPT +2. If they don't exist yet, do `touch ipv4-outreach.conf` -# Open port 80 for HTTP --I INPUT -p tcp -m tcp --dport 80 -j ACCEPT +3. do `sudo nano ipv4-outreach.conf` to enter the file and edit the content to the following: -# Open port 443 for HTTPS --I INPUT -p tcp -m tcp --dport 443 -j ACCEPT + ``` + # Open port 80 for HTTP + -I INPUT -p tcp -m tcp --dport 80 -j ACCEPT -# Backend (strapi) Open TCP port 1337 for world: --I DOCKER-USER -p tcp -m conntrack --ctorigdstport 1337 -j ACCEPT + # Open port 443 for HTTPS + -I INPUT -p tcp -m tcp --dport 443 -j ACCEPT + ``` -``` +4. then run `sudo /local/admin/bin/install-firewall.sh` -#### PKGSYNC +5. and `sudo iptables-save` + +### PKGSYNC Make sure docker compose is installed on the server. Can be checked by running `docker compose version` -#### Github Runner +### Github Runner Setup a self hosted GitHub runner for the repository. +We first need to create a user that our action runner will run as. + > Ansible (our current configuration system) will manage users and groups with UID/GID above 300. If you need to create local system users or groups, use free UID/GID between 100 and 299. -Create a user with UID 200: -`sudo useradd -u 200 outreach-github-runner` -Add it to the docker group so it can run docker commands without sudo: -`sudo usermod -a -G docker outreach-github-runner` +1. Create a user with UID 200: + `sudo useradd -u 200 outreach-github-runner` +2. Add it to the docker group so it can run docker commands without sudo: + `sudo usermod -a -G docker outreach-github-runner` -Now follow the official guide on github to add the runner to a repository, but only do theese steps +You might also have to give it permission to access the runner folder and home dircetory. -- Create the folder -- Download latest runner package -- Validate the hash -- Extract the installer -- Create the runner and start config experience. Just press enter for all options. +1. `sudo chown outreach-github-runner /actions-runner/ -R` +2. `sudo chown outreach-github-runner /home/outreach-github-runner/ -R` -No need to run it manually. We will install it as a service running as the user we created previously. +To add an action runner to the repo, goto the github repository then `Settings > Actions > Runners > New self-hosted runner`. -`./svc.sh install outreach-github-runner` +Now follow the official guide on github to add the runner to a repository, **but don't run it manually** -`sudo ./svc.sh start` +1. Create the folder +2. Download latest runner package +3. Validate the hash +4. Extract the installer +5. Create the runner and start config experience. Just press enter for all options. -`sudo chown outreach-github-runner /actions-runner/ -R` +**There is no need to run it manually.** We will install it as a service running as the user we created previously. -`sudo chown outreach-github-runner /home/outreach-github-runner/ -R` +1. `./svc.sh install outreach-github-runner` install it as a service +2. `sudo ./svc.sh start` start the service -#### Secrets and variables +### Secrets and variables The secrets should all be filled in and generated using `openssl rand -base64 32` The GitHub repo should define the following secrets: -- ADMIN_JWT_SECRET -- API_TOKEN_SALT -- APP_KEYS -- JWT_SECRET -- TRANSFER_TOKEN_SALT +- APP_KEYS="toBeModified1,toBeModified2" +- API_TOKEN_SALT=tobemodified +- ADMIN_JWT_SECRET=tobemodified +- TRANSFER_TOKEN_SALT=tobemodified +- JWT_SECRET=tobemodified And the following variables: @@ -85,22 +90,32 @@ And the following variables: - STRAPI_URL=http://backend-app:1337 - PORT=1337 -#### Logs and errors +### Apache + +TODO @madshermansen -##### Action runner +## Troubleshooting + +### Action runner If the action runner is having issues, try running this command to check out its logs. -`sudo journalctl -u actions.runner.ITP2-SmallSatLab-Hypso-IT2901-SmallSatLab-Hypso.smallsat01.service -f` +`sudo journalctl -u actions.runner.NTNU-SmallSat-Lab-outreach-website.smallsat01.service -f` + +If the command does not work, try reading this [Monitoring and troubleshooting self-hosted runners](https://docs.github.com/en/actions/hosting-your-own-runners/managing-self-hosted-runners/monitoring-and-troubleshooting-self-hosted-runners). +Keep in mind, the name might be something else than what is shown in the command. You can run `cat /actions-runner/.service` to check the name + +### Logs and errors -If the command does not work, try reading this [Monitoring and troubleshooting self-hosted runners](https://docs.github.com/en/actions/hosting-your-own-runners/managing-self-hosted-runners/monitoring-and-troubleshooting-self-hosted-runners). -Keep in mind, the name might be something else than what is shown in the command. +1. Run `cd /actions-runner/_work/outreach-website/outreach-website` +2. Then `sudo docker compose logs` to see the logs from each container. -##### Docker +If the above doesn't work, you can run the following commands to see logs: -If there are any issues with docker. You can run the following commands to see logs: +1. `sudo docker ps -a` to see all running conatiners. +2. `sudo docker logs `, with the hash of the container (you usually only need to type in the first few letters), to see the logs printed to console. + - Log `outreach:backend` for strapi, and `outreach:frontend` for next.js. -- `sudo docker ps -a` to see all running conatiners. -- `sudo docker logs `, with the hash of the container (you usually only need to type in the first few letters), to see the logs printed to console. +## SSL Certification -Log `outreach:backend` for strapi, and `outreach:frontend` for next.js. +TODO @madshermansen diff --git a/docs/developing.md b/docs/developing.md new file mode 100644 index 0000000..39e031a --- /dev/null +++ b/docs/developing.md @@ -0,0 +1,55 @@ +# Developing + +## Requirements + +This project requires you have installed [Node.js 20 LTS](https://nodejs.org/en/download). We recommend using [nvm](https://github.com/nvm-sh/nvm) to install multiple versions of node if necessary. + +## Running the project + +To install all requirements simply do the following from the project root: + +`npm i && cd ./frontend && npm i && cd ../backend && npm i && cd ..` This will run npm install in all the folders necessary. + +Then do `npm run dev` from the root dir to run both the client and the server at the same time. + +If this doesn't work you might have to enter and build the backend (strapi) first. +`cd backend` then `npm run build` + +- The frontend should be accessible at http://localhost:3000 + +- The backend should be accesible at http://localhost:1337/admin + - Here, you can create an admin user. + +## Strapi First time boot + +Goto Settings > Users & Permissions plugin > Roles > Public > Article, and enable `find` and `findOne`. You need to do this for every publically available content type. Theese include but are not limited to: + +- Article +- Author +- Hero +- Most-recent-image +- Project +- Satellite + +The following should **NOT** be made publicly available: + +- Email +- i18n +- Upload +- User-permissions + +## GraphQL Type generation + +If you're using GraphQL, then you need to run `npm run compile` from `/frontend` whenever you update a schema or define a new graphQL request in the code. Make sure to import the correct `gql` as + +``` +import { gql } from"@/generated/gql"; +``` + +> Any errors in your code other than the GraphQL types, can result in the codegen not working, so make sure to fix all other errors before running the codegen. + +> [https://www.apollographql.com/docs/react/development-testing/static-typing/](https://www.apollographql.com/docs/react/development-testing/static-typing/) + +## Strapi invite others + +You can invite new admin users in `Settings > Administration panel > Users > Invite new user` diff --git a/docs/general-usage.md b/docs/general-usage.md deleted file mode 100644 index a9106eb..0000000 --- a/docs/general-usage.md +++ /dev/null @@ -1,35 +0,0 @@ -### GraphQL Type generation - -If you're using GraphQL, then you need to run `npm run compile` from `/frontend` whenever you update a schema or define a new graphQL request in the code. Make sure to import the correct `gql` as - -``` -import { gql } from"@/generated/gql"; -``` - -> Any errors in your code other than the GraphQL types, can result in the codegen not working, so make sure to fix all other errors before running the codegen. - -> [https://www.apollographql.com/docs/react/development-testing/static-typing/](https://www.apollographql.com/docs/react/development-testing/static-typing/) - -### Strapi First time boot - -Goto Settings > Users & Permissions plugin > Roles > Public > Article, and enable `find` and `findOne`. You need to do this for every publically available content type. Theese include but are not limited to: -- Article -- Author -- Hero -- Most-recent-image -- Project -- Satellite - -The following should **NOT** be made publicly available: -- Email -- i18n -- Upload -- User-permissions - -### Heroku - -Heroku is currently configured to run on [https://small-sat-lab-6ad3da13947b.herokuapp.com/](https://small-sat-lab-6ad3da13947b.herokuapp.com/) - -with the admin panel at [https://small-sat-lab-6ad3da13947b.herokuapp.com/admin](https://small-sat-lab-6ad3da13947b.herokuapp.com/admin) - -You can invite new admin users in `Settings > Administration panel > Users > Invite new user` diff --git a/docs/images/excalidraw/networkView.excalidraw b/docs/images/excalidraw/networkView.excalidraw new file mode 100644 index 0000000..807547e --- /dev/null +++ b/docs/images/excalidraw/networkView.excalidraw @@ -0,0 +1,1165 @@ +{ + "type": "excalidraw", + "version": 2, + "source": "https://excalidraw.com", + "elements": [ + { + "id": "bEsUPnKTXQnGg1EvAgUK4", + "type": "rectangle", + "x": 134.1087567317577, + "y": 197.83269840940483, + "width": 1198.7295788454949, + "height": 396.0000000000001, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "b8e", + "roundness": { + "type": 3 + }, + "seed": 30732855, + "version": 451, + "versionNonce": 726087159, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "qeC4FI8FmpMZcpEAXDpGC" + } + ], + "updated": 1713886632180, + "link": null, + "locked": false + }, + { + "id": "qeC4FI8FmpMZcpEAXDpGC", + "type": "text", + "x": 600.5235492062629, + "y": 202.83269840940483, + "width": 265.8999938964844, + "height": 25, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "b8eV", + "roundness": null, + "seed": 1569976313, + "version": 332, + "versionNonce": 117137175, + "isDeleted": false, + "boundElements": null, + "updated": 1713886632180, + "link": null, + "locked": false, + "text": "NTNU Semi-managed server", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "top", + "containerId": "bEsUPnKTXQnGg1EvAgUK4", + "originalText": "NTNU Semi-managed server", + "lineHeight": 1.25 + }, + { + "id": "8nELgKHDvyu45AhaHGYxm", + "type": "rectangle", + "x": 558.5625, + "y": 247.1640625, + "width": 754.0000000000001, + "height": 327, + "angle": 0, + "strokeColor": "#1971c2", + "backgroundColor": "#a5d8ff", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "b8f", + "roundness": { + "type": 3 + }, + "seed": 153351353, + "version": 201, + "versionNonce": 1017250521, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "grnF-Y3-UzkAEbDPVxhDK" + } + ], + "updated": 1713886619009, + "link": null, + "locked": false + }, + { + "id": "grnF-Y3-UzkAEbDPVxhDK", + "type": "text", + "x": 857.8791656494141, + "y": 252.1640625, + "width": 155.36666870117188, + "height": 50, + "angle": 0, + "strokeColor": "#1971c2", + "backgroundColor": "#a5d8ff", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "b8fV", + "roundness": null, + "seed": 78715927, + "version": 172, + "versionNonce": 1458454457, + "isDeleted": false, + "boundElements": null, + "updated": 1713886619009, + "link": null, + "locked": false, + "text": "Docker Compose\nOutreach", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "top", + "containerId": "8nELgKHDvyu45AhaHGYxm", + "originalText": "Docker Compose\nOutreach", + "lineHeight": 1.25 + }, + { + "id": "69eCpky4l2kWlvl1L5K8k", + "type": "rectangle", + "x": 580.5625, + "y": 321.1640625, + "width": 246, + "height": 235, + "angle": 0, + "strokeColor": "#1971c2", + "backgroundColor": "#a5d8ff", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "b8g", + "roundness": { + "type": 3 + }, + "seed": 935953625, + "version": 77, + "versionNonce": 1314569111, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "-ns1r1hLYiDr_RSne7aG9" + }, + { + "id": "pHM_VgIknMVg2gQvDsKhq", + "type": "arrow" + }, + { + "id": "yVt5quJPcKzmJ5aniHl8v", + "type": "arrow" + } + ], + "updated": 1713886651712, + "link": null, + "locked": false + }, + { + "id": "-ns1r1hLYiDr_RSne7aG9", + "type": "text", + "x": 621.404167175293, + "y": 326.1640625, + "width": 164.31666564941406, + "height": 50, + "angle": 0, + "strokeColor": "#1971c2", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "b8h", + "roundness": null, + "seed": 2019799191, + "version": 72, + "versionNonce": 1218937369, + "isDeleted": false, + "boundElements": null, + "updated": 1713886656877, + "link": null, + "locked": false, + "text": "frontend:3000\nDocker container", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "top", + "containerId": "69eCpky4l2kWlvl1L5K8k", + "originalText": "frontend:3000\nDocker container", + "lineHeight": 1.25 + }, + { + "id": "Cg79yd1LYF_UxpHB2iQGx", + "type": "rectangle", + "x": 1046.5625, + "y": 312.1640625, + "width": 246, + "height": 235, + "angle": 0, + "strokeColor": "#1971c2", + "backgroundColor": "#a5d8ff", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "b8hG", + "roundness": { + "type": 3 + }, + "seed": 1394981465, + "version": 166, + "versionNonce": 1818807545, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "CAXlxJ2a0RKp30Wge82QN" + }, + { + "id": "pHM_VgIknMVg2gQvDsKhq", + "type": "arrow" + } + ], + "updated": 1713886613861, + "link": null, + "locked": false + }, + { + "id": "CAXlxJ2a0RKp30Wge82QN", + "type": "text", + "x": 1087.404167175293, + "y": 317.1640625, + "width": 164.31666564941406, + "height": 50, + "angle": 0, + "strokeColor": "#1971c2", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "b8hV", + "roundness": null, + "seed": 653030327, + "version": 163, + "versionNonce": 1803117239, + "isDeleted": false, + "boundElements": null, + "updated": 1713886665453, + "link": null, + "locked": false, + "text": "backend:1337\nDocker container", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "top", + "containerId": "Cg79yd1LYF_UxpHB2iQGx", + "originalText": "backend:1337\nDocker container", + "lineHeight": 1.25 + }, + { + "id": "hNX2A9_O3vQP3sKDhXaOs", + "type": "rectangle", + "x": 1091, + "y": 379.0078125, + "width": 161, + "height": 136, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "#9775fa", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bA6", + "roundness": { + "type": 3 + }, + "seed": 689349943, + "version": 359, + "versionNonce": 409957943, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "RHCL6cz_yAGVryrDkCMv-" + } + ], + "updated": 1713886616232, + "link": null, + "locked": false + }, + { + "id": "RHCL6cz_yAGVryrDkCMv-", + "type": "text", + "x": 1141.6749992370605, + "y": 434.5078125, + "width": 59.650001525878906, + "height": 25, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bA7", + "roundness": null, + "seed": 920351129, + "version": 261, + "versionNonce": 1571919703, + "isDeleted": false, + "boundElements": null, + "updated": 1713886616232, + "link": null, + "locked": false, + "text": "Strapi", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "hNX2A9_O3vQP3sKDhXaOs", + "originalText": "Strapi", + "lineHeight": 1.25 + }, + { + "id": "D_vhUTuTAPX731knhnFR2", + "type": "rectangle", + "x": 619, + "y": 376.0078125, + "width": 161, + "height": 136, + "angle": 0, + "strokeColor": "#ffffff", + "backgroundColor": "#1e1e1e", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bA8", + "roundness": { + "type": 3 + }, + "seed": 750290647, + "version": 475, + "versionNonce": 1050275575, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "BWNGC2tt1NzkN9DQ3k68a" + }, + { + "id": "Ew6I5kDaXOjyzmnxbIDwl", + "type": "arrow" + } + ], + "updated": 1713892286164, + "link": null, + "locked": false + }, + { + "id": "BWNGC2tt1NzkN9DQ3k68a", + "type": "text", + "x": 664.8666648864746, + "y": 431.5078125, + "width": 69.26667022705078, + "height": 25, + "angle": 0, + "strokeColor": "#ffffff", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bA9", + "roundness": null, + "seed": 2115581465, + "version": 386, + "versionNonce": 1659139575, + "isDeleted": false, + "boundElements": null, + "updated": 1713886572982, + "link": null, + "locked": false, + "text": "Next.js", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "D_vhUTuTAPX731knhnFR2", + "originalText": "Next.js", + "lineHeight": 1.25 + }, + { + "id": "YHJ-m3jbZKkOPwg-cOdAY", + "type": "rectangle", + "x": 169, + "y": 349.0078125, + "width": 161, + "height": 136, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "#ffd8a8", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAA", + "roundness": { + "type": 3 + }, + "seed": 657611001, + "version": 1163, + "versionNonce": 810441657, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "52EDdA42DfZ2DNh4nOI0v" + }, + { + "id": "eNTjchcwfzcKTWjzBz4p4", + "type": "arrow" + }, + { + "id": "yVt5quJPcKzmJ5aniHl8v", + "type": "arrow" + } + ], + "updated": 1713886590795, + "link": null, + "locked": false + }, + { + "id": "52EDdA42DfZ2DNh4nOI0v", + "type": "text", + "x": 179.59166717529297, + "y": 392.0078125, + "width": 139.81666564941406, + "height": 50, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAB", + "roundness": null, + "seed": 1584828183, + "version": 1096, + "versionNonce": 1230797977, + "isDeleted": false, + "boundElements": null, + "updated": 1713886590795, + "link": null, + "locked": false, + "text": "Apache\nReverse Proxy", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "YHJ-m3jbZKkOPwg-cOdAY", + "originalText": "Apache\nReverse Proxy", + "lineHeight": 1.25 + }, + { + "id": "jocWfUDKnEbykZZfTdmIz", + "type": "rectangle", + "x": -207.9684426961296, + "y": 349.18077038454953, + "width": 161, + "height": 136, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bABG", + "roundness": { + "type": 3 + }, + "seed": 745931415, + "version": 1192, + "versionNonce": 867314871, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "_5_NspYPSGoLmPicq2Vsk" + }, + { + "id": "eNTjchcwfzcKTWjzBz4p4", + "type": "arrow" + }, + { + "id": "KHQyk6XBcZ_GGIXzUayxo", + "type": "arrow" + } + ], + "updated": 1713892318118, + "link": null, + "locked": false + }, + { + "id": "_5_NspYPSGoLmPicq2Vsk", + "type": "text", + "x": -197.9184396443718, + "y": 404.68077038454953, + "width": 140.89999389648438, + "height": 25, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bABV", + "roundness": null, + "seed": 2144491097, + "version": 1135, + "versionNonce": 342845689, + "isDeleted": false, + "boundElements": null, + "updated": 1713886636747, + "link": null, + "locked": false, + "text": "Client Browser", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "jocWfUDKnEbykZZfTdmIz", + "originalText": "Client Browser", + "lineHeight": 1.25 + }, + { + "id": "31TmRXc0gHaQiQudjLs_U", + "type": "rectangle", + "x": 614.558197419824, + "y": 799.4342486943891, + "width": 161, + "height": 136, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bABd", + "roundness": { + "type": 3 + }, + "seed": 1660918807, + "version": 1424, + "versionNonce": 628577591, + "isDeleted": false, + "boundElements": [ + { + "id": "eNTjchcwfzcKTWjzBz4p4", + "type": "arrow" + }, + { + "type": "text", + "id": "Uu9mfG5vrLe5bj1wZWRKY" + }, + { + "id": "Ew6I5kDaXOjyzmnxbIDwl", + "type": "arrow" + }, + { + "id": "KHQyk6XBcZ_GGIXzUayxo", + "type": "arrow" + } + ], + "updated": 1713892340440, + "link": null, + "locked": false + }, + { + "id": "Uu9mfG5vrLe5bj1wZWRKY", + "type": "text", + "x": 645.7415317704099, + "y": 854.9342486943891, + "width": 98.63333129882812, + "height": 25, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bABl", + "roundness": null, + "seed": 57218265, + "version": 1371, + "versionNonce": 1550161495, + "isDeleted": false, + "boundElements": null, + "updated": 1713892340440, + "link": null, + "locked": false, + "text": "CelesTrak", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "31TmRXc0gHaQiQudjLs_U", + "originalText": "CelesTrak", + "lineHeight": 1.25 + }, + { + "id": "pHM_VgIknMVg2gQvDsKhq", + "type": "arrow", + "x": 827.5625, + "y": 433.7143329406433, + "width": 218, + "height": 1.852234879089167, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "#9775fa", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAG", + "roundness": { + "type": 2 + }, + "seed": 790353049, + "version": 144, + "versionNonce": 1130606327, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "70RTE_1g0xKE8hJmfMPjZ" + } + ], + "updated": 1713886651712, + "link": null, + "locked": false, + "points": [ + [ + 0, + 0 + ], + [ + 218, + -1.852234879089167 + ] + ], + "lastCommittedPoint": null, + "startBinding": { + "elementId": "69eCpky4l2kWlvl1L5K8k", + "focus": -0.0328568799884277, + "gap": 1 + }, + "endBinding": { + "elementId": "Cg79yd1LYF_UxpHB2iQGx", + "focus": -0.009654309405898471, + "gap": 1 + }, + "startArrowhead": "arrow", + "endArrowhead": "arrow" + }, + { + "id": "70RTE_1g0xKE8hJmfMPjZ", + "type": "text", + "x": 894.2489585876465, + "y": 408.796875, + "width": 109.78333282470703, + "height": 50, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "#9775fa", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAH", + "roundness": null, + "seed": 370301561, + "version": 61, + "versionNonce": 1434912087, + "isDeleted": false, + "boundElements": null, + "updated": 1713886572982, + "link": null, + "locked": false, + "text": "ApolloClient\nGraphQL", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "pHM_VgIknMVg2gQvDsKhq", + "originalText": "ApolloClient\nGraphQL", + "lineHeight": 1.25 + }, + { + "id": "eNTjchcwfzcKTWjzBz4p4", + "type": "arrow", + "x": -45.96844269612961, + "y": 418.45077485815716, + "width": 212.68719269612964, + "height": 2.8285567428164313, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "#9775fa", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAI", + "roundness": { + "type": 2 + }, + "seed": 201411449, + "version": 1094, + "versionNonce": 1818377913, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "UijZ11AJvgoWCIbp8zPnD" + } + ], + "updated": 1713886636747, + "link": null, + "locked": false, + "points": [ + [ + 0, + 0 + ], + [ + 212.68719269612964, + 2.8285567428164313 + ] + ], + "lastCommittedPoint": null, + "startBinding": { + "elementId": "jocWfUDKnEbykZZfTdmIz", + "focus": 0.0027078285450559594, + "gap": 1 + }, + "endBinding": { + "elementId": "YHJ-m3jbZKkOPwg-cOdAY", + "focus": -0.0777818641590708, + "gap": 2.28125 + }, + "startArrowhead": "arrow", + "endArrowhead": "arrow" + }, + { + "id": "UijZ11AJvgoWCIbp8zPnD", + "type": "text", + "x": 13.066819301349256, + "y": 402.3436346701935, + "width": 112.61666870117188, + "height": 50, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "#9775fa", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAIV", + "roundness": null, + "seed": 533402455, + "version": 49, + "versionNonce": 726286967, + "isDeleted": false, + "boundElements": null, + "updated": 1713886572982, + "link": null, + "locked": false, + "text": "hypso.space\nHTTPS:443", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "eNTjchcwfzcKTWjzBz4p4", + "originalText": "hypso.space\nHTTPS:443", + "lineHeight": 1.25 + }, + { + "id": "yVt5quJPcKzmJ5aniHl8v", + "type": "arrow", + "x": 331.00000000000006, + "y": 413.16063313718496, + "width": 248.56249999999994, + "height": 4.1844575781042295, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "#9775fa", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAJ", + "roundness": { + "type": 2 + }, + "seed": 1664023543, + "version": 599, + "versionNonce": 2090835255, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "G0Zxf2Khti-bQrrihgG1d" + } + ], + "updated": 1713886651712, + "link": null, + "locked": false, + "points": [ + [ + 0, + 0 + ], + [ + 248.56249999999994, + 4.1844575781042295 + ] + ], + "lastCommittedPoint": null, + "startBinding": { + "elementId": "YHJ-m3jbZKkOPwg-cOdAY", + "focus": -0.0753015710431962, + "gap": 1 + }, + "endBinding": { + "elementId": "69eCpky4l2kWlvl1L5K8k", + "focus": 0.16083776595744617, + "gap": 1 + }, + "startArrowhead": "arrow", + "endArrowhead": "arrow" + }, + { + "id": "G0Zxf2Khti-bQrrihgG1d", + "type": "text", + "x": 392.84791564941406, + "y": 393.68142338028065, + "width": 147.86666870117188, + "height": 50, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAJV", + "roundness": null, + "seed": 240671511, + "version": 55, + "versionNonce": 468245399, + "isDeleted": false, + "boundElements": null, + "updated": 1713886572982, + "link": null, + "locked": false, + "text": "localhost:3000\nHTTP", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "yVt5quJPcKzmJ5aniHl8v", + "originalText": "localhost:3000\nHTTP", + "lineHeight": 1.25 + }, + { + "id": "Ew6I5kDaXOjyzmnxbIDwl", + "type": "arrow", + "x": 698.9426459697268, + "y": 513.0078125, + "width": 1.9554918966512105, + "height": 284.6896196196758, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAM", + "roundness": { + "type": 2 + }, + "seed": 642801719, + "version": 189, + "versionNonce": 2040310039, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "ZVTaansGeNWofW2GmWk4y" + } + ], + "updated": 1713892340476, + "link": null, + "locked": false, + "points": [ + [ + 0, + 0 + ], + [ + 1.9554918966512105, + 284.6896196196758 + ] + ], + "lastCommittedPoint": null, + "startBinding": { + "elementId": "D_vhUTuTAPX731knhnFR2", + "focus": 0.012644508180025153, + "gap": 1 + }, + "endBinding": { + "elementId": "31TmRXc0gHaQiQudjLs_U", + "focus": 0.07804347645207457, + "gap": 1.7368165747133162 + }, + "startArrowhead": "arrow", + "endArrowhead": "arrow" + }, + { + "id": "ZVTaansGeNWofW2GmWk4y", + "type": "text", + "x": 592.3726547436588, + "y": 585.4810430223497, + "width": 213.18333435058594, + "height": 75, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAN", + "roundness": null, + "seed": 983723481, + "version": 64, + "versionNonce": 310818967, + "isDeleted": false, + "boundElements": null, + "updated": 1713892336404, + "link": null, + "locked": false, + "text": "fetch satellite TLE's\nof satellites \nregistered in Strapi", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "Ew6I5kDaXOjyzmnxbIDwl", + "originalText": "fetch satellite TLE's of satellites registered in Strapi", + "lineHeight": 1.25 + }, + { + "id": "KHQyk6XBcZ_GGIXzUayxo", + "type": "arrow", + "x": -80.71796483132891, + "y": 486.18077038454953, + "width": 694.2761622511529, + "height": 359.95312466131963, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAO", + "roundness": { + "type": 2 + }, + "seed": 1505068119, + "version": 108, + "versionNonce": 209161495, + "isDeleted": false, + "boundElements": [ + { + "type": "text", + "id": "R_ftnZzpI4vEFLGII9Tar" + } + ], + "updated": 1713892356028, + "link": null, + "locked": false, + "points": [ + [ + 0, + 0 + ], + [ + 694.2761622511529, + 359.95312466131963 + ] + ], + "lastCommittedPoint": null, + "startBinding": { + "elementId": "jocWfUDKnEbykZZfTdmIz", + "focus": 0.4079004130535899, + "gap": 1 + }, + "endBinding": { + "elementId": "31TmRXc0gHaQiQudjLs_U", + "focus": -0.19094925395336734, + "gap": 1 + }, + "startArrowhead": "arrow", + "endArrowhead": "arrow" + }, + { + "id": "R_ftnZzpI4vEFLGII9Tar", + "type": "text", + "x": 86.96178804717721, + "y": 653.6573327152093, + "width": 358.9166564941406, + "height": 25, + "angle": 0, + "strokeColor": "#1e1e1e", + "backgroundColor": "transparent", + "fillStyle": "solid", + "strokeWidth": 2, + "strokeStyle": "solid", + "roughness": 1, + "opacity": 100, + "groupIds": [], + "frameId": null, + "index": "bAP", + "roundness": null, + "seed": 321296695, + "version": 39, + "versionNonce": 898016793, + "isDeleted": false, + "boundElements": null, + "updated": 1713892355185, + "link": null, + "locked": false, + "text": "fetch custom added satellite's TLE", + "fontSize": 20, + "fontFamily": 1, + "textAlign": "center", + "verticalAlign": "middle", + "containerId": "KHQyk6XBcZ_GGIXzUayxo", + "originalText": "fetch custom added satellite's TLE", + "lineHeight": 1.25 + } + ], + "appState": { + "gridSize": null, + "viewBackgroundColor": "#ffffff" + }, + "files": {} +} \ No newline at end of file diff --git a/docs/images/image.png b/docs/images/image.png new file mode 100644 index 0000000..5ee1565 Binary files /dev/null and b/docs/images/image.png differ diff --git a/docs/images/networkView.svg b/docs/images/networkView.svg new file mode 100644 index 0000000..d66120a --- /dev/null +++ b/docs/images/networkView.svg @@ -0,0 +1,21 @@ + + + + + + + + NTNU Semi-managed serverDocker ComposeOutreachfrontend:3000Docker containerbackend:1337Docker containerStrapiNext.jsApacheReverse ProxyClient BrowserCelesTrakApolloClientGraphQLhypso.spaceHTTPS:443localhost:3000HTTPfetch satellite TLE'sof satellites registered in Strapifetch custom added satellite's TLE \ No newline at end of file diff --git a/docs/tech-stack.md b/docs/tech-stack.md new file mode 100644 index 0000000..a0a8a95 --- /dev/null +++ b/docs/tech-stack.md @@ -0,0 +1,32 @@ +# Tech stack + +Our tech stack is a combination of modern and powerful tools and frameworks that help us build robust, scalable, and efficient applications. + +## Quick overview + +--- + +| **Tool/Framework** | **Category** | **Purpose** | **License** | +| ----------------------------------------------- | ----------------------- | ------------------------------------------------------------------------------------- | ----------- | +| [React](https://react.dev/) | Frontend Development | A JavaScript library for building user interfaces | MIT | +| [Next.js](https://nextjs.org/) | Frontend Development | Server-side rendering and routing for React applications | MIT | +| [Tailwind CSS](https://tailwindcss.com/) | Frontend Development | Utility-first CSS framework for rapid styling and customization | MIT | +| [shadcn/ui](https://ui.shadcn.com/) | Frontend Development | Reusable UI components | MIT | +| [Framer Motion](https://www.framer.com/motion/) | Frontend Development | Animation library for React | MIT | +| [Node.js](https://nodejs.org/en) | Server-Side Development | JavaScript runtime environment for building server-side applications | MIT | +| [npm](https://www.npmjs.com/) | Package Management | Managing project dependencies and development tools for Node.js | Apache-2.0 | +| [Strapi](https://strapi.io/) | Backend Development | Headless CMS (Content Management System) for building and managing APIs | MIT | +| [Docker](https://www.docker.com/) | Containerization | Packaging applications and dependencies for consistent deployment across environments | Apache 2.0 | +| [Playwright](https://playwright.dev/) | Testing | End-to-end testing framework for web applications | Apache 2.0 | + +--- + +## Networking + +The whole site is reverse proxied behind Apache, running as a service on the server. + +Our networking stack uses [Docker Compose](https://docs.docker.com/compose/) to containerize our applications such that they can easily talk to each other. + +The containers communiate using [GraphQL](https://graphql.org/) and [Apollo Client](https://www.apollographql.com/docs/react/) + +![network view](./images/networkView.svg) diff --git a/package.json b/package.json index 5fa1dfa..d65ffd2 100644 --- a/package.json +++ b/package.json @@ -4,8 +4,8 @@ "description": "## General Information Project Code: P.01 Country: 🇳🇴 Norway Customer: NTNU SmallSat Lab Platform: Web Framework: React Period: Spring 2024 Status: In Progress", "main": "index.js", "scripts": { - "client": "cd frontend && npm run dev", - "server": "cd backend && npm run develop", + "frontend": "cd frontend && npm run dev", + "backend": "cd backend && npm run develop", "dev": "concurrently \"npm run server\" \"npm run client\"" }, "author": "",