Blog — Erlangga Hidayatullah

Erlang System Care: Aplikasi untuk Merawat PC Windows

Awalnya saya membuat **Erlang System Care** untuk kebutuhan pribadi, terutama mematikan komputer dengan timer. Dari kebutuhan sederhana itu, saya mulai menambahkan fitur lain yang sering saya pakai untuk memantau dan merawat PC. Sekarang, beberapa kebutuhan sehari-hari tersedia dalam satu aplikasi: - **Informasi perangkat** — lihat spesifikasi dan kondisi PC. - **Monitor sistem** — pantau CPU dan RAM, cari aplikasi yang berjalan, lalu hentikan proses jika diperlukan. - **Pembersih** — cek dan bersihkan file sementara, Recycle Bin, serta data browser. - **Penjadwal** — atur waktu shutdown, sleep, atau kunci layar. - **Mode Aktivitas** — simpan pengaturan daya, aplikasi, dan timer untuk kerja, gaming, atau malam. - **Shortcut Windows** — buka Task Manager, Device Manager, Uninstall Programs, dan alat lainnya. Ada juga tema terang dan gelap, bahasa Indonesia dan Inggris, serta system tray. Aplikasi tersedia dalam versi **installer dan portable** untuk Windows 10 ke atas, 64-bit. Saya membagikan aplikasi ini supaya bisa dipakai juga oleh teman-teman yang punya kebutuhan serupa. [**Lihat & Download Erlang System Care →**](https://erlangsystemcare.erlanggaht.com/)

Erlanggaht

ElectronApplication

6 OctoberTechnology

DompetIQ: Catat Keuangan dengan Lebih Mudah

Saya membuat **DompetIQ** untuk membantu mengelola keuangan sehari-hari. Mulai dari mencatat pemasukan dan pengeluaran, mengatur anggaran, sampai memantau target tabungan—semuanya tersedia dalam satu aplikasi. Beberapa fitur yang bisa kamu gunakan: - **Dashboard:** lihat saldo dan transaksi terbaru. - **Catatan keuangan:** catat pemasukan dan pengeluaran, lalu cari berdasarkan tanggal. - **Kelola kartu dan rekening:** pantau saldo dari beberapa rekening. - **Anggaran:** atur batas pengeluaran dan pantau penggunaannya. - **Target tabungan:** tentukan tujuan dan lihat progres menabung. - **Laporan bulanan:** lihat ringkasan keuangan setiap bulan. - **Tools keuangan:** gunakan kalkulator untuk membantu perencanaan. DompetIQ tersedia dalam tampilan **Desktop** dan **Lite** yang lebih sederhana untuk penggunaan di ponsel. Ada juga pilihan tema terang/gelap, bahasa Indonesia/Inggris, serta pengaturan untuk menyembunyikan saldo. Penasaran? Kamu bisa mencoba mode demo sebelum membuat akun. [**Coba DompetIQ**](https://dompetiq.web.id) ## Punya Ide Aplikasi? Jika kamu ingin membuat website atau aplikasi, atau tertarik berkolaborasi, saya terbuka untuk berdiskusi. Kunjungi [layanan saya di Fastwork](https://fastwork.id/user/erlanggaht) atau hubungi saya langsung untuk membicarakan ide dan kebutuhanmu.

Erlanggaht

ApplicationNextjs

8 SeptemberFrontend

# SEO Next.js #3: Monitoring

Setelah sitemap, metadata, dan structured data selesai, website perlu dipantau secara berkala. Tujuannya untuk mengetahui apakah ada halaman yang gagal diindeks, link yang bermasalah, atau performa yang menurun. ## 1. Memantau error di Google Search Console Buka [Google Search Console](https://search.google.com/search-console), lalu pilih properti: ```text erlanggaht.com ``` Menu yang perlu diperiksa: - **Overview** untuk melihat ringkasan website. - **Page indexing** untuk melihat halaman yang berhasil atau gagal diindeks. - **Core Web Vitals** untuk melihat pengalaman pengguna. - **Sitemaps** untuk memastikan sitemap berhasil dibaca Google. Jika menemukan error, klik jenis error tersebut untuk melihat URL yang bermasalah. Setelah memperbaikinya, klik **Validate Fix**. ## 2. Mengecek performa dengan PageSpeed Insights Gunakan [PageSpeed Insights](https://pagespeed.web.dev/) dan periksa halaman utama: ```text https://erlanggaht.com/ https://erlanggaht.com/about https://erlanggaht.com/work https://erlanggaht.com/blog ``` Perhatikan beberapa bagian berikut: - **Performance** — kecepatan halaman. - **Accessibility** — kemudahan akses pengguna. - **Best Practices** — praktik teknis website. - **SEO** — pemeriksaan dasar SEO. Metrik penting: - **LCP** mengukur kecepatan konten utama muncul. - **INP** mengukur kecepatan website merespons interaksi. - **CLS** mengukur kestabilan layout saat halaman dimuat. ## 3. Memeriksa halaman yang belum diindeks Di Google Search Console, buka: ```text Indexing → Pages ``` Periksa bagian: - **Error** - **Not indexed** - **Valid** Untuk mengecek URL tertentu, gunakan kolom **Inspect any URL**. Masukkan URL lengkap, lalu klik **Test live URL**. Jika halaman sudah bisa diakses Google tetapi belum masuk indeks, klik **Request indexing**. Proses ini hanya mengirim permintaan kepada Google dan tidak menjamin halaman langsung muncul di hasil pencarian. ## 4. Membandingkan mobile dan desktop Di PageSpeed Insights, jalankan pemeriksaan menggunakan mode: - Mobile - Desktop Mobile biasanya memiliki skor lebih rendah karena perangkat dan koneksi internet lebih terbatas. Pastikan layout tidak menyebabkan horizontal scroll, teks tetap terbaca, dan gambar tidak terlalu besar. ## Contoh penerapan teknis di Next.js ### Optimasi gambar dengan `next/image` ```tsx import Image from 'next/image'; export default function ProfileImage() { return ( <Image src="/images/pf-about.webp" alt="Erlangga Hidayatullah" width={800} height={800} sizes="(max-width: 768px) 100vw, 50vw" priority /> ); } ``` Gunakan `priority` hanya untuk gambar utama. Gambar lain dapat menggunakan lazy loading: ```tsx <Image src={article.coverImage} alt={article.title} width={1200} height={630} loading="lazy" sizes="(max-width: 768px) 100vw, 800px" className="object-cover" /> ``` ### Loading state Buat file `loading.tsx` di dalam folder halaman. ```tsx export default function Loading() { return ( <main className="mx-auto max-w-7xl animate-pulse px-6 py-16"> <div className="h-10 w-56 bg-neutral-200 dark:bg-neutral-800" /> <div className="mt-8 h-64 bg-neutral-200 dark:bg-neutral-800" /> </main> ); } ``` ### Halaman 404 Buat file `app/not-found.tsx` agar pengguna tidak berhenti di halaman error kosong. ```tsx import Link from 'next/link'; export default function NotFound() { return ( <main className="grid min-h-screen place-items-center text-center"> <div> <h1 className="text-4xl font-bold">Halaman tidak ditemukan</h1> <Link href="/" className="mt-6 inline-block underline"> Kembali ke Home </Link> </div> </main> ); } ``` ### Mengatur crawler dengan `robots.ts` ```ts import type { MetadataRoute } from 'next'; export default function robots(): MetadataRoute.Robots { return { rules: { userAgent: '*', allow: '/', disallow: ['/admin', '/xz933k-panel'], }, sitemap: 'https://erlanggaht.com/sitemap.xml', }; } ``` ### Membuat sitemap dinamis ```ts import type { MetadataRoute } from 'next'; export default async function sitemap(): Promise<MetadataRoute.Sitemap> { const articles = await getAllArticles(); return articles.map((article) => ({ url: `https://erlanggaht.com/blog/${article.slug}`, lastModified: new Date(article.createdAt), changeFrequency: 'monthly', priority: 0.7, })); } ``` Setelah mengubah kode SEO, lakukan deploy terlebih dahulu sebelum mengecek ulang menggunakan Google Search Console atau PageSpeed Insights. ## Jadwal monitoring - Setelah deploy: cek sitemap dan halaman utama. - Seminggu sekali: cek Page indexing dan Core Web Vitals. - Sebulan sekali: cek PageSpeed semua halaman utama. - Setiap membuat artikel: lakukan URL Inspection. ## Kesimpulan Monitoring membantu memastikan SEO website tetap sehat setelah dipublikasikan. Google Search Console digunakan untuk memantau indexing dan error, sedangkan PageSpeed Insights digunakan untuk memeriksa performa dan pengalaman pengguna. Artikel Terkait: [SEO Next.js #1: Crawling dan Indexing](https://erlanggaht.com/blog/seo-nextjs-1-crawling-dan-indexing) [SEO Next.js #2: Optimasi Metadata dan Structured Data](hhttps://erlanggaht.com/blog/seo-nextjs-2-optimasi-metadata-dan-structured-data)

Erlanggaht

Search google consoleNextjsSEO

7 SeptemberFrontend

Next.js + next-intl - Multi Bahasa Metode Cookie Tanpa Reload

Proyek ini menggunakan **Next.js App Router** dan **next-intl** untuk Bahasa Indonesia (`id`) dan Inggris (`en`). Pilihan bahasa disimpan di cookie `NEXT_LOCALE` selama satu tahun. URL tetap sama, tanpa awalan `/id` atau `/en`. Alurnya: **pilih bahasa → simpan cookie → `router.refresh()` → teks diperbarui**. ## 1. File terjemahan Simpan teks di [i18n/id.json](i18n/id.json) dan [i18n/en.json](i18n/en.json) dengan key yang sama. Contoh Bahasa Indonesia: ```json { "NAV": { "home": "Beranda" } } ``` Padanan Inggrisnya: ```json { "NAV": { "home": "Home" } } ``` ## 2. Baca cookie di server [i18n/request.ts](i18n/request.ts) menentukan bahasa dan memuat JSON yang sesuai. Berikut versi ringkasnya: ```ts import { cookies } from 'next/headers'; import { getRequestConfig } from 'next-intl/server'; export default getRequestConfig(async () => { const cookieStore = await cookies(); const locale = cookieStore.get('NEXT_LOCALE')?.value === 'en' ? 'en' : 'id'; return { locale, messages: (await import(`@/i18n/${locale}.json`)).default, }; }); ``` Jika cookie belum ada atau nilainya tidak valid, bahasa kembali ke Indonesia. Hubungkan konfigurasi ini melalui plugin di [next.config.ts](next.config.ts): ```ts import type { NextConfig } from 'next'; import createNextIntlPlugin from 'next-intl/plugin'; const nextConfig: NextConfig = {...}; const withNextIntl = createNextIntlPlugin('./i18n/request.ts'); export default withNextIntl(nextConfig); ``` ## 3. Sediakan terjemahan lewat provider Di [app/layout.tsx](app/layout.tsx), ambil locale dan pesan menggunakan `getLocale()` serta `getMessages()` dari `next-intl/server`. Bagian inti dalam fungsi layout async: ```tsx import { NextIntlClientProvider } from 'next-intl'; import { getLocale, getMessages } from "next-intl/server"; const locale = await getLocale(); const messages = await getMessages(); return ( <html lang={locale}> <body> <NextIntlClientProvider messages={messages}> {children} </NextIntlClientProvider> </body> </html> ); ``` Import `NextIntlClientProvider` dari `next-intl`. Provider menyediakan pesan untuk komponen client dan mewarisi locale dari konfigurasi server. ## 4. Gunakan teks terjemahan ```tsx import { useTranslations } from 'next-intl'; export default function HomeLabel() { const t = useTranslations('NAV'); return <span>{t('home')}</span>; } ``` `NAV` adalah kelompok pesan, sedangkan `home` adalah key-nya. Untuk Server Component async, gunakan `await getTranslations('NAV')` dari `next-intl/server`. ## 5. Ganti bahasa tanpa reload halaman ```tsx const router = useRouter(); // next/navigation const locale = useLocale(); // next-intl const [isPending, startTransition] = useTransition(); // react const changeLanguage = (lang: 'id' | 'en') => { if (lang === locale || isPending) return; // eslint-disable-next-line react-hooks/immutability document.cookie = `NEXT_LOCALE=${lang}; path=/; max-age=31536000; SameSite=Lax`; startTransition(() => router.refresh()); }; ``` Panggil lewat tombol: ```tsx <button type="button" disabled={isPending} onClick={() => changeLanguage('en')} > English </button> ``` Cookie menyimpan pilihan, lalu `router.refresh()` meminta hasil render terbaru ke server **tanpa memuat ulang seluruh dokumen**. Request jaringan tetap terjadi. `useTransition()` menyediakan status `isPending` untuk indikator proses dan menonaktifkan tombol sementara. ## Catatan singkat - Tambahkan key yang sama di kedua JSON saat membuat terjemahan baru. - Cookie harus ditulis sebelum `router.refresh()`. - Isi artikel dari database tidak otomatis diterjemahkan. - Uji dengan mengganti bahasa, lalu refresh browser manual untuk memastikan pilihan tersimpan. Referensi: [next-intl](https://next-intl.dev/docs/getting-started/app-router) · [Next.js router.refresh](https://nextjs.org/docs/app/api-reference/functions/use-router).

Erlanggaht

NextJsNextIntl

2 SeptemberFrontend

SEO Next.js #2: Optimasi Metadata dan Structured Data

Sebelumnya saya sudah membuat artikel [SEO Next.js Crawling dan Indexing](https://erlanggaht.com/blog/seo-nextjs-1-crawling-dan-indexing 'SEO Next.js Crawling dan Indexing') Selanjutnya berfokus pada optimasi halaman website agar lebih mudah dipahami oleh Google dan terlihat lebih baik saat dibagikan ke media sosial. ## 1. Metadata halaman Metadata berisi informasi dasar tentang sebuah halaman, seperti judul dan deskripsi. Contohnya: - Judul halaman About - Deskripsi halaman Blog - Judul artikel - Deskripsi singkat artikel Metadata membantu Google memahami isi halaman sebelum menampilkannya di hasil pencarian. Konfigurasi SEO dikumpulkan di misal: ```text configs/seo.ts ``` Contoh metadata dasar di halaman Next.js: ```ts import type { Metadata } from 'next'; export const metadata: Metadata = { title: 'About — Erlangga Hidayatullah', description: 'Tentang Erlangga Hidayatullah, software engineer dari Indonesia.', }; ``` Metadata yang digunakan bersama beberapa halaman sebaiknya disimpan di `configs/seo.ts`, kemudian diimpor ke file halaman agar lebih mudah dirawat tapi ini opsional. ## 2. Canonical URL Canonical URL memberi tahu Google alamat utama dari sebuah halaman. Contoh canonical URL: ```text https://erlanggaht.com/blog ``` Di Next.js, canonical ditulis menggunakan `alternates`: ```ts export const metadata: Metadata = { title: 'Blog — Erlangga Hidayatullah', alternates: { canonical: '/blog', }, }; ``` Untuk artikel dinamis: ```ts alternates: { canonical: `/blog/${article.slug}`, }, ``` Hal ini membantu mencegah Google menganggap beberapa URL sebagai halaman duplikat. ## 3. Open Graph Open Graph mengatur tampilan link ketika dibagikan ke Facebook, WhatsApp, dan aplikasi lainnya. Informasi yang digunakan meliputi: - Judul - Deskripsi - Gambar preview - URL halaman Website menggunakan fallback image berikut: ```text public/images/og-image.png ``` Lokasi gambar dan konfigurasi fallback: ```ts export const OG_IMAGE = '/images/og-image.png'; ``` Contoh Open Graph: ```ts openGraph: { type: 'website', title: 'Erlangga Hidayatullah — Software Engineer', description: 'Website personal dan portofolio Erlanggaht.', images: [{ url: OG_IMAGE, alt: 'Erlanggaht — Software Engineer', }], }, ``` Jika artikel memiliki cover image, gambar tersebut digunakan sebagai preview. Jika tidak, website menggunakan fallback image. ## 4. Twitter Card Twitter Card memiliki fungsi yang sama seperti Open Graph, tetapi digunakan untuk mengatur tampilan link di X/Twitter. Website menggunakan tipe: ```text summary_large_image ``` Dengan begitu, link dapat menampilkan gambar preview yang lebih besar. ## 5. Structured Data atau JSON-LD JSON-LD adalah data terstruktur yang membantu Google memahami jenis dan isi halaman. Schema yang digunakan: - `WebSite` untuk halaman Home - `ProfilePage` untuk halaman About - `Person` untuk identitas Erlangga Hidayatullah - `Article` untuk setiap artikel Blog JSON-LD tidak mengubah tampilan website. Data ini hanya dibaca oleh mesin pencari. Contoh JSON-LD untuk halaman Home: ```tsx const websiteSchema = { '@context': 'https://schema.org', '@type': 'WebSite', name: 'Erlanggaht', url: 'https://erlanggaht.com', }; <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(websiteSchema) }} /> ``` Contoh schema untuk artikel: ```ts const articleSchema = { '@context': 'https://schema.org', '@type': 'Article', headline: article.title, author: { '@type': 'Person', name: article.author }, datePublished: new Date(article.createdAt).toISOString(), mainEntityOfPage: `https://erlanggaht.com/blog/${article.slug}`, }; ``` ## 6. Optimasi slug artikel Slug adalah bagian URL setelah `/blog/`. Contoh slug yang baik: ```text /blog/belajar-nextjs ``` Slug dibuat dari judul artikel menggunakan huruf kecil dan tanda hubung. Slug artikel lama dipertahankan ketika judul artikel diedit. Cara ini menjaga URL yang sudah dibaca Google agar tidak berubah dan menghasilkan broken link. ## 7. Internal linking Internal linking adalah link yang menghubungkan satu halaman website dengan halaman lain di website yang sama. Contohnya: - Home menuju About - Home menuju Work - Home menuju Blog - Artikel menuju artikel lain - Artikel menuju halaman Work Internal linking membantu pengunjung menemukan konten lain dan membantu Google memahami hubungan antarhalaman. ## 8. Alt text gambar Setiap gambar perlu memiliki atribut `alt` yang menjelaskan isi gambar. Contoh: ```tsx <Image src="/images/og-image.png" alt="Erlanggaht Software Engineer" /> ``` Alt text membantu aksesibilitas dan membantu Google memahami gambar. ## 9. Validasi SEO Setelah website di-deploy, halaman dapat diperiksa menggunakan Google Rich Results Test. Pengujian dilakukan setelah deploy agar Google membaca HTML terbaru dari domain publik. Halaman yang perlu diuji: ```text https://erlanggaht.com/ https://erlanggaht.com/about https://erlanggaht.com/blog https://erlanggaht.com/blog/slug-artikel ``` Jika ada perubahan SEO, lakukan deploy terlebih dahulu sebelum melakukan pengujian ulang. ## Kesimpulan Artikel ini membuat website Erlanggaht memiliki struktur SEO yang lebih rapi, metadata yang lebih lengkap, preview link yang lebih baik, dan informasi terstruktur untuk Google. Artikel Terkait: 1. [SEO Next.js #1: Crawling dan Indexing](https://erlanggaht.com/blog/seo-nextjs-1-crawling-dan-indexing 'SEO Next.js Crawling dan Indexing')

Erlanggaht

Search google consoleNextjsSEO

31 AugustFrontend

SEO Next.js #1: Crawling dan Indexing

Fase pertama SEO dalam dokumentasi saya adalah memastikan Google dapat menemukan dan membaca halaman website. Pada tahap ini saya menggunakan Next.js dan Google Search Console untuk menyiapkan verifikasi domain, sitemap, robots, dan indexing. ## 1. Verifikasi Google Search Console Tambahkan website ke Google Search Console, kemudian pilih metode verifikasi HTML file. File dari Google disimpan di folder `public`: ```text public/google-verification.html ``` Setelah deploy, file dapat dibuka melalui: ```text https://domain.com/google-verification.html ``` Jika file berhasil dibuka, lanjutkan proses verifikasi di Search Console. ## 2. Menentukan domain utama Simpan domain production di environment variable: ```env NEXT_PUBLIC_SITE_URL="https://domain.com" ``` Domain ini digunakan agar sitemap dan robots selalu menghasilkan URL production, bukan URL localhost atau deployment sementara. ## 3. Membuat sitemap Next.js Buat file `app/sitemap.ts`. Sitemap berisi daftar halaman publik yang ingin ditemukan Google. ```ts import type { MetadataRoute } from 'next'; const SITE_URL = process.env.NEXT_PUBLIC_SITE_URL ?? 'https://domain.com'; export default function sitemap(): MetadataRoute.Sitemap { return [ { url: SITE_URL, changeFrequency: 'weekly', priority: 1, }, { url: `${SITE_URL}/about`, changeFrequency: 'monthly', priority: 0.8, }, { url: `${SITE_URL}/work`, changeFrequency: 'monthly', priority: 0.9, }, { url: `${SITE_URL}/blog`, changeFrequency: 'weekly', priority: 0.8, }, ]; } ``` Next.js akan menghasilkan: ```text https://domain.com/sitemap.xml ``` Untuk website dengan blog dinamis, setiap `/blog/[slug]` juga perlu dimasukkan ke sitemap. ## 4. Membuat robots.txt Buat file `app/robots.ts`. Robots memberi tahu crawler halaman mana yang boleh atau tidak boleh dirayapi. ```ts import type { MetadataRoute } from 'next'; const SITE_URL = process.env.NEXT_PUBLIC_SITE_URL ?? 'https://domain.com'; export default function robots(): MetadataRoute.Robots { return { rules: { userAgent: '*', allow: '/', disallow: ['/admin', '/admin/'], }, sitemap: `${SITE_URL}/sitemap.xml`, host: SITE_URL, }; } ``` Hasilnya tersedia di: ```text https://domain.com/robots.txt ``` `robots.txt` bukan sistem keamanan. Halaman admin tetap harus dilindungi menggunakan autentikasi dan authorization. ## 5. Submit sitemap Di Google Search Console, buka menu **Peta Situs**, lalu submit: ```text sitemap.xml ``` Tidak perlu submit `robots.txt`. Google akan membacanya secara otomatis. ## 6. Meminta indexing Gunakan menu **Inspeksi URL** untuk memeriksa halaman penting: ```text https://domain.com/ https://domain.com/about https://domain.com/work https://domain.com/blog ``` Klik **Uji URL Aktif**, kemudian **Minta Pengindeksan**. Artikel blog tidak perlu dikirim satu per satu jika sudah tercantum dalam sitemap. ## Kesimpulan Pada Fase #1, fokusnya bukan menaikkan ranking, tetapi memastikan website bisa ditemukan dan dipahami Google. Setelah crawling dan indexing selesai, tahap berikutnya adalah memperbaiki metadata, canonical URL, Open Graph, dan struktur artikel.

Erlanggaht

Search google consoleNextjsSEO

24 AugustDevOps

Download File dari VPS Tanpa SFTP: Python HTTP Server

Pernah mengalami momen di mana Anda butuh mendownload file backup atau data dari VPS ke laptop lokal, tetapi koneksi SSH Key bermasalah (`Permission denied (publickey)`), malas menyambungkan FileZilla, atau sedang menggunakan komputer lain yang tidak punya akses SSH? Ada trik super cepat tanpa perlu install software tambahan apapun: menggunakan modul HTTP Server bawaan Python. Metode ini akan mengubah VPS Anda menjadi web server darurat dalam hitungan detik sehingga Anda bisa mendownload file langsung dari browser seperti Chrome, Edge, Firefox, dan lainnya. ## Langkah 1: Masuk ke Folder Tempat File Berada Buka terminal SSH VPS Anda, lalu masuk ke direktori atau folder tempat file yang ingin Anda download disimpan. ```bash cd /path/ke/folder/anda ``` Contoh: ```bash cd ~ ``` Perintah tersebut digunakan untuk masuk ke home directory. ## Langkah 2: Jalankan Python HTTP Server Jalankan satu baris perintah berikut di VPS: ```bash python3 -m http.server 8000 ``` Setelah perintah tersebut dijalankan, Python akan menjalankan HTTP server pada port `8000`. ## Langkah 3: Download File Lewat Browser Buka browser di laptop atau PC, lalu akses alamat IP VPS beserta port `8000` dan nama filenya. ```text http://103.196.152.176:8000/vps_full_snapshot.tar.gz ``` File tersebut kemudian dapat langsung didownload melalui browser. ## Langkah 4: Matikan Server Darurat > **PENTING:** Setelah proses unduh selesai, segera matikan HTTP server tersebut demi keamanan agar direktori VPS Anda tidak terbuka terus untuk publik. Kembali ke terminal VPS, lalu tekan: ```text CTRL + C ``` HTTP server akan berhenti dan port `8000` tidak lagi digunakan oleh Python HTTP Server. ## Troubleshooting: File Tidak Bisa Diakses atau Loading Terus? Jika halaman browser mengalami timeout atau tidak bisa dibuka, biasanya port `8000` tertahan oleh firewall **UFW** di VPS. Anda bisa membuka port tersebut sementara dengan perintah: ```bash sudo ufw allow 8000/tcp ``` Setelah selesai melakukan download, sebaiknya hapus kembali rule firewall tersebut: ```bash sudo ufw delete allow 8000/tcp ``` Dengan begitu, port `8000` tidak tetap terbuka setelah proses download selesai.

Erlanggaht

VPS

23 AugustTechnology

Mengenal Web3: Masa Depan Internet Berbasis Desentralisasi

Web3 adalah generasi ketiga dari evolusi internet yang mengusung konsep desentralisasi. Berbeda dengan Web2 yang dikuasai oleh raksasa teknologi sebagai penyimpan data terpusat, Web3 memanfaatkan teknologi blockchain untuk mengembalikan kontrol data, identitas, dan aset digital sepenuhnya ke tangan pengguna. Melalui integrasi smart contract, kripto, dan sistem kepemilikan digital, Web3 memungkinkan transaksi serta interaksi antarpengguna secara langsung tanpa perlu bergantung pada pihak ketiga (middleman). Pendekatan ini tidak hanya meningkatkan transparansi, tetapi juga membuka era baru bagi privasi dan kebebasan di dunia digital.

Erlanggaht

web