In this video, we will build a workout tracker app with authentication using Vue.js 3 and its composition API along with Supabase
Code: https://github.com/johnkomarnicki/active_tracker
Live Demo: https://active-tracker-yt.herokuapp.com/login
John's YouTube:
https://www.youtube.com/c/JohnKomarnicki
John's Twitter:
Twitter: https://twitter.com/john_komarnicki
0:00 Introduction
0:35 Project walkthrough
5:41 Project setup
10:51 Supabase setup/creation
17:18 Navigation
25:29 Supabase authentication introduction
29:11 Register & Login layout’s
44:00 Registering user
53:16 Loggin in a user
58:22 Storing user in state/store
1:09:38 Conditional rendering (nav links)
1:11:50 Create workout layout
1:41:05 Create workout functionality
1:50:17 Sending workout data to supabase
1:57:40 Enabling supabase policy’s
2:00:39 Retrieving all data from supabase
2:05:37 Home layout
2:15:28 Retrieve specific data from supabase
2:23:18 View workout layout
2:52:43 View workout functionality
3:05:15 Page / View titles
3:08:16 Route guarding
3:12:37 Deploy to Heroku