SudoSOS Frontend Monorepo

[](https://github.com/GEWIS/sudosos-frontend/actions/workflows/semver.yml) [](https://github.com/GEWIS/sudosos-frontend/releases) [](https://github.com/GEWIS/sudosos-frontend/issues) [](https://github.com/GEWIS/sudosos-frontend/commits/main) [](https://github.com/GEWIS/sudosos-frontend)

This monorepo contains all the frontend projects and common code for the SudoSOS.

Projects

1. sudosos-nginx-proxy: Nginx proxy configuration for the SudoSOS stack.
2. sudosos-frontend-common: Common code components, helper functions, services, and Pinia stores for frontend applications.
3. sudosos-point-of-sale: Frontend application for the SudoSOS POS system built with Vue 3 and TypeScript.
4. sudosos-dashboard: Dashboard frontend application for SudoSOS, rewritten in Vue 3.

Contributing

Contributions are welcome! If you encounter any issues or have suggestions for improvements, please open an issue on the issue tracker.

Development quick start

You can quickly start development directly in your browser by using Codespaces. Otherwise you can use a local code editor such Jetbrains Webstorm (free via the university) or VSCode.

GitHub Codespaces

Step 1: Setting up the environment

• Click here to create a codespace for this repository
• After this, all of the dependencies, development environment and set up command should be run and ready.

Step 2: Launching dashboard/point-of-sale

• Run yarn dev-dashboard or yarn dev-pos to start the development environment.
• There should be a pop up to open the website in the bottom right corner, changes to the code are directly reflected on this site.
• You can also open this site using the ports tab in the same window as the terminal.

[!WARNING] Login via GEWIS does not work on Codespaces, you will need to sign in using your m-account in the local login.

[!TIP] You can also use the Jetbrains IDE if you prefer that over the default Codespaces IDE. More information can be found here.

Local set up

Step 0: Prerequisites

• Node.js Version 18+
• Git and possibly a Git manager
• (VSCode: Vue extension)

Step 1: Installing

• Use git to clone the repository.
• Run yarn install
• Copy the .env.example file to .env in the apps/dashboard and apps/point-of-sale directories

Step 2: Running the dashboard/point-of-sale

• Run yarn dev-dashboard or yarn dev-pos to start the development environment.
• You can access the dashboard and point of sale at localhost:5173 and localhost:5174 respectively.

Proxying requests to different backends

In the respective .env files, you can change which backend the frontend uses in development by changing the VITE_DEV_API_BASE. By default, this is set to the test backend (https://sudosos.test.gewis.nl/api/v1), but you can also change it to https://sudosos.gewis.nl/api/v1 for the production backend. Or you can change it to http://localhost:3000 if you are running the backend locally.