Quickstarters
How to Develop a Basic CRUD Application with SwiftUI?

28min
Overview
In this guide, you will learn how to develop a fully functional CRUD (create, read, update, and delete) application using SwiftUI. 
SwiftUI is a framework for building user interfaces for iOS, iPadOS, watchOS, tvOS, visionOS, and macOS. 
We'll use Back4app as the backend service to manage our data. This tutorial walks you through configuring your Back4app project, designing your database schema, integrating with SwiftUI using API calls, and securing your backend.
What You'll Learn
How to construct a CRUD app that handles data operations seamlessly.
Techniques for designing a robust and scalable backend.
Methods to connect a SwiftUI interface with Back4app using REST APIs.
How to manage data securely with advanced access controls.
﻿
Prerequisites
﻿
Back4app Account: Ensure you have signed up and set up a new project on Back4app.
Refer to Back4app Quickstart for assistance.
SwiftUI Environment: Confirm that you have Xcode installed and a basic SwiftUI project created.
Familiarity: Basic knowledge of Swift, SwiftUI, and RESTful APIs will be helpful.
Before You Start:
﻿
Step 1 – Establishing Your Back4app Project
Initiate a New Project on Back4app
Access your Back4app dashboard by logging into your account.
Select “New App” to begin a fresh project.
Name your project: For example, Basic-CRUD-App-SwiftUI, and follow the on-screen directions to complete the setup.
Create New Project
﻿
Once your project is created, it will appear in your dashboard, ready to be configured for backend operations.
﻿
Step 2 – Crafting Your Database Schema
Defining Your Data Model
For this CRUD application, you need to define several collections (classes). Below are examples that outline key collections along with their fields and types.
1. Collection: Items
This collection stores details about each entry.
Field
Type
Purpose
_id
ObjectId
Auto-generated primary key.
title
String
Name or title of the item.
description
String
Brief explanation about the item.
created_at
Date
Timestamp marking creation.
updated_at
Date
Timestamp of the latest update.
2. Collection: Users
This collection contains user credentials and profile details.
Field
Type
Purpose
_id
ObjectId
Auto-generated unique identifier.
username
String
Unique username for login.
email
String
User's unique email address.
password_hash
String
Encrypted password for authentication.
created_at
Date
Account creation timestamp.
updated_at
Date
Timestamp of last account modification.
You can configure these classes manually via the Back4app dashboard by creating new classes and adding columns for each field.
Create New Class
﻿
Utilize the dashboard tools to define the field name, type, default value, and required status.
Create Column
﻿
Leveraging the Back4app AI Agent
The Back4app AI Agent streamlines the process of schema generation. It can automatically produce your database schema based on a textual prompt.
How to Utilize the AI Agent:
Locate the AI Agent:
Sign in and navigate to the AI Agent section in your project settings.
Submit Your Schema Description:
Input a detailed prompt that outlines the desired collections and fields.
Review and Implement:
After generation, verify the schema and apply the changes.
Sample Prompt
Text
Create these collections in my Back4app project:

1) Collection: Items
- Fields:
  - _id: ObjectId (auto-generated)
  - title: String
  - description: String
  - created_at: Date (auto-generated)
  - updated_at: Date (auto-updated)

2) Collection: Users
- Fields:
  - _id: ObjectId (auto-generated)
  - username: String (unique)
  - email: String (unique)
  - password_hash: String
  - created_at: Date (auto-generated)
  - updated_at: Date (auto-updated)
Create these collections in my Back4app project:

1) Collection: Items
- Fields:
  - _id: ObjectId (auto-generated)
  - title: String
  - description: String
  - created_at: Date (auto-generated)
  - updated_at: Date (auto-updated)

2) Collection: Users
- Fields:
  - _id: ObjectId (auto-generated)
  - username: String (unique)
  - email: String (unique)
  - password_hash: String
  - created_at: Date (auto-generated)
  - updated_at: Date (auto-updated)
﻿
This feature saves time and ensures consistency in your database setup.
﻿
Step 3 – Managing Data with the Admin Interface
Overview of the Admin Interface
The Back4app Admin App is a no-code tool that simplifies data management. Its intuitive drag-and-drop interface enables you to perform CRUD operations effortlessly.
Activating the Admin Interface
Go to the “More” menu in your Back4app dashboard.
Select “Admin App” and then choose “Enable Admin App.”
Set Up Credentials:
Create your initial admin user, which configures system roles automatically.
Enable Admin App
﻿
After activation, log into the Admin App to manage your collections.
Admin App Dashboard
﻿
CRUD Operations in the Admin Interface
Create: Use the “Add Record” option in any collection (e.g., Items) to add new data.
Read/Update: Click on a record to view details and modify fields.
Delete: Remove records using the delete function when they are no longer needed.
This interface enhances usability and simplifies everyday data operations.
﻿
Step 4 – Integrating SwiftUI with Back4app
With your backend in place, it’s time to connect your SwiftUI application to Back4app.
Using REST API Calls in SwiftUI
Instead of relying on the  SDK, we’ll use REST API calls to interact with Back4app from our SwiftUI app.
Example: Fetching Items
Create a new SwiftUI view (e.g., ItemsListView.swift) and add the following code:
Swift
import SwiftUI
import Combine

