Frontend

screenshot of Frontend
vue
scss
vuetify

Frontend of disfactory.tw. Built with Vue.js. For backend please checkout https://github.com/Disfactory/Disfactory

Overview

Disfactory is an innovative platform designed to tackle the issue of illegal factories in Taiwan. By providing an easy-to-use frontend for users to report such establishments, Disfactory aims to contribute to community safety and regulatory compliance. The initiative not only focuses on gathering reports from the public but also includes robust backend support and a systematic design framework, making it a comprehensive solution for a pressing issue.

The platform facilitates transparency and accountability in the manufacturing sector, encouraging citizens to engage in the reporting process. Its dual server setup ensures that both production and staging environments are effectively managed, enhancing the reliability and performance of the application as it scales.

Features

  • User-Friendly Interface: The frontend is designed for easy navigation, allowing users to report illegal factories effortlessly.
  • Comprehensive Reporting System: Users can provide detailed information about illegal factories, contributing to better investigation and enforcement.
  • Robust Backend Support: The backend of Disfactory is built for stability and efficiency, ensuring smooth operation even under high user load.
  • Dual Environment Deployment: The platform operates both a production and a staging server, ensuring continuous updates and testing without impacting user experience.
  • Community Engagement: Disfactory encourages public involvement, making it a collective effort towards improving industrial standards in Taiwan.
  • Open Source Accessibility: The project is licensed under the MIT License, promoting transparency and community development through shared innovation.
  • Design Framework: The UI design is crafted with user experience in mind, ensuring that the platform is not only functional but visually appealing.
vue
Vue

Vue.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.

scss
SCSS

SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.

vuetify
Vuetify

Vuetify is a no design skills required UI Library with beautifully handcrafted Vue Components.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.