Each datbase you create will have a uniue url and api key. You can access this from home button at the top of the dashboard nav tree.
connection.js (this will be imported into each script file where we need the url and api key)
index.html (your html page)
script.js (or different as required by your project
The export will allow us to read these variables into our script module below.
const supabaseUrl = '...';
const supabaseKey = '...';
In your html code you will need to include the script file. You will notice the only difference is that we include type="module"
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js"></script>
</head>
<body>
<h1>Login</h1>
<input type="text" id="email" placeholder="Email" />
<input type="password" id="password" placeholder="Password" />
<button id="loginButton">Login</button>
</body>
<script src="connection.js" defer></script>
<script src="script.js" defer></script>
</html>
create a connection to supabase for sending commands using the key and id from connection.js
Add a addCustomer function
You can now start building your app
const supabase = window.supabase.createClient(supabaseUrl, supabaseKey);
async function addCustomer(name, email) {
const { data, error } = await supabase
.from("customers")
.insert([{ name: name, email: email }]);
if (error){
console.error("Error inserting customer:", error);
}
else {
console.log("Customer added:", data);
}
}