Skip to content

📋 Angular app using Supabase Postgres-based database backend to store data

Notifications You must be signed in to change notification settings

AndrewJBateman/angular-supabase-data

Repository files navigation

Angular Supabase Data

  • Angular frontend data entry form with a Supabase PostgreSQL database backend
  • Note: to open web links in a new window use: ctrl+click on link

GitHub repo size GitHub pull requests GitHub Repo stars GitHub last commit

📄 Table of contents

📚 General info

  • Supabase is an open-source alternative to Firebase, but uses PostgreSQL instead of document database. Database is realtime & can use SQL joins. Realtime notifications via Websockets. RESTful API requires no backend code.
  • RxJS was not required for Observables etc.

📷 Screenshots

Example screenshot Example screenshot

📶 Technologies

💾 Setup

  • npm i to install dependencies then...
  • Create free account with Supabase and create table using SQL option. Do not enable RLS (Row Level Security)
  • Add Supabase credentials to utils/initSupabase.ts
  • ng serve for a dev server. Navigate to http://localhost:4200/ - app will automatically reload if you change any of the source files
  • npm run lint to eslint typescript, npm run lint:fix to eslint and fix
  • npm run prettier to check and fix code formatting
  • ng build --prod for a build folder

🔦 Testing

  • ng test to execute the unit tests via Karma.
  • ng e2e to execute the end-to-end tests via Protractor.

💻 Code Examples

  • This creates a table in Supabase SQL option
create table todos (
 id bigint generated by default as identity primary key,
 name text check (char_length(name) > 0),
 done boolean default false,
);

🆒 Features

  • Supabase user interface is cool to work with and they have SQL templates to create tables etc.

📋 Status & To-Do List

  • Status: Working
  • To-Do: Add fields like created & updated dates. Set strict mode to true and correct type error
  • To-Do: use Angular routing to add more Supabase tables etc. or remove

👏 Inspiration

📁 License

  • This project is licensed under the terms of the MIT license.

✉️ Contact

  • Repo created by ABateman, email: gomezbateman@yahoo.com