struct Item: Identifiable, Codable {
    let id: String
    let title: String
    let description: String
}

class ItemsViewModel: ObservableObject {
    @Published var items: [Item] = []
    private var cancellables = Set<AnyCancellable>()

    func fetchItems() {
        guard let url = URL(string: "https://parseapi.back4app.com/classes/Items") else { return }
        var request = URLRequest(url: url)
        request.addValue("YOUR_APPLICATION_ID", forHTTPHeaderField: "X-Parse-Application-Id")
        request.addValue("YOUR_REST_API_KEY", forHTTPHeaderField: "X-Parse-REST-API-Key")

        URLSession.shared.dataTaskPublisher(for: request)
            .map { $0.data }
            .decode(type: ItemsResponse.self, decoder: JSONDecoder())
            .receive(on: DispatchQueue.main)
            .sink(receiveCompletion: { completion in
                if case let .failure(error) = completion {
                    print("Error fetching items: \(error)")
                }
            }, receiveValue: { response in
                self.items = response.results
            })
            .store(in: &cancellables)
    }
}

struct ItemsResponse: Codable {
    let results: [Item]
}

struct ItemsListView: View {
    @StateObject private var viewModel = ItemsViewModel()

    var body: some View {
        NavigationView {
            List(viewModel.items) { item in
                VStack(alignment: .leading) {
                    Text(item.title)
                        .font(.headline)
                    Text(item.description)
                        .font(.subheadline)
                }
            }
            .navigationTitle("Items")
            .onAppear {
                viewModel.fetchItems()
            }
        }
    }
}

struct ItemsListView_Previews: PreviewProvider {
    static var previews: some View {
        ItemsListView()
    }
}
import SwiftUI
import Combine

struct Item: Identifiable, Codable {
    let id: String
    let title: String
    let description: String
}

class ItemsViewModel: ObservableObject {
    @Published var items: [Item] = []
    private var cancellables = Set<AnyCancellable>()

    func fetchItems() {
        guard let url = URL(string: "https://parseapi.back4app.com/classes/Items") else { return }
        var request = URLRequest(url: url)
        request.addValue("YOUR_APPLICATION_ID", forHTTPHeaderField: "X-Parse-Application-Id")
        request.addValue("YOUR_REST_API_KEY", forHTTPHeaderField: "X-Parse-REST-API-Key")

        URLSession.shared.dataTaskPublisher(for: request)
            .map { $0.data }
            .decode(type: ItemsResponse.self, decoder: JSONDecoder())
            .receive(on: DispatchQueue.main)
            .sink(receiveCompletion: { completion in
                if case let .failure(error) = completion {
                    print("Error fetching items: \(error)")
                }
            }, receiveValue: { response in
                self.items = response.results
            })
            .store(in: &cancellables)
    }
}

struct ItemsResponse: Codable {
    let results: [Item]
}

struct ItemsListView: View {
    @StateObject private var viewModel = ItemsViewModel()

    var body: some View {
        NavigationView {
            List(viewModel.items) { item in
                VStack(alignment: .leading) {
                    Text(item.title)
                        .font(.headline)
                    Text(item.description)
                        .font(.subheadline)
                }
            }
            .navigationTitle("Items")
            .onAppear {
                viewModel.fetchItems()
            }
        }
    }
}

