Skip to content

Tech

Jump to bottom
Guryash edited this page Jun 14, 2024 · 11 revisions

Technology

Tech used

  • Postgres
  • Docker
  • Clerk
  • React
  • Node JS
  • Stripe JS
  • Express
  • TailwindCSS

Installation and Set-up Guide

Installation

We need to install a few programs before we can get started. Here are the links to all the programs required:

  • Node JS - click yes if it asks you to install
  • Docker - To run the containerised database
  • Git
  • GitHub Desktop - recommended but not required
  • VS Code - recommended IDE
  • If you have PGAdmin installed, it can cause problems, troubleshooting information bellow
  1. Install all required programs
  2. Open a terminal and navigate to where you would like to save the files, using the command cd "{directory where you want to save the files}"
  3. Clone the repository using git clone https://github.com/UoaWDCC/auis-portal.git
  4. Navigate to correct directory by typing cd auis-portal (we will require four terminals open in this directory, for the rest of this guide I will label them Terminal 1-4)
  5. Create a file with the name exactly of ".env" within the API folder and copy the contents from the #resources channel on the discord server. DO NOT SHARE ANY OF THE INFORMATION ON THIS FILE PUBLICALLY
  6. Create a file with the name exactly of ".env" within the web folder and copy the contents from the #resources channel on the discord server. DO NOT SHARE ANY OF THE INFORMATION ON THIS FILE PUBLICALLY
  7. Create a file with the name exactly of ".env" within the strapi folder and copy the contents from the #resources channel on the discord server. DO NOT SHARE ANY OF THE INFORMATION ON THIS FILE PUBLICALLY
  8. Open Docker
  9. In Terminal 1 run the following commands cd database, docker compose up this will turn on the docker container. In Docker you should be able to see the container running.
  10. In Terminal 2 run the following commands cd strapi, yarn, yarn develop then click the link in terminal to go to the strapi page
  11. Create an account, this is local, so don't need to worry too much. Next time you run it, you can use it to login locally. You can now add data and remove data from the CMS, add types and make other modifications
  12. On Strapi, click "Settings" on the sidebar, click "Roles" under "User & Permission Plugin" under "Authenticated" click the edit button and enable the permission required. This allows the admin user that you are logged in as, to make modifications to those certain areas. This needs to be done everytime a new account is created or a new field is added - this is mostly relevant to the backend team
  13. In Terminal 3 run the following commands cd api, yarn, yarn db:generate, yarn db:migrate, yarn db, yarn db:seed. If you want to visualise the data run yarn db:visualise if not, you can just run yarn dev to start the backend server. If you have added new types to the backend and want them to be autogenerated in the frontend then run yarn watch-types. You don't need to run all commands when you are running the backend a second time, unless changes have been made, but there is no harm in running all again, if you are unsure what everything does. More detailed explanation in the README.md file within the API folder if you are curious.
  14. In Terminal 4 run cd web, yarn, yarn dev. If you want to run the tests then run yarn test

Troubleshooting

If you get an error along the lines of "Incorrect Password when connecting to the database". It is caused by the port 5432 being in use. Either uninstall PGAdmin, and restart to fix that. Or change the port mapping for your computer. Within the database folder, the docker-compose.yaml file, change line 12 to say - 5435:5432 and then go through all '.env' files and update anywhere that says 'PORT:5432' to 'PORT:5435'.

On VS Code install the extensions: TailwindCSS Intellisense, and Biome

Deployment

For our project, we have our deployment set up in three environments. The first one is developer, this is the main one you will be using, it is hosted locally. The second one is a production developer environment, this is hosted on a server and you can access it with a website link. This is able to be seen by everyone but it is not the production release, this gets updated every time main branch is updated. The third environment is production, this will be updated manually at every milestone and it is open to everyone. You don't need to worry about the details for this, if you need further clarification, please contact the tech lead. In summary, you just need to worry about your own local development environment.

Clone this wiki locally