Belajar Web3 - Pre-Requisites Skill & Setup Environment

#Pendahuluan

Selamat datang di series Belajar Web3! Series ini akan membawa kalian menguasai Web3 — ekosistem internet terdesentralisasi berbasis blockchain — dari konsep web3 & wallet, arsitektur DApp dan smart contract, frontend DApp dengan wagmi + viem, hingga produksi: indexing dengan The Graph, account abstraction EIP-4337, security, dan integrasi AI. Total ada 23 episode yang tersusun dalam lima fase, dari fondasi konsep sampai production readiness.

Sebelum masuk ke kode, ada skill dasar dan perangkat lunak yang wajib kalian siapkan. Mengapa prasyarat ini penting? Karena membangun DApp berbeda dengan membangun aplikasi web biasa: data tidak disimpan di database kalian, user membayar gas untuk setiap transaksi, dan private key — yang hanya boleh dipegang user — menentukan siapa yang bisa mengakses aset. Tanpa fondasi ini, kalian akan kesulitan saat debugging transaksi gagal di episode 11.

Episode 0 ini adalah peta jalan kalian: kita akan memastikan skill dasar terpenuhi, menyiapkan toolchain, dan memverifikasi environment untuk pertama kali. Setelah episode ini selesai, seluruh series bisa diikuti dengan nyaman.

#Skill Dasar yang Wajib Dimiliki

#Dasar Programming JavaScript/TypeScript

Web3 frontend dibangun hampir seluruhnya di atas JavaScript/TypeScript — wagmi, viem, dan ethers.js semuanya pustaka JS. Kalian wajib nyaman dengan variabel, fungsi, promise/async-await, dan pemahaman dasar TypeScript:

const provider = createPublicClient({ chain: mainnet, transport: http() })
const balance = await provider.getBalance({ address })
console.log(balance)

Kode di atas memanggil RPC node secara asinkron — pola yang sama akan kalian temui puluhan kali di series ini. Jika kalian pernah membangun API dengan fetch/axios, sebagian besar pola ini terasa familiar.

#Konsep Web Development

DApp tetap aplikasi web: ada HTTP, API, dan frontend. Yang berbeda hanya lapisan datanya. Kalian wajib paham cara kerja request/response, dan bagaimana browser berinteraksi dengan server — karena nanti kita hanya mengganti "server database" dengan "RPC node". Konsep state management di React (misalnya useState dan useEffect) juga akan dipakai intensif mulai episode 9.

#Konsep Blockchain

Ini fondasi paling penting. Pahami lima konsep berikut sebelum lanjut:

Jangan khawatir jika belum dalam — setiap konsep ini akan dibahas mendalam di episode 3 dan 4.

#Perangkat Software yang Disiapkan

#Node.js 20+

Semua tooling Web3 berbasis Node.js — wagmi, viem, dan Hardhat — membutuhkan Node.js; Foundry terinstall terpisah sebagai binary. Cek versi kalian:

node --version
npm --version

Pastikan mayor 20 atau lebih tinggi. Jika belum, install lewat nvm:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash
nvm install 22
nvm use 22

#MetaMask

MetaMask adalah wallet browser yang menampung private key dan menandatangani transaksi. Install ekstensi di Chrome/Firefox, buat wallet baru, dan simpan seed phrase di tempat aman — jangan pernah membagikannya ke siapa pun. Wallet ini akan dipakai mulai episode 10 untuk connect ke DApp.

#Remix dan Foundry

Remix adalah IDE Solidity di browser (remix.ethereum.org) — tanpa install apa pun, cocok untuk mencoba kontrak cepat. Foundry adalah toolchain contract modern dalam satu binary:

curl -L https://foundry.paradigm.xyz | bash
foundryup
forge --version

foundryup mengunduh forge, cast, dan anvil. Kita pakai anvil — blockchain lokal untuk development — secara intensif mulai episode 8 dan 19.

#RPC Provider (Alchemy/Infura)

Untuk membaca/menulis state di mainnet/testnet, DApp butuh RPC node. Daftar gratis di Alchemy atau Infura, buat aplikasi untuk jaringan Sepolia (testnet), dan simpan API key:

cp .env.example .env.local

Kalian tidak perlu menjalankan node sendiri untuk series ini — penyedia RPC sudah menangani itu. Detail RPC dan fallback akan kita bahas di episode 15.

#Editor dan Browser

Gunakan VS Code (atau editor apa pun) plus ekstensi Solidity untuk syntax highlighting, dan browser modern (Chrome/Firefox) dengan MetaMask terpasang. Untuk memeriksa transaksi di chain, siapkan juga tab Etherscan (atau Basescan) di bookmark — dipakai mulai episode 8.

#Verifikasi Environment

Sebelum lanjut ke episode 1, jalankan verifikasi menyeluruh:

node --version
npm --version
forge --version
cast --version
anvil --version

Semua harus mencetak versi tanpa error. Terakhir, pastikan MetaMask sudah terpasang di browser dan seed phrase tersimpan aman — bukan di file proyek.

#Ringkasan Prasyarat

Rangkuman yang sudah kalian siapkan di episode 0:

• Skill: dasar JavaScript/TypeScript, web development, dan konsep blockchain (block, transaksi, gas, wallet, alamat).
• Toolchain: Node.js 20+, Foundry (forge/cast/anvil), dan npm tervalidasi.
• Wallet: MetaMask terpasang, seed phrase tersimpan aman.
• Infra: akun RPC provider (Alchemy/Infura) dengan endpoint testnet Sepolia, plus .env.local siap diisi.

Jika ada yang belum terpenuhi, berhenti dulu dan lengkapi sebelum melanjutkan. Perjalanan 22 episode ke depan akan jauh lebih lancar dengan pijakan yang kuat ini.

#Penutup

Inti yang harus dibawa pulang:

• Web3 butuh dua fondasi: programming JS/TS dan konsep blockchain (wallet, gas, transaksi).
• Siapkan Node.js 20+, Foundry, MetaMask, dan RPC provider untuk praktik sepanjang series.
• Selalu uji di testnet, bukan mainnet, sampai produksi — ini membedakan developer amatir dari profesional.
• Verifikasi seluruh tool dengan perintah versi sebelum lanjut.

Di episode 1 selanjutnya kita akan membahas sejarah, latar belakang, dan mengapa kalian membutuhkan Web3 — dari Web1 yang statis, Web2 yang tersentralisasi, hingga konsep Web3 yang dipopulerkan Gavin Wood pada 2014, plus empat alasan inti: ownership, transparansi, trustless, dan interoperability. Pastikan environment kalian sudah siap, karena perjalanan Belajar Web3 baru saja dimulai!