Use Supabase with iOS and SwiftUI

Learn how to create a Supabase project, add some sample data to your database, and query the data from an iOS app.

Set up a Supabase project with sample data

Create a new project in the Supabase Dashboard.

After your project is ready, create a table in your Supabase database using the SQL Editor in the Dashboard. Use the following SQL statement to create a countries table with some sample data.

SQL_EDITOR


_10 -- Create the table
_10 CREATE TABLE countries (
_10 id SERIAL PRIMARY KEY,
_10 name VARCHAR(255) NOT NULL
_10 );
_10 -- Insert some sample data into the table
_10 INSERT INTO countries (name) VALUES ('United States');
_10 INSERT INTO countries (name) VALUES ('Canada');
_10 INSERT INTO countries (name) VALUES ('Mexico');

Create an iOS SwiftUI app with Xcode

Open Xcode > New Project > iOS > App. You can skip this step if you already have a working app.

Install the Supabase client library

Install Supabase package dependency using Xcode by following Apple's tutorial.

Make sure to add Supabase product package as dependency to the application.

Initialize the Supabase client

Create a new Supabase.swift file add a new supabase instance using your project URL and public API (anon) key:

Project URL

Anon key

Supabase.swift


_10import Supabase
_10
_10let supabase = SupabaseClient(
_10  supabaseURL: URL(string: "YOUR_SUPABASE_URL")!,
_10  supabaseKey: "YOUR_SUPABASE_ANON_KEY"
_10)

Create a data model for countries

Create a decodable struct to deserialize the data from the database.

Add the following code to a new file named Country.swift.

Supabase.swift


_10struct Country: Decodable, Identifiable {
_10  let id: Int
_10  let name: String
_10}

Query data from the app

Use a task to fetch the data from the database and display it using a List.

Replace the default ContentView with the following code.

ContentView.swift


_22struct ContentView: View {
_22
_22  @State var countries: [Country] = []
_22
_22  var body: some View {
_22    List(countries) { country in
_22      Text(country.name)
_22    }
_22    .overlay {
_22      if countries.isEmpty {
_22        ProgressView()
_22      }
_22    }
_22    .task {
_22      do {
_22        countries = try await supabase.from("countries").select().execute().value
_22      } catch {
_22        dump(error)
_22      }
_22    }
_22  }
_22}

Start the app

Run the app on a simulator or a physical device by hitting Cmd + R on Xcode.