Building Couse Assist Bagian 5: Membangun kembali fungsi obrolan dari awal (2/2).
Ini merupakan lanjutan dari blog sebelumnya yang bila belum dibaca silahkan disimak. Di blog sebelumnya, saya memulai proses pembuatan fungsi chat dari awal, sebuah proses yang agak panjang dan rumit🙄 itulah sebabnya saya memutuskan untuk membagi blog ini menjadi dua bagian, ini adalah bagian kedua dan terakhir. Bagian pertama difokuskan pada pembuatan UI bersih yang bagus yang terinspirasi oleh obrolan LinkedIn, pembuatan objek percakapan untuk menampilkan daftar obrolan dan yang paling penting menyiapkan fungsionalitas pengiriman pesan yang berarti pesan, meskipun hanya dalam bentuk teks bisa dikirim antar pengguna. Meskipun ini membuat saya hampir menyelesaikannya, masih banyak yang harus dilakukan yang menjadi fokus bagian kedua ini.
Tugas yang tersisa dan telah ditambahkan termasuk mengaktifkan fungsionalitas pengiriman pesan waktu nyata, menambahkan pemberitahuan sehingga pengguna diberitahu ketika mereka mendapat pesan baru, memungkinkan transfer file antar pengguna dan hanya beberapa fitur kecil untuk meningkatkan pengguna secara umum. pengalaman. Perlu dicatat bahwa karena proyek bantuan kursus terdiri dari dua aplikasi (aplikasi pengguna dan aplikasi ahli), saya harus mengimplementasikan fitur-fitur ini dua kali, itulah sebabnya dibutuhkan waktu lebih lama dari yang saya perkirakan.
Fitur yang saya mulai adalah memungkinkan transfer file antar pengguna. Seperti yang saya sebutkan sebelumnya, hanya mungkin untuk mengirim pesan dalam bentuk teks di obrolan dan bukan file seperti gambar, pdf, dokumen..dll untuk ini saya menggunakan paket pemilihan file React Native Expo pihak ke-3 yang disebut expo-document-picker untuk menangani memperoleh berkas dari telepon dan di backend, Django memungkinkan penyimpanan berkas dan transfer berkas dengan mudah melalui API kerangka istirahat Django. Masalah yang saya kerjakan adalah pengunduhan dan pembukaan file. Karena saya menggunakan reaksi asli dengan expo, saya tidak dapat menemukan paket yang memungkinkan pengunduhan file yang diterima. Saya kemudian menemukan sebuah paket bernama expo-linking dan yang dilakukannya adalah membuka tautan ke file yang dikirim di browser dan ketika ini terjadi, browser secara otomatis mengunduh file tersebut. Bukan metode pengunduhan yang saya pikirkan tetapi berhasil, jadi saya akan tetap menggunakannya untuk saat ini. Selain itu, metode ini berfungsi pada Android yang merupakan OS tempat saya menguji aplikasinya, tetapi saya tidak yakin apakah ini akan berlaku pada iOS. Saya harus menunggu dan melihat.
Berikutnya adalah notifikasi, ketika pesan dikirim, pengguna perlu diberi tahu saat mereka menerimanya. Untuk ini, saya menggunakan expo-push-notifications yang merupakan paket pihak ketiga gratis lainnya yang dapat Anda gunakan untuk reaksi asli. Ketika sebuah pesan berhasil diposting, fungsi kirim pemberitahuan yang disertakan dalam expo-push-notifications dipanggil dan mengirimkan pemberitahuan kepada pengguna yang memberi tahu mereka bahwa mereka telah menerima pesan baru.
Fitur terakhir namun terpenting yang saya kerjakan adalah fungsionalitas real-time. Aplikasi chat yang tidak bersifat real-time bukanlah aplikasi chat. Intinya adalah agar pengguna menerima pesan segera setelah dikirim. Untuk ini, saya menggunakan Socket-io yang sudah saya gunakan untuk bagian lain dari proyek ini. Server Nodejs berjalan dan berfungsi sebagai perantara antara kedua aplikasi. Ketika pengguna mengirim pesan, server node melalui soket diberitahu dan kemudian mengirimkan pesan melalui soket ke obrolan pengguna lain yang meminta halaman untuk meminta pesan baru. Seluruh proses ini terjadi hampir seketika. Saya juga menambahkan beberapa fitur yang terutama berkaitan dengan peningkatan antarmuka pengguna dan pengalaman pengguna seperti membersihkan daftar pesan, mengatur obrolan, menambahkan stempel waktu dan tanggal yang bagus, kelancaran proses mendapatkan dan mengirim file, memblokir pengiriman pesan jika pengguna belum menulis pesan apa pun atau memilih file dan hanya beberapa file lain yang terkait dengan hal yang sama. Dan begitu saja saya telah berhasil menambahkan fungsi obrolan ke dalam proyek saya dari awal yang membuat saya selangkah lebih dekat untuk menyelesaikan Course Assist. Selanjutnya, saya akan melakukan pengujian terhadap keseluruhan sistem untuk melihat bug apa yang perlu diperbaiki dan fitur apa yang dapat ditambahkan. Semuanya akan saya dokumentasikan di blog saya berikutnya, jadi pantau terus. Terima kasih telah membaca🙏
