Work

Vueegle Calendar

Vue JS
Vuetify
Firebase Auth
Google Calendar API

The application is designed to provide a complete and user-friendly calendar experience, allowing users to create events and sync them with their Google Calendar account.

vueCalendarImage

Vueegle Calendar

Built using Vue JS, Firebase Authentication, Vuetify, and Google Calendar API


The calendar application is a web-based platform built using Vue JS, Firebase Authentication, Vuetify, and Google Calendar API. The application is designed to provide a complete and user-friendly calendar experience, allowing users to create events and sync them with their Google Calendar account.

One of the key features of this application is its use of Firebase Authentication for logging in with Google credentials. The application provides a seamless and secure way for users to sign in to the application using their Google account. This feature also allows the application to use Google Calendar API to access the user’s calendar and create events.

The application allows users to create events and store them in Firebase Firestore. This allows for efficient data storage and retrieval, making it easy for the application to manage and display event information.

The application also syncs with the Google Calendar API, creating the same event in the user’s Google Calendar account. This feature provides a convenient and seamless way for users to manage their calendar events, regardless of whether they are using the application or their Google Calendar account.

The application not only syncs with the Google Calendar API, creating the same event in the user’s Google Calendar account but also has the ability to sync existing events from the user’s Google Calendar and display them in the application’s calendar. This feature provides a seamless and convenient way for users to manage their events in one place.

In addition, the application provides users with the option to choose which events they want to display on the calendar. Users can select to show only the Firestore events or both the Firestore and Google Calendar events. This feature provides users with greater control over the information they see on the calendar, allowing them to customize their view based on their preferences.

The user interface of the application is designed with Vuetify components, which allows for a responsive and modern design. Vuetify is a Material Design component framework for Vue JS, providing a set of pre-designed components for building web applications.

Overall, the calendar application is a great tool for managing events and staying organized. With its use of Vue JS, Firebase Authentication, Vuetify, and Google Calendar API, the application provides a modern and responsive design, efficient data storage and retrieval, and a secure and seamless authentication process. The ability to create events and sync them with the user’s Google Calendar account makes it easy for users to manage their events and stay on top of their schedule.

Libraries used

  • Firebase Auth
  • Firebase Firestore
  • Vuetify
  • Google Calendar API