Farcaster adalah protokol untuk membangun jaringan sosial yang cukup terdesentralisasi.
Farcaster baru-baru ini memperkenalkan konsep "frame" yang memungkinkan Anda mengubah postingan atau "cast" apa pun menjadi aplikasi interaktif.
Tutorial ini menguraikan cara membuat dan menghosting kerangka Farcaster sepenuhnya secara on-chain, yang juga merupakan contoh cara membuat server terdesentralisasi.
Dengan menghosting kerangka kerja Anda secara on-chain, Anda membuka kunci kasus penggunaan berikut:
Kerangka kerja ini dapat dikelola oleh organisasi otonom terdesentralisasi (DAO);
Pembuat kerangka mendapatkan kepemilikan penuh dan tidak dibatasi oleh server terpusat.
tutorial
Tutorial ini menggunakan kerangka ExpressJS untuk membuat REST API dan menyebarkannya melalui Internet Computer Protocol (ICP).
Langkah 1: Unduh DFX
dfx adalah antarmuka baris perintah untuk IC SDK, yang dibuat oleh DFINITY untuk mengelola kontrak pintar kontainer ICP.
Jalankan perintah berikut untuk mengunduh DFX:
Langkah 2: Unduh Azle
Azle adalah perpustakaan untuk membuat kontrak pintar kontainer ICP menggunakan TypeScript dan Javascript.
Lebih khusus lagi, ini adalah adaptor yang digunakan oleh Container Development Kit (CDK) atau IC SDK untuk menyediakan TypeScript dan Javascript dengan semua fungsi yang diperlukan untuk membuat dan mengelola kontrak pintar container.
Jalankan perintah berikut untuk mengunduh Azle:
Harap dicatat bahwa tergantung pada perangkat Anda, Anda mungkin perlu mengunduh dependensi tambahan, lihat sumber daya berikut untuk semua persyaratan dependensi:
demergent-labs.github.io/azle/get_started.html
Misalnya jika menggunakan Mac, jalankan perintah berikut:
Langkah 3: Buat proyek Azle baru
Jalankan perintah berikut untuk membuat proyek baru menggunakan Azle:
Langkah 4: Buat bingkai
Bingkai dibuat menggunakan tag OpenGraph khusus Farcaster yang dirujuk dalam dokumen ini.
Berikut ini contoh bingkai yang berisi gambar, empat tombol, dan tautan URL:
Simpan dalam file teks untuk digunakan nanti dalam tutorial ini.
Langkah 5: Siapkan server Ekspres di src/index.ts
Azle menyediakan metode Server yang memungkinkan Anda meneruskan fungsi panggilan balik yang harus mengembalikan instans node httpServer.
Mengembalikan contoh node httpServer menggunakan ExpressJS. Ini adalah contoh httpServer yang dibangun dengan ExpressJS.
Jika kedua hasil tersebut digabung maka hasilnya adalah sebagai berikut:
Langkah 6: Kembalikan kerangka Farcaster untuk panggilan REST API
Mengembalikan frame Farcaster untuk panggilan REST API, frame dari langkah 4 memiliki gambar, empat tombol, dan URL.
Contoh ini meneruskan tautan gambar, teks tombol, dan konten tautan URL, meneruskan bingkai, dan mengirimkan seluruh bingkai yang dibuat sebagai respons API:
Langkah 7: Perbarui src/index.ts dengan kode lengkap dari langkah 5 dan 6
Perbarui src/index.ts dengan kode berikut:
Langkah 8: Terapkan aplikasi
lokal
Terapkan secara lokal untuk menguji aplikasi, jalankan perintah berikut untuk menerapkan secara lokal:
Setelah menjalankan perintah ini, pesan sukses seperti ini akan muncul di shell.
Perhatikan bahwa ID kontainer dan ID yang disediakan di tautan antarmuka Candid kontainer backend selama penerapan akan berbeda dari contoh yang ditampilkan di sini.
Jika repositori sampel telah di-fork, hapus canister_ids.json sebelum menerapkan.
Tautan antarmuka Candid kontainer backend yang terdaftar adalah UI untuk menguji fungsionalitas backend dan disediakan dalam format berikut:
Titik akhir API adalah turunan dari format ini dan harus mengikuti struktur berikut:
Jadi, jika penerapan menyediakan tautan antarmuka Candid container backend, misalnya:
Akses API Anda melalui titik akhir dasar ini:
Jaringan utama (produksi)
Terapkan di mainnet atau produksi untuk mendapatkan aplikasi yang berfungsi. Untuk menerapkan Siklus atau Gas di mainnet, lihat panduan ini atau gunakan jennifertran di Farcaster.
Jalankan perintah berikut untuk menyebarkan aplikasi ke Internet Computer Mainnet.
Setelah menjalankan perintah ini, pesan sukses seperti berikut ini akan muncul di shell:
Perhatikan bahwa ID kontainer dan ID yang disediakan di tautan antarmuka Candid kontainer backend selama penerapan akan berbeda dari contoh yang ditampilkan di sini.
Jika repositori sampel telah di-fork, hapus canister_ids.json sebelum menerapkan.
Tautan antarmuka Candid kontainer backend yang terdaftar adalah UI untuk menguji fungsionalitas backend dan disediakan dalam format berikut:
Titik akhir API adalah turunan dari format ini dan harus mengikuti struktur berikut:
Jadi, jika penerapan menyediakan tautan antarmuka Candid kontainer backend, misalnya:
Akses API Anda melalui titik akhir dasar ini:
Langkah 9: Pratinjau kerangka Farcaster menggunakan validator kerangka kerja
Anda dapat melihat pratinjau Farcaster Frame menggunakan alat Frame Validatornya.
Harap dicatat bahwa hanya titik akhir produksi mainnet yang didukung, titik akhir lokal tidak dapat digunakan.
Masukkan endpoint yang Anda terima pada langkah 8 dan klik Load, misalnya jika endpoint Anda adalah https://swua7-kqaaa-aaaao-a3fna-cai.raw.icp0.io/ pratinjaunya akan terlihat seperti ini :
sumber
Kode contoh lengkap:
github.com/Gekctek/farcaster-frame-azle
Contoh cara membangun server ExpressJS on-chain menggunakan Azle:
github.com/demergent-labs/azle/tree/main/examples/express
Buat kontrak pintar kontainer di ICP dengan Azle menggunakan TypeScript:
demergent-labs.github.io/azle/the_azle_book.html
Terima kasih yang sebesar-besarnya kepada Gekctek atas kontribusinya pada contoh ini dan Jordan Last atas kontribusinya pada Azle.
Konten IC yang Anda minati
Kemajuan Teknologi |. Informasi Proyek |
Kumpulkan dan ikuti IC Binance Channel
Ikuti terus informasi terkini
