Google Calendar API Event Page (Tailwind Project) | Intro & Setup

Описание

Google Calendar is the default system for a reason: it’s stable, ubiquitous, and easy-to-use. Displaying calendar data, however can be a bit clunky, especially if you want your event page to reflect your site’s branding. In this series, I’ll show you how to:
- Create a custom calendar event page with HTML, Tailwind CSS, and ViteJS
- How to publish your site to Netlify
- How to get a Google API key and store it safely as a Netlify environmental variable
- How to write your own custom serverless function, allowing for dynamic query string parameters
- How to fetch dynamic calendar data from your Google Calendar endpoint and display it on your site.

? Key Links ?
- Live code: https://codinginpublic.dev/projects/google-calendar-event-page/
- GitHub: https://github.com/coding-in-public/google-calendar-event-page
Help me make it better! Contribute to the community-improvements branch on GitHub.

? Other Videos in this Series ?
- Full Playlist: https://www.youtube.com/watch?v=SOsGToYI0MQ&list=PLoqZcxvpWzzeuzWsIpH-N1b3vnRVbrdm3
- Video 2: https://youtu.be/CObyHiI7TEQ
- Video 3: https://youtu.be/wf5gVe8hWnk
- Video 4: https://youtu.be/_ec2ps7w8s4

---------------------------------------

? Additional Links ?
- NodeJS: https://nodejs.org/en/
- Vite JS: https://vitejs.dev/
- Tailwind: https://tailwindcss.com/docs/installation/using-postcss

---------------------------------------

⏲️ Timestamps ⏲️
0:00 Introduction
1:35 ViteJS setup
2:31 Tailwind setup

---------------------------------------

? Connect With Me ?
- Website: https://www.codinginpublic.dev
- Blog: https://www.chrispennington.blog
- Twitter: https://twitter.com/cpenned

Source for images: Google, Tailwind, Netlify