The Sitzverteilung is a Vue-based Progressive Web App developed by it@M to calculate the seats for local elections, defined by law.
- Creation of reusable templates
- Forming of factions and committees
- Calculation of seat distribution and order for different formulas:
- Detection of stale situations
- Various validation checks to detect improper constellations
- Link-based sharing functionality for templates and individual calculations
- PDF export of calculation results
Instructions on how to use the app are directly integrated.
You can open the instructions on the different pages using the "Information" button at the top of each page.
Note
The app is currently only available in German.
Application-related:
- Programming Language: TypeScript
- Frontend Framework: Vue.js
- UI Component Library: Vuetify
- PDF Creation: jsPDF
- State Management: Pinia
- PWA support: PWA Vite Plugin
Development-related:
"Sitzverteilung" is a client-only progressive web app (PWA) designed to function entirely within the user's browser, leveraging the capabilities of modern web technologies without relying on external APIs for data retrieval or processing.
graph TD;
A[Application Shell] -->|loads| B[Service Worker]
B -->|caches| C[Client-side Data Storage]
B -->|intercepts network requests| A
C -->|stores| A
A -->|serve dynamic content| A
style A fill:#f9f,stroke:#333,stroke-width:2px;
style B fill:#0ff,stroke:#333,stroke-width:2px;
style C fill:#ff0,stroke:#333,stroke-width:2px;
Its architecture primarily consists of three key components:
- Application Shell: The application shell is the fundamental structure of the PWA, providing a seamless and responsive user interface as well as dynamic content. This approach ensures that the app remains fast and responsive without additional API calls.
- Service Worker: The service worker acts as a proxy between the web app and the network, enabling features such as offline functionality and caching. It intercepts network requests, allowing the app to serve cached resources when the user is offline or when the network is unavailable. By pre-caching essential assets and data during the installation phase, the service worker ensures that the app remains functional even without an internet connection.
- Client-side Data Storage: Since the app does not communicate with external APIs, it relies on client-side storage solutions to manage data. This can be achieved through Local Storage, which store data directly in the user's browser. This storage mechanism allows the app to read and write data locally, enabling functionalities such as user preferences, application state, and other relevant information without needing external servers.
If you want to help developing this application, the development setup is very straightforward.
The only prerequisite is to have Node.js in version 22.14 to 22.x (including npm) installed on your system.
The setup involves the following steps:
- Clone this repository (
git clone https://github.com/it-at-m/sitzverteilung.git) - Switch to the frontend directory (
cd sitzverteilung-frontend) - Install the NPM dependencies (
npm install) - Start the development server (
npm run dev) - Happy developing!
Additionally, provided are some useful npm scripts for development:
- Run tests:
npm run test - Run formatting and linting checks:
npm run lint - Autofix formatting and linting checks:
npm run fix
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
If you have a suggestion that would make this better, please open an issue with the tag "enhancement", fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!
- Open an issue with the tag "enhancement"
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
More about this in the CODE_OF_CONDUCT file.
Distributed under the MIT License. See LICENSE file for more information.