ILLA home page
  1. Supabase DB

​

Supabase - це альтернатива Firebase з відкритим вихідним кодом, що дозволяє розробникам створювати веб-та мобільні додатки в режимі реального часу. Він надає багато таких функцій, як Firebase, наприклад, баз даних у реальному часі, автентифікація користувача, і хостинг, але з доданими перевагами себе з відкритим вихідним кодом і надання SQL API. Це дозволяє розробникам використовувати наявні знання і інструменти, що дозволяє легко інтегруватись з іншими системами. Крім того, Супаза забезпечує більш гнучку та настроювану платформу, ніж Firebase, що може бути більш обмеженим щодо моделювання даних та використання.

Цей посібник встановлює процес створення Панелі Адміністратора за допомогою ILLA Builder і Supabase за декілька простих кроків. ILLA - це низькококодова платформа для розробників, яка дозволяє швидко розвинути та розгорнути внутрішні інструменти. Це дозволяє створювати сторінки, перетягуванням компонентів інтерфейсу, з’єднуватися з будь-якою базою даних чи API, і писати JavaScript. Щоб дізнатися більше про Supabase, відвідайте свій сайт https://supabase.com/. Розпочнімо!

​
Крок 1: Налаштуйте "Назад" після завершення служби підтримки

На панелі [Supabase (https://app.supabase.com/projects), натисніть Новий проект і встановіть ім’я adminPanel.

Створіть нову таблицю, натиснувши на кнопку Створити нову таблицю .

Supabase пропонує безліч опцій для заповнення таблиць з даними, включаючи створення запитів, створення схем через інтерфейс користувача та завантаження файлів CSV.

Заповніть інформацію у таблиці. База даних налаштована.

​
Крок 2: Побудуйте інтерфейс на ILLA Cloud

В ILLA Cloud, натисніть Створити нову, щоб створити нову програму.

Перетягніть компоненти з панелі “Вкладений” на канву.

Виберіть компоненти на полотні та налаштуйте властивість на панелі “Інспект”.

Як видно на екрані нижче ми побудували просту панель адміністратора.

​
Крок 3: Підключіться до служби Supabase і config CRUD

Зверніть увагу на інформацію про підключення до бази даних в Налаштуваннях проекту у Supabase.

У списку дій натисніть + New і виберіть DB.

Заповніть форму для підключення до вашої служби Supabas. Перевірте підключення та збережіть ресурс.

Натисніть “Створити дію”, щоб створити дію з ресурсом Підтримка та налаштуйте CRUD.

Використайте {{ щоб отримати вхідні дані. Нижче наведено приклад сторінки управління користувачами на панелі адміністратора.

Пошук користувача за назвою, введеною у input1

SELECT *
користувач FROM
ім'я WHERE = "{{input1.value}}"

Оновлення даних користувача. Оновити інформацію користувача, коли ID збігається

UPDATE user
SET name = "{{input3.value}}"
, email = "{{input4.value}}"
WHERE id="{{input2.value}}"
;

Вставити дані користувача

INSERT INTO VALUES("{{input5.value}}","{{input6.value}}","{{input7.value}}");

Видалити користувача за ідентифікатором

DELETE FROM user WHERE id = "{{input2.value}}";

​
Крок 4: Показати дані на компонентах

Налаштуйте властивості компонентів {{ . Наприклад:

​
Ресурси