struct ItemsListView_Previews: PreviewProvider {
    static var previews: some View {
        ItemsListView()
    }
}
﻿
This view fetches data from Back4app via REST and displays it in a list.
Further API Operations
Creating New Items: Use URLSession with a POST request to add new entries.
Updating Items: Implement PUT requests for modifying existing data.
Deleting Items: Utilize DELETE requests to remove data.
Integrate these network operations within your SwiftUI views as needed.
﻿
Step 5 – Securing Your Backend
Implementing Access Controls
Protect your data by setting Access Control Lists (ACLs) for your objects. For example, to create a secure item record:
Swift
func createSecureItem(title: String, description: String, ownerId: String) {
    guard let url = URL(string: "https://parseapi.back4app.com/classes/Items") else { return }
    var request = URLRequest(url: url)
    request.httpMethod = "POST"
    request.addValue("YOUR_APPLICATION_ID", forHTTPHeaderField: "X-Parse-Application-Id")
    request.addValue("YOUR_REST_API_KEY", forHTTPHeaderField: "X-Parse-REST-API-Key")
    request.addValue("application/json", forHTTPHeaderField: "Content-Type")

    let itemData: [String: Any] = [
        "title": title,
        "description": description,
        "ACL": [
            ownerId: ["read": true, "write": true],
            "*": ["read": false, "write": false]
        ]
    ]

    request.httpBody = try? JSONSerialization.data(withJSONObject: itemData)

    URLSession.shared.dataTask(with: request) { data, response, error in
        if let error = error {
            print("Error creating item: \(error)")
        }
    }.resume()
}
func createSecureItem(title: String, description: String, ownerId: String) {
    guard let url = URL(string: "https://parseapi.back4app.com/classes/Items") else { return }
    var request = URLRequest(url: url)
    request.httpMethod = "POST"
    request.addValue("YOUR_APPLICATION_ID", forHTTPHeaderField: "X-Parse-Application-Id")
    request.addValue("YOUR_REST_API_KEY", forHTTPHeaderField: "X-Parse-REST-API-Key")
    request.addValue("application/json", forHTTPHeaderField: "Content-Type")

    let itemData: [String: Any] = [
        "title": title,
        "description": description,
        "ACL": [
            ownerId: ["read": true, "write": true],
            "*": ["read": false, "write": false]
        ]
    ]

    request.httpBody = try? JSONSerialization.data(withJSONObject: itemData)

    URLSession.shared.dataTask(with: request) { data, response, error in
        if let error = error {
            print("Error creating item: \(error)")
        }
    }.resume()
}
﻿
Configuring Class-Level Permissions
Within your Back4app dashboard, adjust Class-Level Permissions (CLPs) for each collection to enforce who can read or write data by default.
﻿
Step 6 – Implementing User Authentication
Establishing User Accounts
Back4app leverages a User class to handle authentication. In your SwiftUI app, manage registration and login via REST API calls.
Example: User Registration
Swift
func signUpUser(username: String, password: String, email: String) {
    guard let url = URL(string: "https://parseapi.back4app.com/users") else { return }
    var request = URLRequest(url: url)
    request.httpMethod = "POST"
    request.addValue("YOUR_APPLICATION_ID", forHTTPHeaderField: "X-Parse-Application-Id")
    request.addValue("YOUR_REST_API_KEY", forHTTPHeaderField: "X-Parse-REST-API-Key")
    request.addValue("application/json", forHTTPHeaderField: "Content-Type")

    let userData: [String: Any] = [
        "username": username,
        "password": password,
        "email": email
    ]

    request.httpBody = try? JSONSerialization.data(withJSONObject: userData)

    URLSession.shared.dataTask(with: request) { data, response, error in
        if let error = error {
            print("Sign up error: \(error)")
        } else {
            print("User registered successfully")
        }
    }.resume()
}
func signUpUser(username: String, password: String, email: String) {
    guard let url = URL(string: "https://parseapi.back4app.com/users") else { return }
    var request = URLRequest(url: url)
    request.httpMethod = "POST"
    request.addValue("YOUR_APPLICATION_ID", forHTTPHeaderField: "X-Parse-Application-Id")
    request.addValue("YOUR_REST_API_KEY", forHTTPHeaderField: "X-Parse-REST-API-Key")
    request.addValue("application/json", forHTTPHeaderField: "Content-Type")

    let userData: [String: Any] = [
        "username": username,
        "password": password,
        "email": email
    ]

    request.httpBody = try? JSONSerialization.data(withJSONObject: userData)

    URLSession.shared.dataTask(with: request) { data, response, error in
        if let error = error {
            print("Sign up error: \(error)")
        } else {
            print("User registered successfully")
        }
    }.resume()
}
﻿
This approach can be extended for user login and session management.
﻿
Step 7 – Conclusion and Future Enhancements
Great job! You’ve successfully built a basic CRUD application using SwiftUI and Back4app. 
You created a project titled Basic-CRUD-App-SwiftUI, designed your database schema for Items and Users, and connected your SwiftUI frontend to the backend via REST API calls. 
Additionally, you learned how to secure your data with ACLs and implement user authentication.
What’s Next?
Expand Your UI: Enhance your SwiftUI interface with detailed views, animations, and interactive elements.
Advanced Features: Incorporate additional backend logic such as Cloud Functions or real-time data updates.
Explore More: Visit the Back4app documentation for further insights into optimizing your app and integrating more advanced functionalities.
By following this guide, you now have the essential skills to create a robust and scalable CRUD backend for your SwiftUI applications using Back4app. Enjoy building and innovating!
Field	Type	Purpose
_id	ObjectId	Auto-generated primary key.
title	String	Name or title of the item.
description	String	Brief explanation about the item.
created_at	Date	Timestamp marking creation.
updated_at	Date	Timestamp of the latest update.
Field	Type	Purpose
_id	ObjectId	Auto-generated unique identifier.
username	String	Unique username for login.
email	String	User's unique email address.
password_hash	String	Encrypted password for authentication.
created_at	Date	Account creation timestamp.
updated_at	Date	Timestamp of last account modification.
Updated 21 Feb 2025
Did this page help you?
Building a CRUD App with Jetpack Compose?
How to Build a CRUD App with Backbone.js? A Step-by-Step Tutorial