Quickstarters
CRUD Samples
How to Develop a Basic CRUD Application with SwiftUI?
28 mnt
ikhtisar dalam panduan ini, anda akan belajar bagaimana mengembangkan aplikasi crud (buat, baca, perbarui, dan hapus) yang sepenuhnya fungsional menggunakan swiftui swiftui adalah kerangka kerja untuk membangun antarmuka pengguna untuk ios, ipados, watchos, tvos, visionos, dan macos kami akan menggunakan back4app sebagai layanan backend untuk mengelola data kami tutorial ini akan memandu anda melalui konfigurasi proyek back4app anda, merancang skema basis data anda, mengintegrasikan dengan swiftui menggunakan panggilan api, dan mengamankan backend anda apa yang akan anda pelajari cara membangun aplikasi crud yang menangani operasi data dengan mulus teknik untuk merancang backend yang kuat dan dapat diskalakan metode untuk menghubungkan antarmuka swiftui dengan back4app menggunakan rest api cara mengelola data dengan aman dengan kontrol akses yang canggih prasyarat akun back4app pastikan anda telah mendaftar dan mengatur proyek baru di back4app lihat panduan cepat back4app https //www back4app com/docs/get started/new parse app untuk bantuan lingkungan swiftui pastikan anda telah menginstal xcode dan membuat proyek swiftui dasar keterampilan pengetahuan dasar tentang swift, swiftui, dan restful api akan sangat membantu sebelum anda mulai langkah 1 – mendirikan proyek back4app anda inisialisasi proyek baru di back4app akses dasbor back4app anda dengan masuk ke akun anda pilih “aplikasi baru” untuk memulai proyek baru beri nama proyek anda misalnya, basic crud app swiftui , dan ikuti petunjuk di layar untuk menyelesaikan pengaturan buat proyek baru setelah proyek anda dibuat, itu akan muncul di dasbor anda, siap untuk dikonfigurasi untuk operasi backend langkah 2 – merancang skema database anda mendefinisikan model data anda untuk aplikasi crud ini, anda perlu mendefinisikan beberapa koleksi (kelas) di bawah ini adalah contoh yang menguraikan koleksi kunci beserta bidang dan jenisnya 1\ koleksi item koleksi ini menyimpan rincian tentang setiap entri bidang tipe tujuan id objectid kunci utama yang dihasilkan secara otomatis judul string nama atau judul item deskripsi string penjelasan singkat tentang item tersebut dibuat pada tanggal timestamp menandai pembuatan diperbarui pada tanggal timestamp pembaruan terbaru 2\ koleksi pengguna koleksi ini berisi kredensial pengguna dan detail profil bidang tipe tujuan id objectid pengidentifikasi unik yang dihasilkan secara otomatis nama pengguna string nama pengguna unik untuk masuk email string alamat email unik pengguna hash kata sandi string kata sandi terenkripsi untuk otentikasi dibuat pada tanggal stempel waktu pembuatan akun diperbarui pada tanggal stempel waktu modifikasi akun terakhir anda dapat mengonfigurasi kelas ini secara manual melalui dasbor back4app dengan membuat kelas baru dan menambahkan kolom untuk setiap field buat kelas baru manfaatkan alat dasbor untuk mendefinisikan nama field, tipe, nilai default, dan status yang diperlukan buat kolom memanfaatkan agen ai back4app agen ai back4app menyederhanakan proses pembuatan skema ia dapat secara otomatis menghasilkan skema basis data anda berdasarkan prompt tekstual cara menggunakan agen ai temukan agen ai masuk dan navigasikan ke bagian agen ai di pengaturan proyek anda kirim deskripsi skema anda masukkan prompt terperinci yang menjelaskan koleksi dan bidang yang diinginkan tinjau dan terapkan setelah pembuatan, verifikasi skema dan terapkan perubahan contoh prompt 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) fitur ini menghemat waktu dan memastikan konsistensi dalam pengaturan basis data anda langkah 3 – mengelola data dengan antarmuka admin ikhtisar antarmuka admin aplikasi admin back4app adalah alat tanpa kode yang menyederhanakan manajemen data antarmuka drag and drop yang intuitif memungkinkan anda melakukan operasi crud dengan mudah mengaktifkan antarmuka admin pergi ke menu “lainnya” di dasbor back4app anda pilih “aplikasi admin” dan kemudian pilih “aktifkan aplikasi admin ” atur kredensial buat pengguna admin awal anda, yang secara otomatis mengonfigurasi peran sistem aktifkan aplikasi admin setelah aktivasi, masuk ke aplikasi admin untuk mengelola koleksi anda dasbor aplikasi admin operasi crud di antarmuka admin buat gunakan opsi “tambahkan rekaman” di koleksi mana pun (misalnya, item) untuk menambahkan data baru baca/perbarui klik pada sebuah rekaman untuk melihat detail dan memodifikasi bidang hapus hapus rekaman menggunakan fungsi hapus ketika tidak lagi diperlukan antarmuka ini meningkatkan kegunaan dan menyederhanakan operasi data sehari hari langkah 4 – mengintegrasikan swiftui dengan back4app dengan backend anda sudah siap, saatnya menghubungkan aplikasi swiftui anda ke back4app menggunakan panggilan rest api di swiftui alih alih bergantung pada sdk, kita akan menggunakan panggilan rest api untuk berinteraksi dengan back4app dari aplikasi swiftui kita contoh mengambil item buat tampilan swiftui baru (misalnya, itemslistview\ swift ) dan tambahkan kode berikut 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() } } tampilan ini mengambil data dari back4app melalui rest dan menampilkannya dalam sebuah daftar operasi api lebih lanjut membuat item baru gunakan urlsession dengan permintaan post untuk menambahkan entri baru memperbarui item terapkan permintaan put untuk memodifikasi data yang ada menghapus item gunakan permintaan delete untuk menghapus data integrasikan operasi jaringan ini ke dalam tampilan swiftui anda sesuai kebutuhan langkah 5 – mengamankan backend anda menerapkan kontrol akses lindungi data anda dengan mengatur daftar kontrol akses (acl) untuk objek anda misalnya, untuk membuat catatan item yang aman 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() } mengonfigurasi izin tingkat kelas di dalam dasbor back4app anda, sesuaikan izin tingkat kelas (clp) untuk setiap koleksi untuk menegakkan siapa yang dapat membaca atau menulis data secara default langkah 6 – menerapkan autentikasi pengguna mendirikan akun pengguna back4app memanfaatkan kelas pengguna untuk menangani autentikasi di aplikasi swiftui anda, kelola pendaftaran dan login melalui panggilan rest api contoh pendaftaran pengguna 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() } pendekatan ini dapat diperluas untuk login pengguna dan manajemen sesi langkah 7 – kesimpulan dan peningkatan masa depan kerja bagus! anda telah berhasil membangun aplikasi crud dasar menggunakan swiftui dan back4app anda membuat proyek berjudul basic crud app swiftui , merancang skema database anda untuk item dan pengguna, dan menghubungkan frontend swiftui anda ke backend melalui panggilan rest api selain itu, anda belajar bagaimana mengamankan data anda dengan acl dan menerapkan otentikasi pengguna apa selanjutnya? perluas ui anda tingkatkan antarmuka swiftui anda dengan tampilan rinci, animasi, dan elemen interaktif fitur lanjutan gabungkan logika backend tambahan seperti cloud functions atau pembaruan data waktu nyata jelajahi lebih banyak kunjungi dokumentasi back4app https //www back4app com/docs untuk wawasan lebih lanjut tentang mengoptimalkan aplikasi anda dan mengintegrasikan fungsionalitas yang lebih canggih dengan mengikuti panduan ini, anda sekarang memiliki keterampilan dasar untuk membuat backend crud yang kuat dan dapat diskalakan untuk aplikasi swiftui anda menggunakan back4app selamat membangun dan berinovasi!