Pengenalan proyek
Alibaba Baixiu, sistem manajemen konten, dibagi menjadi dua fungsi inti: manajemen konten dan tampilan konten.
1. Modul fungsi
1.1 Manajemen konten
modul | Fungsi |
---|
pengguna | Login, logout, penambahan pengguna, penghapusan, modifikasi dan kueri |
artikel | Manajemen artikel |
Klasifikasi | Manajemen klasifikasi |
Komentar | Manajemen komentar |
Pengaturan situs web | Kata kunci, deskripsi, logo website, gambar carousel |
1.2 Tampilan konten
modul | Fungsi |
---|
halaman depan | Navigasi, tampilan data artikel |
Halaman daftar | Menampilkan daftar artikel berdasarkan kategori |
Halaman detail | Tampilkan detail artikel dan terapkan fungsi komentar |
2. Modus pengembangan
2.1 Model pengembangan campuran front-end dan back-end
Semua kode HTML dan data disambung di sisi server, dan semua konten dikirim ke klien sekaligus.
![02](https://images.downcodes.com/uploads/20250111/img_6781f62235aff30.png)
pertanyaan:
- Pengembang front-end dan back-end tidak akrab dengan kode masing-masing. Sangat sulit bagi pengembangan campuran untuk menangani kode satu sama lain.
- Selama proses pengembangan, kode pasti akan tumpang tindih satu sama lain, sehingga menggandakan beban kerja.
2.2 Model pengembangan pemisahan front-end dan back-end
![03](https://images.downcodes.com/uploads/20250111/img_6781f62235f6b31.png)
Keunggulan: tanggung jawab dan pembagian kerja yang jelas, pengembangan mandiri, tidak saling mempengaruhi.
3. Struktur proyek
Pelapisan sistem | Gunakan teknologi |
---|
lapisan data | mongoDB |
lapisan layanan | node.js (ekspres) |
klien | templat seni, jQuery, font-mengagumkan, gesek |
4. Menyiapkan lingkungan operasi proyek (hal-hal yang harus Anda ketahui untuk menjalankan proyek)
- Instal perangkat lunak node.js dan uji apakah berhasil diinstal
- Win + R membuka program yang sedang berjalan di sistem Windows, masukkan PowerShell di program yang sedang berjalan dan tekan Enter untuk membuka program baris perintah
- Masukkan perintah
node -v
untuk memeriksa versi node.js. Jika nomor versi ditampilkan di program baris perintah dan tidak ada kesalahan yang dilaporkan, instalasi berhasil.
- Instal perangkat lunak mongodb dan mongodb-compass
- Salin folder proyek Alibaba Baixiu ke hard disk (program sisi server)
- Buka direktori root proyek di alat baris perintah
- Tahan tombol shift, klik kanan dan pilih Buka jendela PowerShell di sini
- Gunakan perintah
npm install
untuk menginstal file ketergantungan yang diperlukan untuk proyek tersebut - Buka file app.js dan ubah bagian koneksi database pada baris 47: 'mongodb://itcast:itcast@localhost:27017/alibaixiu'
untuk 'mongodb://localhost:27017/alibaixiu'
(1) Alasan: Anda tidak membuat akun koneksi database mongodb dan informasi kata sandi. Kami memilih untuk menggunakan metode default untuk masuk ke database mongodb.
(2) Jika Anda ingin masuk ke database dengan akun dan kata sandi Anda. Silakan merujuk ke: https://www.cnblogs.com/b02330224/p/10049395.html
Masukkan perintah secara berurutan pada baris perintah: use alibaixiu
#Masukkan database alibixiu
db.createUser({user:'itcast',pwd:'itcast',roles:['readWrite']})
#Buat pengguna database
Jika Anda ditanya bahwa izin tidak mencukupi, silakan merujuk ke tautan di atas dan masuk ke database dengan akun administrator mongodb terlebih dahulu.
7. (Langkah baru) Baru-baru ini, data database db_data telah diunggah, dan database alibixiu dapat dimasukkan melalui perangkat lunak mongodb-compass.
Buat koleksi users
, comment
, slides
, categories
, posts
, settings
dengan nama yang sama dengan data json di folder db_data
(Koleksi), dan terakhir impor data json yang sesuai di setiap koleksi secara bergantian.
![data impor](https://images.downcodes.com/uploads/20250111/img_6781f6223634332.png)
8. Masukkan node app.js
di alat baris perintah untuk memulai proyek
5. Hal-hal yang perlu diperhatikan setelah menjalankan proyek (hal-hal yang harus Anda ketahui untuk menjalankan好看的项目
)
1. Buka browser dan masukkan localhost:3000/admin/login.html di bilah alamat browser untuk masuk ke halaman login.
Masukkan nama pengguna default sistem: (asli) [email protected] (sekarang) [email protected] Kata sandi: 123456 Masuk ke halaman administrator
2. Karena file database tidak diunggah, semua data perlu ditambahkan secara manual (jika data json di db_data dimasukkan, lewati langkah 2-10)
3. Masuk ke halaman administrator dan ubah terlebih dahulu informasi akun Anda (ubah kata sandi, dll.) dan unggah avatar pengguna.
4. Kemudian tambahkan informasi artikel, informasi pengaturan sistem, dan informasi gambar carousel (tidak perlu memesan, menambahkan berarti mengisi informasi formulir, memilih file gambar, dll.)
5. Perhatikan bahwa ketika mengubah informasi klasifikasi, ikon informasi klasifikasi perlu dicari pada font-awesome, seperti: fa-phone, fa-gift, dll.
Format nama kelas gambar yang dicari pada font-awesome adalah: fa fa-xxx-xxx, Anda hanya perlu menambahkan bagian fa-xxx-xxx setelahnya.
6. Setelah menambahkan informasi database dasar, Anda dapat memilih untuk keluar dan mendaftarkan pengguna baru (pengguna yang terdaftar secara default adalah pengguna biasa)
Atau gunakan hak tambah pengguna administrator untuk menambahkan pengguna biasa.
7. Setelah data latar belakang ditambahkan, gunakan akun pengguna biasa untuk masuk ke halaman tampilan artikel front-end (jika ingin konten halaman lebih kaya
Disarankan untuk menambahkan sekitar 15 informasi artikel dan sekitar 4 informasi kategori)
8. Jika Anda ingin menggunakan akun administrator untuk masuk ke website, jangan logout dari akun administrator. Buka tab baru di browser Anda
Masukkan localhost:3000 pada bilah alamat untuk masuk ke halaman tampilan artikel depan
9. Jika administrator mengaktifkan fungsi komentar, maka fungsi komentar akan ditampilkan di halaman detail artikel depan. Jika administrator menonaktifkan fungsi komentar, maka fungsi komentar akan ditampilkan di halaman detail artikel depan.
Halaman tidak menampilkan fungsi komentar
10. Jika administrator mengaktifkan fungsi peninjauan komentar, komentar pengguna tidak akan langsung ditampilkan di halaman, dan administrator harus berada di latar belakang
Komentar ditinjau di halaman manajemen dan akan ditampilkan di halaman artikel hanya setelah disetujui. Jika administrator mematikan fungsi komentar,
Ini akan ditampilkan di halaman detail artikel.
11. Jika proyek masih belum bisa berjalan, silahkan menghubungi saya di 1565066165
6.Alamat proyek
Halaman beranda: http://luoxu.ltd:3000/ (sementara diubah menjadi http://luoxucoder.icu selama pendaftaran nama domain)
Halaman masuk: http://luoxu.ltd:3000/admin/login.html (Demikian pula)
Tampilan efek proyek
1. Halaman tampilan artikel front-end
![indeks](https://images.downcodes.com/uploads/20250111/img_6781f62236cf633.png)
2. Halaman klasifikasi artikel front-end
![kategori](https://images.downcodes.com/uploads/20250111/img_6781f622393cc34.png)
3. Halaman detail artikel front-end
![pos](https://images.downcodes.com/uploads/20250111/img_6781f6223a21d35.png)
4. Halaman masuk
![login](https://images.downcodes.com/uploads/20250111/img_6781f6223acef36.png)
5. Halaman pendaftaran
![daftar](https://images.downcodes.com/uploads/20250111/img_6781f6223b25937.png)
6.Halaman manajemen backend
![admin](https://images.downcodes.com/uploads/20250111/img_6781f6223b97238.png)
Fungsi proyek
1. Fungsi pengguna
1.1 Masuk
- Tambahkan acara klik untuk tombol login
- Dapatkan nama pengguna dan kata sandi yang dimasukkan oleh pengguna di kotak teks
- Verifikasi apakah pengguna telah memasukkan nama pengguna dan kata sandi. Jika belum, cegah eksekusi program ke bawah dan minta pengguna memasukkan nama pengguna dan kata sandi.
- Panggil antarmuka yang mengimplementasikan fungsi login. Jika login berhasil, maka akan melompat ke halaman beranda pengelolaan data. Jika login gagal, maka akan ditanyakan bahwa nama pengguna atau kata sandi salah.
1.2 Intersepsi masuk
- Gunakan tag skrip untuk memuat alamat antarmuka yang disediakan oleh server
- Tentukan nilai variabel isLogin. Jika nilainya salah, lompat ke halaman login.
1.3 Tambahkan pengguna
- Tambahkan atribut nama ke setiap item formulir yang menambahkan fungsi pengguna, dan nilai atribut nama harus konsisten dengan nama parameter yang diperlukan dalam dokumen antarmuka.
- Ikat acara kirim ke formulir dan cegah formulir dikirimkan secara default di fungsi pengendali acara.
- Dapatkan konten yang dimasukkan oleh pengguna dalam formulir di fungsi event handler
- Panggil antarmuka tambah pengguna dan kirim konten yang diperoleh ke server melalui antarmuka. Jika operasi berhasil, halaman akan di-refresh, prompt pengguna akan diberikan.
1.4 Menampilkan daftar pengguna
- Kirim permintaan Ajax ke server untuk meminta data daftar pengguna
- Langkah kedua adalah menggunakan mesin template untuk menggabungkan data dan template html.
- Langkah ketiga adalah menampilkan konten yang disambung pada halaman
1.5 Unggahan avatar pengguna
- Tambahkan acara onchange ke kontrol pemilihan file dan dapatkan file yang dipilih oleh pengguna dalam fungsi penanganan acara.
- Buat objek formData untuk mengunggah file gambar
- Panggil antarmuka pengunggahan file gambar untuk mengimplementasikan pengunggahan gambar
- Tambahkan bidang tersembunyi baru di formulir tambahkan pengguna baru dan simpan alamat gambar di bidang tersembunyi
1.6 Tampilan daftar pengguna
- Kirim permintaan Ajax ke server saat halaman dimuat untuk meminta data daftar pengguna
- Gunakan mesin templat untuk menggabungkan data dan templat html
- Tampilkan konten yang disambung pada halaman
1.7 Modifikasi informasi pengguna
- Tambahkan acara untuk klik tombol edit melalui delegasi acara
- Dapatkan nilai ID pengguna yang diklik saat ini di fungsi penanganan acara
- Dapatkan informasi detail pengguna berdasarkan id pengguna, dan render informasi detail pengguna ke dalam formulir di sebelah kiri melalui mesin templat
- Tambahkan acara klik untuk tombol modifikasi, dapatkan konten yang dimasukkan oleh pengguna dalam formulir di fungsi pemrosesan acara, dan panggil antarmuka ubah informasi pengguna untuk mengimplementasikan fungsi modifikasi informasi pengguna.
1.8 Hapus pengguna
- Tambahkan acara klik untuk tombol hapus
- Konfirmasikan apakah pengguna ingin menghapus operasi
- Dapatkan ID pengguna yang saat ini diklik
- Panggil antarmuka pengguna hapus untuk menghapus pengguna berdasarkan ID. Jika penghapusan berhasil, segarkan halaman saat ini sehingga halaman tersebut menampilkan konten terbaru.
1.9 Hapus pengguna secara berkelompok
- Kelola status kotak centang yang dicentang
- Jika tombol Pilih Semua dipilih, semua pengguna akan dipilih; jika tombol Pilih Semua tidak dipilih, semua pengguna akan dibatalkan.
- Ketika keadaan tombol kotak centang di depan pengguna diubah, periksa apakah ada pengguna yang berada dalam keadaan tidak dipilih. Jika demikian, batalkan keadaan yang dipilih dari tombol pilih semua. Jika tidak, berarti semua pengguna berada dalam a keadaan yang dipilih. Saat ini, tombol Pilih semua diatur ke keadaan yang dipilih
- Kelola status tombol hapus massal
- Bila tombol Pilih Semua dipilih, tombol Hapus Batch ditampilkan. Bila tombol Pilih Semua tidak dipilih, tombol Hapus Batch akan disembunyikan.
- Ketika status tombol kotak centang di depan pengguna berubah, periksa status yang dipilih dari semua pengguna. Jika ada pengguna yang dipilih, tampilkan tombol hapus batch. Jika semua pengguna tidak dipilih, sembunyikan tombol hapus batch.
- Menerapkan penghapusan batch fungsi pengguna
- Tambahkan acara klik ke tombol hapus batch. Dalam fungsi pemrosesan acara klik, simpan semua ID pengguna yang dipilih dalam array.
- Panggil antarmuka pengguna hapus untuk mengimplementasikan fungsi hapus pengguna
1.10 Ubah kata sandi
- Tambahkan atribut nama ke setiap item formulir di formulir perubahan kata sandi. Nilai atribut nama harus konsisten dengan nama parameter di antarmuka.
- Tambahkan acara pengiriman formulir ke formulir perubahan kata sandi, dan dalam fungsi pengendali acara, cegah perilaku pengiriman default formulir
- Dapatkan konten yang dimasukkan oleh pengguna dalam formulir
- Panggil antarmuka modifikasi kata sandi untuk mengimplementasikan fungsi modifikasi kata sandi. Jika kata sandi berhasil diubah, lompat ke halaman login dan izinkan pengguna untuk login lagi.
1.11 Menampilkan informasi pengguna yang login
- Berdasarkan nilai variabel userId, dapatkan informasi pengguna yang sedang login dari server.
- Tampilkan informasi pengguna di sisi kiri halaman
2. Fungsi klasifikasi
2.1 Tambahkan kategori
- Tambahkan atribut nama ke setiap item formulir di formulir. Nilai atribut nama harus konsisten dengan nama parameter yang diperlukan dalam dokumen antarmuka.
- Tambahkan acara pengiriman formulir ke formulir, dan dalam fungsi pengendali acara, cegah perilaku default pengiriman formulir
- Dapatkan konten yang dimasukkan oleh pengguna dalam formulir
- Panggil antarmuka penambahan kategori untuk mengimplementasikan fungsi penambahan kategori
2.2 Tampilan data rahasia
- Kirim permintaan Ajax ke server untuk meminta data halaman kategori
- Gunakan mesin templat untuk menggabungkan data yang dikembalikan oleh server dengan templat HTML
- Tampilkan konten yang disambung pada halaman
2.3 Modifikasi data rahasia
- Tambahkan peristiwa klik ke tombol edit melalui delegasi peristiwa, dan dapatkan ID data klasifikasi untuk dimodifikasi dalam fungsi pemrosesan peristiwa.
- Panggil antarmuka sesuai dengan id untuk mendapatkan informasi rinci tentang data rahasia
- Gunakan mesin templat untuk menyambung data rahasia dan karakter HTML. Setelah penyambungan selesai, konten akan dirender ke dalam halaman.
- Tambahkan acara klik ke tombol ubah, dan dapatkan konten yang dimasukkan oleh administrator dalam formulir di fungsi pengendali acara
- Panggil antarmuka data klasifikasi modifikasi untuk mengimplementasikan fungsi modifikasi data klasifikasi.
2.4 Penghapusan data rahasia
- Tambahkan peristiwa klik ke tombol hapus melalui delegasi peristiwa, dan kotak konfirmasi penghapusan muncul di pengendali peristiwa klik.
- Setelah pengguna mengklik untuk mengonfirmasi penghapusan, dapatkan ID dari data rahasia yang akan dihapus.
- Panggil antarmuka penghapusan data kategori untuk mengimplementasikan fungsi menghapus data kategori. Jika kategori berhasil dihapus, segarkan halaman.
3. Fungsi artikel
3.1 Tambahkan artikel
- Dapatkan data klasifikasi artikel dan tampilkan data dalam daftar drop-down kategori untuk dipilih administrator
- Unggah gambar sampul artikel dan simpan alamat gambar yang diunggah di kolom tersembunyi
- Tambahkan atribut nama ke setiap item formulir di formulir tambahkan artikel, dan nilai atribut nama harus konsisten dengan nama parameter yang diperlukan di antarmuka
- Ikat acara pengiriman formulir ke formulir tambahkan artikel, dan cegah formulir dikirimkan secara default di fungsi pengendali acara.
- Dapatkan konten yang dimasukkan oleh administrator dalam formulir
- Kirim permintaan untuk menambahkan artikel ke server untuk mengimplementasikan fungsi penambahan artikel. Setelah artikel berhasil ditambahkan, artikel akan melompat ke halaman daftar artikel.
3.2 Tampilan data daftar artikel
- Saat halaman muncul, kirim permintaan ke server untuk data daftar artikel.
- Gunakan mesin template untuk menggabungkan data daftar artikel dan HTML. Setelah penyambungan selesai, konten akan ditampilkan pada halaman.
- Menerapkan fungsi paging data daftar berdasarkan data paging
3.3 Penyaringan daftar data artikel
- Kirim permintaan ke server untuk meminta data klasifikasi artikel dan menampilkan data dalam daftar drop-down kategori yang dimilikinya.
- Tambahkan peristiwa klik ke tombol filter dan dapatkan konten yang dipilih oleh pengguna dalam fungsi pengendali peristiwa
- Mengirimkan permintaan ke server untuk meminta data daftar artikel yang diminta oleh administrator dan menampilkan data tersebut pada halaman
3.4 Penyuntingan artikel
- Tambahkan tautan ke tombol edit dan teruskan id artikel sebagai parameter kueri tautan ke halaman edit artikel
- Dapatkan parameter id di bilah alamat pada halaman pengeditan artikel
- Dapatkan detail artikel berdasarkan id dan tampilkan informasi artikel di formulir pengeditan artikel
- Ikat acara pengiriman formulir untuk mengubah formulir artikel, dan mencegah formulir dikirimkan secara default di fungsi pengendali acara.
- Dapatkan konten yang dimasukkan oleh pengguna dalam formulir
- Kirim permintaan ke server untuk mengimplementasikan fungsi modifikasi informasi artikel. Jika informasi artikel berhasil diubah, lompat ke halaman daftar artikel.
3.5 Penghapusan artikel
- Tambahkan acara klik ke tombol hapus melalui delegasi acara, munculkan kotak konfirmasi penghapusan di fungsi pemrosesan acara, dan konfirmasikan operasi penghapusan dengan administrator
- Dapatkan id artikel yang akan dihapus di fungsi event handler
- Kirim permintaan Ajax untuk melakukan operasi penghapusan. Operasi penghapusan berhasil dan halaman di-refresh.
3.6 Rekomendasi artikel populer
Kirim permintaan ke server untuk data rekomendasi populer
Gunakan mesin templat untuk menggabungkan data dan templat html, serta menampilkan konten yang disambung pada halaman
var str = '<div>{{name}}</div>' ;
var obj = { name : '张三' }
var html = template . render ( str , obj ) ;
3.7 Pencarian artikel
- Ikat acara pengiriman formulir ke formulir pencarian
- Cegah perilaku pengiriman formulir default di event handler dan dapatkan kata kunci pencarian yang dimasukkan oleh pengguna
- Lompat ke halaman hasil pencarian dan teruskan kata kunci pencarian yang dimasukkan oleh pengguna ke halaman hasil pencarian
- Di halaman hasil pencarian, kata kunci yang dimasukkan pengguna diperoleh dari parameter kueri di bilah alamat.
- Antarmuka pencarian dipanggil sesuai dengan kata kunci pencarian yang dimasukkan oleh pengguna. Ketika server mengembalikan data, data hasil pencarian dan template HTML disambung, dan konten yang disambung akhirnya ditampilkan pada halaman.
4. Fungsi komentar
4.1 Tampilan daftar komentar
- Kirim permintaan ke server untuk mendapatkan data daftar komentar
- Gunakan mesin templat untuk menggabungkan data daftar komentar dan templat HTML, lalu menampilkan konten di halaman setelah penyambungan selesai.
- Menerapkan fungsi paging berdasarkan data paging
4.2 Moderasi komentar
- Ubah teks di tombol moderasi berdasarkan status komentar saat ini. Jika komentar saat ini tidak ditinjau, tombol akan menampilkan Persetujuan; jika komentar saat ini ditinjau, tombol akan menampilkan Singkirkan.
- Tambahkan acara klik ke tombol tinjauan melalui delegasi acara, dan dapatkan status komentar saat ini di fungsi penanganan acara
- Kirim permintaan ke server dan beri tahu server status komentar mana yang harus diubah. Jika modifikasi berhasil, segarkan halaman agar data terbaru ditampilkan di halaman.
4.3 Penghapusan komentar
- Tambahkan acara klik ke tombol hapus melalui delegasi acara, dan munculkan kotak konfirmasi penghapusan di fungsi penanganan acara
- Dapatkan nilai id dari komentar yang ingin dihapus oleh administrator
- Kirim permintaan ke server untuk menghapus komentar. Jika komentar berhasil dihapus, segarkan halaman.
5. Fungsi bagan korsel
5.1 Tambahkan data carousel gambar
- Terapkan fungsi unggah gambar dan simpan alamat gambar yang diunggah di bidang tersembunyi
- Tambahkan atribut nama ke setiap item formulir di formulir carousel gambar. Nilai atribut nama harus konsisten dengan nama parameter yang diperlukan di antarmuka.
- Ikat acara pengiriman formulir ke formulir carousel gambar, dan cegah formulir dikirimkan secara default di fungsi pengendali acara.
- Dapatkan konten yang dimasukkan oleh administrator dalam formulir
- Kirim permintaan ke server untuk mengimplementasikan fungsi penambahan data carousel gambar. Jika data berhasil ditambahkan, segarkan halaman.
5.2 Tampilan data bagan korsel
- Kirim permintaan ke server untuk data daftar carousel gambar
- Gunakan mesin templat untuk menggabungkan data daftar carousel gambar dan templat HTML. Setelah penyambungan selesai, konten akan ditampilkan di halaman.
5.3 Penghapusan data carousel gambar
- Tambahkan acara klik ke tombol hapus melalui delegasi acara
- Munculkan kotak konfirmasi penghapusan di fungsi event handler
- Dapatkan ID data gambar carousel yang akan dihapus
- Kirim permintaan ke server untuk melakukan operasi penghapusan. Operasi penghapusan berhasil dan halaman di-refresh.
5.4 Tampilan data bagan carousel (diperbarui)
- Kirim permintaan ke server untuk data carousel
- Gunakan mesin templat untuk menyambung data dan string HTML, dan menampilkan konten yang disambung pada halaman
- Pindahkan kode JavaScript asli yang mengimplementasikan efek carousel ke akhir fungsi sukses metode ajax
6. Fungsi pengaturan situs web
6.1 Pengaturan situs web
- Terapkan pengunggahan gambar logo situs web dan simpan alamat gambar yang diunggah di domain tersembunyi
- Tambahkan atribut nama ke setiap item formulir di formulir. Nilai atribut nama harus konsisten dengan nama parameter yang diperlukan dalam dokumen antarmuka.
- Ikat acara kirim ke formulir dan cegah formulir dikirimkan secara default di fungsi pengendali acara.
- Dapatkan konten yang dimasukkan oleh administrator dalam formulir
- Kirim permintaan ke server untuk mengimplementasikan fungsi penambahan data pengaturan situs web
6.2 Menampilkan data pengaturan situs web
- Kirim permintaan ke server untuk mendapatkan data pengaturan situs web
- Tentukan apakah data yang dikembalikan oleh server benar. Jika benar, tampilkan data di formulir.
7. Fungsi pembaruan situs web terkini
7.1 Halaman ini menampilkan informasi komentar artikel
1. Cari komentar artikel sesuai ID artikel
2. Komentar yang disetujui akan langsung ditampilkan di halaman
3. Komentar terbaru telah dioptimalkan
4. Komentar yang tidak disetujui pada halaman manajemen akan ditandai dengan warna merah
7.2 Pengoptimalan halaman
1. Semua tombol sejenis mengimplementasikan fungsi sejenis
2. Tautan komentar mengimplementasikan fungsi melompat ke artikel komentar
3. Semua tombol klasifikasi menerapkan fungsi melompat ke halaman klasifikasi
7.3 Halaman pendaftaran
1. Menambahkan tombol registrasi pengguna ke halaman login
2.js pada halaman pendaftaran menerapkan verifikasi dasar informasi pendaftaran front-end
3. Fungsi halaman dikembangkan menggunakan bootstrap
4. Seluruh pengguna yang terdaftar pada halaman pendaftaran adalah pengguna biasa
5. Menerapkan fungsi mencari pengguna berdasarkan alamat email mereka
Untuk informasi rinci, silakan merujuk ke dokumentasi antarmuka.