This template should help get you started developing the final project running on Vue 3 with the composition API, Pinia as a state management tool, vue router, vite and lastly Supabase running on the backend.
This is meant as an advanced starter ready to plug in your supabase variables and run directly on a local server already connected to your Supabase instance.
You are given some functions to see how the supabase ecosystem works with Vue and more specifically, pinia as a state management tool.
You can add any CSS framework of your liking like tailwindCSS, Bootstrap, MaterialUI or many of the cool libaries that exist in the web.
This app is not setUp to be deployed to a production environment like vercel or netlify.
Friday on August 19 we will look at how can we deploy this app to Vercels ecosystem.
npm install
VITE_SUPABASE_URL
VITE_SUPABASE_ANON_KEY
Once you have added your environment variables, head to your .gitIgnore file located at the root folder and uncomment the .env file naming to avoid sharing any private access keys to your database
npm run dev
npm run build
review steps to take & structure
create database for users & tasks in SupaBase
start sign in & sign up forms logic
link database with forms for users to register
create Nav component with logout
finish logout logic
login styling
signup styling
create home template
create new task form
send new task to supabase
finish sending new task to supabase
bring existing taks form supabase
delete tasks
edit tasks
mark tasks as completed (toggle)
edit tasks