Skip to content

Latest commit

 

History

History
126 lines (81 loc) · 4.8 KB

README.md

File metadata and controls

126 lines (81 loc) · 4.8 KB
Raw

Mülli-App

vue 3 License: MIT

The webbased application supports the citizens of "Landkreis Konstanz" in Germany to dispose the waste properly and to find the nearest recycling station: https://muelli.app

  • Testsystem: Netlify Status
  • Produktiv: Netlify Status

Sybit Coding Camp 2021: 2.11. - 5.11.2021

Within the one week Sybit Coding-Camp ten teenagers were guided by the apprentices of Sybit building the web application: "Mülli".

Partner of the Project

The project is supported by several municipalities: https://airtable.com/embed/shrJyBkwkIxzvZfLh?backgroundColor=green

municipalities

Development

Project setup

Please ask the existing team for the .env file. Without it no connection to Airtable can be established.

npm install

Compiles and hot-reloads for development

npm run dev

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Vuetify

❗️ Important Links

💿 Install

Set up your project using your preferred package manager. Use the corresponding command to install the dependencies:

Package Manager Command
yarn yarn install
npm npm install
pnpm pnpm install
bun bun install

After completing the installation, your environment is ready for Vuetify development.

✨ Features

  • 🖼️ Optimized Front-End Stack: Leverage the latest Vue 3 and Vuetify 3 for a modern, reactive UI development experience. Vue 3 | Vuetify 3
  • 🗃️ State Management: Integrated with Pinia, the intuitive, modular state management solution for Vue.
  • 🚦 Routing and Layouts: Utilizes Vue Router for SPA navigation and vite-plugin-vue-layouts for organizing Vue file layouts. Vue Router | vite-plugin-vue-layouts
  • 💻 Enhanced Development Experience: Benefit from TypeScript's static type checking and the ESLint plugin suite for Vue, ensuring code quality and consistency. TypeScript | ESLint Plugin Vue
  • ⚡ Next-Gen Tooling: Powered by Vite, experience fast cold starts and instant HMR (Hot Module Replacement). Vite
  • 🧩 Automated Component Importing: Streamline your workflow with unplugin-vue-components, automatically importing components as you use them. unplugin-vue-components
  • 🛠️ Strongly-Typed Vue: Use vue-tsc for type-checking your Vue components, and enjoy a robust development experience. vue-tsc

These features are curated to provide a seamless development experience from setup to deployment, ensuring that your Vuetify application is both powerful and maintainable.

💡 Usage

This section covers how to start the development server and build your project for production.

Starting the Development Server

To start the development server with hot-reload, run the following command. The server will be accessible at http://localhost:3000:

yarn dev

(Repeat for npm, pnpm, and bun with respective commands.)

Building for Production

To build your project for production, use:

yarn build

Lints and fixes files

npm run lint

Import Locations

How to import ESRI shape files into the application?