{"id":642,"date":"2019-07-10T19:08:54","date_gmt":"2019-07-10T19:08:54","guid":{"rendered":"https:\/\/2019.annarbor.wordcamp.org\/?post_type=wcb_session&p=642"},"modified":"2019-07-10T20:09:46","modified_gmt":"2019-07-10T20:09:46","slug":"how-i-built-wpbingo-com-a-pwa-that-uses-vue-js-tailwind-css-and-the-wp-rest-api","status":"publish","type":"wcb_session","link":"https:\/\/annarbor.wordcamp.org\/2019\/session\/how-i-built-wpbingo-com-a-pwa-that-uses-vue-js-tailwind-css-and-the-wp-rest-api\/","title":{"rendered":"How I built WPBingo.com: a PWA that uses Vue.js, Tailwind CSS, and the WP REST API"},"content":{"rendered":"
\n
\n
\n

Just prior to WCUS 2017 I had the fun idea of creating an interactive bingo board for all of the fun and unique things that we regularly observe within our community. I was able to knock together the original concept after just a couple of hours thanks to utility provided by View and tailwind. Later I connected it to WordPress via the rest API so that I could more easily manage each of the squares available in the data set. Finally, I added a service worker to make the entire experience work offline.<\/p>\n

In this presentation I walk you through how I went from idea to prototype to fully functional web app. We\u2019ll cover the purpose served by my chosen frameworks and why I picked those instead of writing plain, vanilla JavaScript and CSS (or competing frameworks, for that matter). While this will not be a deep dive into code, we will review specific code samples and you should get enough detail to build this \u2013 or something like it \u2013 yourself by the time the session has ended.<\/p>\n

Here\u2019s a specific list of the things you can expect to learn during this presentation:<\/strong><\/p>\n