Cara Membangun Backend dengan VS Code?

vs code memungkinkan anda untuk mengintegrasikan alat eksternal yang memiliki server mcp aktif ke dalamnya melalui protokol mcp ini memungkinkan anda untuk menjalankan tugas dan membaca data dari sumber sumber tersebut tanpa meninggalkan ide anda menggunakan prompt dalam tutorial ini, anda akan belajar bagaimana membangun backend dan antarmuka pengguna (ui) untuk platform blog menggunakan server mcp back4app melalui vs code dan menyebarkannya di kontainer back4app poin penting pelajari cara membangun backend di back4app menggunakan vs code dan server mcp jelajahi bagaimana hubungan dimodelkan antara kelas di back4app jelajahi bagaimana otentikasi dan otorisasi berbasis peran diimplementasikan oleh back4app menggunakan kelas bawaan mereka sebarkan aplikasi anda dalam beberapa klik menggunakan kontainer back4app anda dapat melihat blog langsung yang dibangun dalam tutorial ini menggunakan tautan ini prasyarat untuk mengikuti tutorial ini, anda perlu memiliki hal hal berikut akun back4app anda dapat mendaftar secara gratis jika anda belum memilikinya vs code terinstal di sistem anda pemahaman dasar tentang konsep pengembangan backend ikhtisar proyek sebuah blog dalam tutorial ini, anda akan membangun blog sederhana yang memungkinkan anda untuk membuat, mengedit, melihat, dan menghapus posting blog ini juga mendukung komentar dan melacak jumlah orang yang telah melihat posting blog anda selain tabel user yang disediakan secara default di back4app untuk otentikasi, blog anda akan memiliki tiga tabel tambahan posts, comments, dan views ketika seorang pengguna di blog anda membuat akun, back4app membuat catatan baru di tabel user dan mengeluarkan token sesi yang aman yang dapat anda gunakan kembali pada permintaan berikutnya hanya pengguna yang terautentikasi yang dapat menerbitkan posting ketika sebuah posting blog diterbitkan, baik pengguna yang terautentikasi maupun yang tidak terautentikasi dapat membaca posting tersebut; namun, hanya pengguna yang terautentikasi yang dapat mengomentari setiap kali sebuah posting blog diambil dari database back4app, jumlah tampilan akan bertambah; untuk mencegah kemungkinan penyalahgunaan fitur ini untuk meningkatkan tampilan, anda akan menerapkan beberapa pengaman di sekitarnya sekarang anda memiliki gambaran kasar tentang apa yang akan anda bangun, di bagian berikutnya, anda akan menghubungkan vscode ke server mcp back4app menghubungkan vscode ke server mcp back4app navigasikan ke situs web back4app dan klik tombol new app di bagian kiri atas halaman di layar “bangun backend”, beri nama aplikasi anda dan klik tombol create di halaman ringkasan aplikasi anda, klik tombol mcp setup di modal “pilih ide anda”, klik vs code dan ikuti instruksi yang ditampilkan di layar untuk menghubungkan vscode ke server mcp back4app secara otomatis jika anda mengikuti opsi instalasi otomatis, anda harus memulai ulang vs code di mesin anda sebelum melanjutkan sebagai alternatif, anda dapat menghubungkan server mcp back4app secara manual (yang memberi anda lebih banyak kontrol atas konfigurasi) dengan beralih modal ke bagian manual setelah mengikuti langkah langkah yang dijelaskan di modal untuk menghubungkan server mcp back4app ke vscode, anda dapat mengonfirmasi koneksi dengan mengklik bilah pencarian di jendela vscode anda dan mencari “>mcp list servers”, jalankan perintah tersebut, dan anda seharusnya melihat daftar server mcp yang tersedia dan statusnya saat ini (berjalan/stop) sekarang setelah anda menghubungkan server back4app mcp ke vscode, di bagian berikutnya, anda akan menulis prompt yang akan membangun seluruh aplikasi anda membangun backend blog anda untuk membuat backend anda menggunakan vscode dan github copilot, pertama tama, anda perlu mengaktifkan mode agen di github copilot untuk mengaktifkan mode agen, buka obrolan github copilot dengan menekan “ control + command + i” di macos, untuk windows, tekan “ctrl + i” di halaman obrolan, klik dropdown dengan label “tanya” dan pilih mode “agen” selanjutnya, berikan github copilot prompt di bawah ini atau yang serupa untuk membuat kelas yang diperlukan untuk aplikasi anda prompt di atas membuat backend back4app baru bernama “blogger” dan mengisinya dengan kelas post, comment, dan view beserta properti yang diperlukan ketika anda mengeksekusi prompt ini dengan copilot, ia akan mencatat langkah langkah yang diikutinya di jendela obrolan anda dan meminta izin anda pada setiap langkah yang memodifikasi data anda untuk hasil terbaik, eksekusi prompt ini dengan model premium seperti 03 mini atau claude sonnet 4 setelah copilot membuat kelas yang diperlukan, anda sekarang memiliki cara terstruktur untuk menyimpan data blog anda di bagian berikutnya, anda akan menerapkan otentikasi untuk aplikasi anda menerapkan otentikasi persyaratan otentikasi untuk aplikasi anda sederhana, anda perlu pengguna untuk mendaftar dan masuk agar dapat membuat posting blog dan mengomentari posting blog namun, mereka dapat membaca posting blog di aplikasi anda tanpa harus terautentikasi anda dapat menerapkan persyaratan otentikasi untuk aplikasi anda menggunakan prompt di bawah ini prompt di atas menambahkan otentikasi pengguna ke aplikasi anda logika otentikasi memungkinkan pengguna anda untuk membuat akun menggunakan email, username, dan password setelah mendaftar, pengguna secara otomatis masuk, dan ketika pengguna keluar, sesi mereka saat ini dibatalkan setelah copilot menerapkan logika otentikasi anda, pengguna anda akan memiliki cara yang aman untuk mendaftar dan masuk di bagian berikutnya, anda akan menerapkan logika yang diperlukan untuk membuat posting dan komentar membuat posting dan komentar untuk menerapkan fitur membuat posting dan komentar, anda harus membuat dua fungsi cloud dan hook pendukung yang memungkinkan pengguna yang terautentikasi menerbitkan posting dan menambahkan komentar dalam satu alur yang terintegrasi mulailah dengan membuat hook pendukung dengan memberi copilot prompt di bawah ini atau yang serupa prompt di atas mengimplementasikan pemeriksaan/tindakan yang dilakukan sebelum sebuah pos atau komentar dibuat untuk pos, slug unik dihasilkan menggunakan judulnya kemudian status diubah menjadi diterbitkan, dan tanggal saat ini diatur sebagai tanggal publikasi untuk komentar, pos yang terhubung hanya memperbarui jumlah komentarnya sekarang, buat fungsi cloud yang terkait dengan hook beforesave di atas menggunakan prompt di bawah ini atau yang serupa prompt di atas mengekspos dua fungsi kode cloud yang memungkinkan pengguna anda untuk membuat pos dan komentar ini juga melindungi aplikasi anda dari penyalahgunaan dengan membatasi hingga 5 pembuatan pos dan 15 komentar per menit logika utama yang terkait dengan pembuatan pos dan komentar telah diimplementasikan dalam hook beforesave yang dibuat dalam prompt sebelumnya; yang ini hanya mengekspos api untuk dikonsumsi frontend setelah copilot mengimplementasikan logika di atas, pengguna anda akan memiliki cara untuk membuat dan mengomentari pos di bagian berikutnya, anda akan mengimplementasikan logika yang diperlukan untuk memperbarui komentar dan pos tersebut, dan juga logika yang diperlukan untuk menghitung tampilan pada setiap pos blog memperbarui pos, komentar, dan tampilan untuk mengimplementasikan fungsionalitas yang memungkinkan pengguna untuk mengedit pos mereka, merevisi komentar mereka sendiri, dan mendaftarkan tampilan halaman, anda memerlukan dua fungsi cloud updatepost, updatecomment, dan aftertrigger anda dapat mengimplementasikan fungsi cloud updatepost menggunakan prompt di bawah ini atau yang serupa prompt di atas membuat fungsi yang memperbarui pos ini memastikan bahwa pembaruan hanya dapat dilakukan oleh pengguna yang membuat pos dan menghasilkan kembali slug jika judul diubah anda dapat mengimplementasikan fungsi cloud updatecomment menggunakan prompt di bawah ini atau yang serupa prompt di atas membuat fungsi yang memperbarui komentar sebuah pos pembaruan hanya dapat dilakukan oleh pencipta komentar anda dapat mengimplementasikan fungsi cloud recordview menggunakan prompt di bawah ini atau yang serupa prompt di atas membuat trigger afterfind pada kelas post setiap kali backend mengembalikan satu pos (diambil berdasarkan objectid nya), trigger secara otomatis membuat catatan view baru yang menunjuk ke pos tersebut (dan pengguna saat ini, jika masuk) dan meningkatkan viewcount pos jika kueri mengembalikan beberapa pos, trigger tidak melakukan apa apa dengan ini, sebagian besar fungsionalitas blog anda sudah lengkap selanjutnya, anda akan mengimplementasikan fungsionalitas yang memungkinkan pengguna anda menghapus pos mereka menghapus pos untuk menghapus pos, seorang pengguna haruslah orang yang membuatnya setelah pos dihapus, semua konten terkaitnya (tampilan, komentar) dihapus bersamanya anda dapat mengimplementasikan fungsionalitas untuk menghapus pos menggunakan prompt di bawah ini atau yang serupa prompt di atas mengimplementasikan logika yang diperlukan untuk menghapus pos dengan tambahan ini, backend anda sekarang mencakup siklus hidup konten penuh, memungkinkan penulis untuk menerbitkan, merevisi, dan menghapus, memungkinkan pembaca untuk berdiskusi, dan menjaga statistik tampilan yang akurat untuk setiap pos di bagian berikutnya, anda akan menghasilkan ui untuk aplikasi anda menghasilkan frontend anda anda dapat memanfaatkan konteks yang dimiliki copilot dari membuat backend anda di back4app untuk memintanya membuat frontend yang sesuai dengan skema dan persyaratan untuk aplikasi anda anda dapat mencapai ini untuk penjadwal janji menggunakan prompt di bawah ini dengan menggunakan prompt di atas atau yang serupa, copilot akan menghasilkan frontend yang sesuai dengan skema backend anda dan menghubungkannya ke backend anda jalankan aplikasi menggunakan instruksi yang diberikan oleh copilot dan lakukan penyesuaian yang anda inginkan sekarang proyek anda sudah lengkap, di bagian berikutnya, anda akan menyebarkannya di kontainer back4app menyebarkan aplikasi anda di kontainer back4app kontainer back4app memungkinkan anda untuk menyebarkan aplikasi anda dengan mudah menggunakan dockerfile dan repositori github untuk menyebarkan aplikasi anda di kontainer back4app, anda perlu terlebih dahulu menyertakan dockerfile di repositori anda anda dapat meminta claude untuk menghasilkan satu menggunakan prompt di bawah ini atau anda bisa menggunakan dockerfile yang disediakan di bawah ini setelah menambahkan dockerfile dan mendorongnya ke github, navigasikan ke dasbor aplikasi back4app anda, klik dasbor dropdown, dan pilih platform penyebaran web opsi di halaman penyebaran, klik tombol “deploy a web app” dan berikan back4app akses ke repositori yang ingin anda sebarkan pilih aplikasi yang ingin anda sebarkan, isi detail penyebaran, dan klik tombol deploy mengklik tombol tersebut memulai proses penyebaran, dan setelah selesai, anda akan mendapatkan url langsung ke aplikasi anda dapat melihat blog langsung yang dibangun dalam tutorial ini menggunakan tautan ini kesimpulan dalam artikel ini, anda membangun platform blogging lengkap menggunakan server back4app mcp dan github copilot, kemudian menyebarkannya dengan back4app containers ini menunjukkan rangkaian lengkap alat back4app yang memungkinkan anda bergerak dari ideasi ke peluncuran dengan overhead minimal sebagai langkah selanjutnya, anda dapat memperluas proyek dengan fitur seperti integrasi media sosial, notifikasi email otomatis untuk komentar baru, fungsionalitas pencarian lanjutan, atau analitik tentang keterlibatan pos dan perilaku pembaca semua peningkatan ini cocok secara alami ke dalam alur kerja back4app yang sama merancang dan mendefinisikan kelas baru atau cloud functions dengan github copilot, mengamankannya dengan hooks beforesave, dan meluncurkan pembaruan melalui back4app containers pendekatan ini memungkinkan anda menambahkan fitur baru ke blog anda tanpa mengganggu pengguna