Как отображать данные из Supabase на JavaScript и HTML ⇐ CSS

[Anonymous]

Я хочу отображать данные из Supabase на своем веб-сайте. Я хочу, чтобы каждый раз, когда вы нажимаете кнопку загрузки, он выбирал случайную строку из моей базы данных и отображал информацию на веб-сайте.

Код: Выделить всё

Team Page




import { createClient } from "../utils/supabaseClient";

// Create a single supabase client for interacting with your database

const supabase = createClient('Your Supabase Website', 'Your Supabase Key')

const { data, error } = await supabase

.from('events')

.select()




.background{
background-color: #1b1b1b;
}

.id-text{
color: #3e3e3e;
font-family: 'Outfit', sans-serif;
margin-top: 30px;
margin-left: 30px;
}

.foto{
margin-left: 30px;
}

.label{
font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
color: white;
font-size: 40px;
font-weight: bolder;
vertical-align: top;
}

.beschreibung{
color: white;
font-family: 'Outfit', sans-serif;
word-wrap: break-word;
width: 400px;
}

.div-margin-top{
margin-top: 30px;
}

.div-margin-left{
margin-left: 30px;
}

.div-margin-bottom{
margin-bottom: 30px;
}

.float-left{
float: left;
}

.float-right{
float: right;
}

.float-center{
float: inline-start;
}

.myButton-green {
background-color:#44c767;
border-radius:23px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:20px;
padding:16px 31px;
text-decoration:none;
}
.myButton-green:hover {
background-color:#5cbf2a;
}
.myButton-green:active {
position:relative;
top:1px;
}

.myButton-red {
background-color:#ff0000;
border-radius:28px;
border:1px solid #ab1919;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:17px;
padding:16px 31px;
text-decoration:none;
}
.myButton-red:hover {
background-color:#c90000;
}
.myButton-red:active {
position:relative;
top:1px;
}





id:0

[img]image url here[/img]

Trödelmarkt Äppelallee

Das ist eine Beschreibung zum Trödelmarkt TestTestTestTest TestTestTestTestTestTestTestTestTestTestTest TestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTest

Event Day: 21.08.2024 - 21.08.2024

Event Time: 08:00 Uhr - 16:00 Uhr

Event Location: Äppelallee Center

Event City: Wiesbaden

Event Kategorie: Verkauf

Event Priority: Hoch

Event Veranstalter: Wiesbaden Bürgerbüro

Event Url: https://www.wiesbaden.de/

Weitere Infos: Joa, sonst nichts

Event Status: in Progress

Upload

Delete

Я уже прочитал документацию Supabase, но это мне не помогло, извините за мой английский, английский не является моим родным языком. И, кстати, текст в Divs просто временный, там должны быть данные из базы данных.
Спасибо

Подробнее здесь: https://stackoverflow.com/questions/789 ... t-and-html