Workplaces for digital nomads: the frontend

• frontend

  1 3 0.0 Vue

  Frontend part of Workplaces in Cyprus website (by workplacescy)

  

The entry component src/components/Home.vue:

• vue-google-maps

  2 190 0.0 JavaScript

  Reactive Vue 3 components for Google maps

The fawmi/vue-google-maps library, version 0.9.72, is used to display the map. The author broke the map in later versions and did not publish the source code on GitHub (however, these versions are available via npm).

• SurveyJS

  surveyjs.io featured

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• vite-plugin-pwa

  9 2,762 8.6 TypeScript

  Zero-config PWA for Vite

  

PWA is created with vite-pwa/vite-plugin-pwa, and its parameters are set in vite.config.js. In summary, the implementation of PWA was not a project aim, but it did provide good caching of all project components and resulted in a very quick reopening of the site.

• vite

  791 64,913 9.9 TypeScript

  Next generation frontend tooling. It's fast!

  

Builds the project with Vite and some magic in vite.config.js to optimise the final code, including CSS and HTML minification and the creation of a lighter version of Sentry.

• vue-router

  46 19,020 5.2 JavaScript

  🚦 The official router for Vue 2

  

A simple src/router/index.js router based on vue-router allows you to avoid utilising the store for now (with the current project capabilities) and helps with 404 error handling.

• Sentry

  266 36,957 10.0 Python

  Developer-first error tracking and performance monitoring

  

The same Sentry and Honeybadger.

• Quasar Framework

  159 25,228 9.9 JavaScript

  Quasar Framework - Build high-performance VueJS user interfaces in record time

  

Overall, I preferred Vuetify over Quazar and other UI frameworks. However, it has its own drawbacks:

• InfluxDB

  www.influxdata.com featured

  Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  

• purgecss

  51 7,662 8.4 TypeScript

  Remove unused CSS

  

Unable to get rid of unused styles. Importing components individually and setting styles in SASS can greatly simplify builds, but several common unused styles can't be deleted using PurgeCSS and analogues due to dynamic class names.

• MaterialDesign

  56 10,880 9.1

  ✒7000+ Material Design Icons from the Community

Instead of using Vuetify's default font icons, the project imports SVG icons from the mdi/js package at https://materialdesignicons.com. This saves approximately 1 MB in the final package.

Suggest a related project