[{"data":1,"prerenderedAt":189},["ShallowReactive",2],{"site-header":3,"site-footer-license":42,"article-aturan-sintaks-pemrograman-with-latest":46},{"navigations":4},[5,20,37],{"collection":6,"item":7},"series",{"__typename":6,"title":8,"slug":9,"children_series":10},"Artikel","all",[11,14,17],{"title":12,"slug":13},"Algoritma dan Struktur Data","algoritma-struktur-data",{"title":15,"slug":16},"Kecerdasan Artifisial","kecerdasan-artifisial",{"title":18,"slug":19},"Konsep Dasar Pemrograman","konsep-dasar-pemrograman",{"collection":6,"item":21},{"__typename":6,"title":22,"slug":23,"children_series":24},"Tutorial","tutorial",[25,28,31,34],{"title":26,"slug":27},"Belajar Java","belajar-java",{"title":29,"slug":30},"Belajar Pascal","belajar-pascal",{"title":32,"slug":33},"Belajar Golang","belajar-golang",{"title":35,"slug":36},"Belajar Python","belajar-python",{"collection":6,"item":38},{"__typename":6,"title":39,"slug":40,"children_series":41},"Lab","lab",[],{"name":43,"url":44,"show":45},"CC BY-SA","https://creativecommons.org/licenses/by-sa/4.0/",false,{"article":47,"renderedBody":114,"renderedTakeaway":115,"latestArticles":116,"toc":169},{"prerequisite":48,"id":49,"title":50,"slug":51,"excerpt":52,"published_at":53,"thumbnail_image":48,"tags":54,"reading_time":59,"takeway":60,"body":61,"authors":62,"series":68},null,"119","Aturan Sintaks: Satu Titik Koma Bikin Program Nggak Jalan","aturan-sintaks-pemrograman","Baru nulis beberapa baris, programnya udah nolak jalan? Seringnya bukan logikanya yang salah, cuma satu karakter yang kurang atau salah tempat.","2026-10-11T23:00:15.000Z",[55,56,57,58],"syntax","dasar","konsep","python",5,"- Sintaks adalah aturan tata bahasa yang menentukan bentuk kode yang sah, terpisah dari semantik yang menentukan maknanya.\n- Penutup statement, indentasi, dan huruf besar-kecil termasuk aturan sintaks yang beda-beda antar bahasa.\n- Nama (identifier) tidak boleh memakai kata kunci bahasa dan tidak boleh diawali angka.\n- Kesalahan terbagi tiga: syntax error, runtime error, dan logic error yang paling sulit dilacak.","Kalau kamu baru mulai belajar ngoding, pemandangan pertama yang mungkin kamu temui bukan program yang jalan mulus, melainkan layar penuh teks merah. Komputer sebenernya nggak marah; dia cuma nggak paham apa yang kamu tulis. Di situlah *syntax* alias aturan sintaks memegang peran.\n\nBagian ini sering bikin pemula frustrasi, padahal masalahnya **bukan** soal logika. Seringnya cuma ada satu karakter yang kurang atau salah tempat. Yuk, kita bongkar aturan *syntax* satu-satu. Tiap aturan bakal kita temani dengan kode yang benar-benar dijalankan.\n\n## Grammar dulu, makna kemudian\n\n*Syntax* itu aturan tata bahasa sebuah bahasa pemrograman: bentuk dan urutan tulisan yang dianggap sah. Kalau kamu sudah tahu istilah ini, lewati saja bagian ini. Lawannya adalah *semantics*, yaitu makna dari tulisan yang sudah sah tadi. Dua hal ini beda, dan bedanya penting buat dipahami lebih dulu.\n\nSederhananya, kode kamu dibaca lewat dua tahap. Pertama *tokenizing*: teks dipotong jadi satuan bermakna seperti nama, angka, dan simbol. Kedua *parsing*: satuan-satuan itu dirangkai sesuai *grammar* bahasanya. Begitu *grammar*-nya dilanggar, prosesnya berhenti di situ dan keluar yang namanya *syntax error*.\n\n> Aturan *syntax* cuma soal bentuk. Program yang bentuknya sudah sah belum tentu melakukan apa yang kamu mau; itu urusan *semantics*.\n\nContoh paling gampang buat ngeliat *grammar* bekerja nih soal penutup *statement*, dan itu yang jadi bahasan berikutnya.\n\n## Titik koma: satu karakter yang bikin kompilator ngamuk\n\nBanyak bahasa menandai akhir sebuah *statement* dengan titik koma. C, C++, Java, dan JavaScript termasuk keluarga ini. Kode berikut niatnya mengalikan harga dengan jumlah:\n\n```c\n#include \u003Cstdio.h>\n\nint main(void) {\n    int harga = 20000;\n    int jumlah = 3;\n    int total = harga * jumlah;\n    printf(\"total bayar: %d\\n\", total);\n    return 0;\n}\n```\n\nJalanin lewat `gcc`, dan hasilnya:\n\n```text\ntotal bayar: 60000\n```\n\nSekarang hapus satu titik koma di baris `int total = harga * jumlah`. Proses *compile* langsung berhenti dan *compiler*-nya nunjuk lokasi masalahnya:\n\n```text\nerror: expected ',' or ';' before 'printf'\n```\n\nPerhatikan: yang dikeluhkan **bukan** baris yang kehilangan titik koma, melainkan baris sesudahnya. *Compiler* baru sadar ada yang aneh ketika sampai ke `printf` dan baris sebelumnya belum ditutup. Kalau kamu heran kok *error*-nya nunjuk baris yang kelihatan udah benar, ingat kebiasaan ini.\n\nPython jalan dengan cara lain. Di sana akhir baris alias *newline* sudah cukup jadi penanda, jadi titik koma nggak wajib. Yang jadi penentu struktur malah indentasi. Itulah kenapa topik ini butuh bagian sendiri.\n\n## Kurung kurawal atau indentasi?\n\nDi C, Java, dan JavaScript, blok kode dibatasi kurung kurawal `{ }`. Mau kamu tulis menjorok ke dalam atau rata kiri, selama kurungnya seimbang, programnya tetap sah. Python justru kebalikannya: indentasi bukan sekadar hiasan, tapi bagian dari *syntax* yang nggak bisa ditawar.\n\n```python\ntotal_belanja = 150000\n\nif total_belanja > 100000:\n    print(\"dapat diskon 10%\")\n    print(\"total bayar:\", int(total_belanja * 0.9))\nprint(\"terima kasih sudah berbelanja\")\n```\n\nDijalankan, hasilnya:\n\n```text\ndapat diskon 10%\ntotal bayar: 135000\nterima kasih sudah berbelanja\n```\n\nSekarang hapus indentasi di baris `print(\"dapat diskon 10%\")`:\n\n```text\nIndentationError: expected an indented block after 'if' statement on line 3\n```\n\nAda versi yang lebih berbahaya lagi: indentasinya sah, tapi salah tempat.\n\n```python\ntotal_belanja = 50000\n\nif total_belanja > 100000:\n    print(\"dapat diskon 10%\")\n    print(\"terima kasih sudah berbelanja\")\n```\n\nKalau dijalankan, layarnya kosong 😅. Jumlah *statement*-nya sama dengan versi benar, tapi baris `print(\"terima kasih sudah berbelanja\")` ikut masuk ke dalam blok `if`. Artinya kalimat itu cuma dicetak kalau dapat diskon, padahal niatnya selalu tercetak. Tuh, bentuk *error* yang paling licin: tanpa pesan kesalahan sama sekali, tapi artinya sudah bergeser.\n\nJadi, indentasi di Python itu *syntax*, bukan gaya penulisan. Urusan bentuk sudah beres; sekarang kita masuk ke soal penamaan, dan di sini huruf besar-kecil ikut bermain.\n\n## Huruf besar-kecil dan nama yang boleh dipakai\n\nSebagian bahasa *case-sensitive* alias membedakan huruf besar dan kecil. Python adalah salah satunya:\n\n```python\nTotal = 10\nprint(total)\n```\n\nOutput:\n\n```text\nNameError: name 'total' is not defined. Did you mean: 'Total'?\n```\n\n`Total` dan `total` dianggap dua wadah yang **beda**. Di dalam satu program, kamu bebas memakai keduanya, dan itu juga berarti gampang salah ketik 😄 kalau penamaannya nggak konsisten.\n\nAda juga bahasa yang *case-insensitive*. SQLite contohnya; nama tabel, nama kolom, dan *keyword*-nya nggak peduli huruf besar-kecil:\n\n```python\nimport sqlite3\n\nconn = sqlite3.connect(\":memory:\")\ncur = conn.cursor()\ncur.execute(\"create TABLE laporan (total_belanja INTEGER);\")\ncur.execute(\"insert into LAPORAN values (150000);\")\nprint(cur.execute(\"select TOTAL_BELANJA from Laporan;\").fetchone())\n```\n\nOutput:\n\n```text\n(150000,)\n```\n\nKamu nulis `create` kecil, `TABLE` besar, `LAPORAN` besar-besar semua—tetap jalan. Sebaliknya di Python, huruf besar-kecil itu emang harga mati.\n\nSelain soal besar-kecil, ada dua batas lain buat nama yang kamu bikin sendiri (*identifier*). Kata kunci bahasa nggak boleh dipakai jadi nama, dan nama nggak boleh diawali angka:\n\n```python\nclass = \"matematika\"\n```\n\n→ `SyntaxError: invalid syntax`\n\n```python\n2total = 5\n```\n\n→ `SyntaxError: invalid decimal literal`\n\nKata seperti `class`, `if`, dan `for` sudah \"dipesan\" buat bahasa, jadi kamu tinggal pilih nama lain, seperti `kategori`, `total_belanja`, atau `jumlah_data`. Urusan penamaan sudah kamu pegang; pertanyaan berikutnya, apa sih bedanya *statement* dan *expression*?\n\n## Statement dan expression, apa bedanya?\n\n*Statement* adalah perintah lengkap yang melakukan sebuah aksi. *Expression* adalah potongan yang menghasilkan nilai begitu dievaluasi. Baris `total_belanja = 150000` itu *statement*: dia menyuruh komputer menyimpan sesuatu. Sedangkan `total_belanja >= 100000` itu *expression*: dia cuma nilai, dan nilai itu bisa kamu pakai atau cetak:\n\n```python\ntotal_belanja = 150000\nprint(total_belanja >= 100000)\n```\n\n```text\nTrue\n```\n\nDi JavaScript pembedaannya sama:\n\n```js\nconst total_belanja = 150000;\nconsole.log(total_belanja >= 100000);\nconsole.log(\"total bayar: \" + total_belanja * 0.9);\n```\n\n```text\ntrue\ntotal bayar: 135000\n```\n\nPerhatikan baris terakhir: `total_belanja * 0.9` dievaluasi jadi `135000`, baru dirangkai ke teks. *Expression*-nya dihitung lebih dulu, *statement*-nya yang mengantar hasil ke layar. Pembagian ini bakal kepakai terus, terutama pas kamu baca pesan *error*. Karena bentuk dan makna tadi bisa diuji terpisah, jenis kesalahannya pun bisa kita kelompokkan.\n\n## Sintaks salah, program jalan, hasil keliru\n\nSekarang bagian yang paling berguna buat nge-debug: mengenali tiga jenis *error*. Ketiganya muncul di waktu yang beda, jadi petunjuknya juga beda.\n\n*Syntax error* terjadi paling awal. Kode nggak sampai dijalankan karena bentuknya melanggar *grammar*, seperti titik koma yang hilang di C tadi. *Tool*-nya bakal kasih tahu baris dan karakter yang dia tersangka.\n\n*Runtime error* muncul saat kode sudah sah dan mulai jalan, tapi ada yang nggak beres di tengah proses. Contohnya membuka *file* yang nggak ada atau membagi angka dengan nol. Kodenya lolos *parsing*, tapi berhenti saat eksekusi.\n\n*Logic error* yang paling diam-diam. Program jalan sampai selesai tanpa pesan apa pun, tapi hasilnya salah. Perhatikan potongan ini:\n\n```python\nharga = 20000\njumlah = 3\ntotal = harga * jumlah / 100\nprint(\"total bayar:\", total)\n```\n\nOutput:\n\n```text\ntotal bayar: 600.0\n```\n\n*Syntax*-nya sempurna, nggak ada yang berhenti, tapi ada `/ 100` nyasar yang bikin totalnya jadi 100 kali lebih kecil dari yang seharusnya. *Compiler* dan *interpreter* nggak bisa menangkap yang seperti ini; cuma kamu yang tahu 60000 itu angka yang dimaksud. Karena itu, menguasai *syntax* memang baru langkah pertama.\n\nKalau kamu sudah bisa ngebedain bentuk yang salah dari makna yang salah, pesan *error* berhenti jadi sumber panik dan mulai jadi petunjuk. Berikutnya, coba baca balik empat artikel sebelumnya di seri ini dengan mata baru: tiap contoh di sana tunduk pada aturan yang baru saja kamu pelajari. Selamat ngoprek, dan semoga layar merahmu makin jarang! 👋\n\nBaru mendarat di seri ini? Mulainya dari [Konsep Dasar Pemrograman](/p/konsep-dasar-pemrograman) — di situ konsep-konsep lain di seri ini dibahas satu per satu.\n",[63],{"authors_id":64},{"name":65,"slug":66,"role":67,"profile_picture":48},"Daffa Izzuddin","izzudd","Writer",{"id":69,"title":18,"slug":19,"articles":70,"parent_series":108},"12",[71,77,85,92,99,106],{"id":72,"title":18,"slug":19,"excerpt":73,"thumbnail_image":48,"tags":74},"6","Inti dari pemrograman adalah memberi instruksi alias menyuruh komputer untuk melakukan sesuatu yang kita inginkan.",[75,76],"intro","basic",{"id":78,"title":79,"slug":80,"excerpt":81,"thumbnail_image":48,"tags":82},"7","Konsep Variabel dan Tipe Data pada Pemrograman","variable-dan-tipe-data","Variabel itu ibarat “tokoh utama” di sebuah program. Nggak peduli bahasa pemrograman apapun, pasti semua punya konsep variabel.",[76,75,83,84],"variable","types",{"id":86,"title":87,"slug":88,"excerpt":89,"thumbnail_image":48,"tags":90},"8","Struktur Kontrol Kondisi (If-Else dan Switch-Case), Apa Bedanya?","struktur-kontrol-kondisi","Sering bingung kapan harus pakai if-else dan kapan switch-case? Kenapa switch-case kadang bisa lebih ngebut? Yuk, bongkar rahasianya di sini!",[76,75,91],"conditions",{"id":93,"title":94,"slug":95,"excerpt":96,"thumbnail_image":48,"tags":97},"9","Struktur Kontrol Perulangan (For, While, Do-While), Kapan Harus Dipakai?","struktur-kontrol-perulangan","Pernah ngerasa capek nulis baris kode yang sama berulang kali? Gimana caranya nyuruh komputer buat ngerjain itu secara otomatis?",[76,75,98],"looping",{"id":100,"title":101,"slug":102,"excerpt":103,"thumbnail_image":48,"tags":104},"10","Fungsi dan Prosedur dalam Pemrograman, Apa Bedanya?","fungsi-dan-prosedur","Pernah bingung kapan harus pakai fungsi dan kapan pakai prosedur pas lagi ngoding? Yuk, bongkar rahasia dan bedanya di sini biar kode kamu makin rapi!",[76,75,105],"functions",{"id":49,"title":50,"slug":51,"excerpt":52,"thumbnail_image":48,"tags":107},[55,56,57,58],{"id":93,"title":8,"slug":9,"parent_series":48,"children_series":109},[110,112,113],{"id":111,"title":12,"slug":13,"cover_image":48},"15",{"id":86,"title":15,"slug":16,"cover_image":48},{"id":69,"title":18,"slug":19,"cover_image":48},"\u003Cp>Kalau kamu baru mulai belajar ngoding, pemandangan pertama yang mungkin kamu temui bukan program yang jalan mulus, melainkan layar penuh teks merah. Komputer sebenernya nggak marah; dia cuma nggak paham apa yang kamu tulis. Di situlah \u003Cem>syntax\u003C/em> alias aturan sintaks memegang peran.\u003C/p>\n\u003Cp>Bagian ini sering bikin pemula frustrasi, padahal masalahnya \u003Cstrong>bukan\u003C/strong> soal logika. Seringnya cuma ada satu karakter yang kurang atau salah tempat. Yuk, kita bongkar aturan \u003Cem>syntax\u003C/em> satu-satu. Tiap aturan bakal kita temani dengan kode yang benar-benar dijalankan.\u003C/p>\n\u003Ch2 id=\"grammar-dulu-makna-kemudian\">Grammar dulu, makna kemudian\u003C/h2>\n\u003Cp>\u003Cem>Syntax\u003C/em> itu aturan tata bahasa sebuah bahasa pemrograman: bentuk dan urutan tulisan yang dianggap sah. Kalau kamu sudah tahu istilah ini, lewati saja bagian ini. Lawannya adalah \u003Cem>semantics\u003C/em>, yaitu makna dari tulisan yang sudah sah tadi. Dua hal ini beda, dan bedanya penting buat dipahami lebih dulu.\u003C/p>\n\u003Cp>Sederhananya, kode kamu dibaca lewat dua tahap. Pertama \u003Cem>tokenizing\u003C/em>: teks dipotong jadi satuan bermakna seperti nama, angka, dan simbol. Kedua \u003Cem>parsing\u003C/em>: satuan-satuan itu dirangkai sesuai \u003Cem>grammar\u003C/em> bahasanya. Begitu \u003Cem>grammar\u003C/em>-nya dilanggar, prosesnya berhenti di situ dan keluar yang namanya \u003Cem>syntax error\u003C/em>.\u003C/p>\n\u003Cblockquote>\n\u003Cp>Aturan \u003Cem>syntax\u003C/em> cuma soal bentuk. Program yang bentuknya sudah sah belum tentu melakukan apa yang kamu mau; itu urusan \u003Cem>semantics\u003C/em>.\u003C/p>\n\u003C/blockquote>\n\u003Cp>Contoh paling gampang buat ngeliat \u003Cem>grammar\u003C/em> bekerja nih soal penutup \u003Cem>statement\u003C/em>, dan itu yang jadi bahasan berikutnya.\u003C/p>\n\u003Ch2 id=\"titik-koma-satu-karakter-yang-bikin-kompilator-ngamuk\">Titik koma: satu karakter yang bikin kompilator ngamuk\u003C/h2>\n\u003Cp>Banyak bahasa menandai akhir sebuah \u003Cem>statement\u003C/em> dengan titik koma. C, C++, Java, dan JavaScript termasuk keluarga ini. Kode berikut niatnya mengalikan harga dengan jumlah:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">C\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"%23include%20%3Cstdio.h%3E%0A%0Aint%20main(void)%20%7B%0A%20%20%20%20int%20harga%20%3D%2020000%3B%0A%20%20%20%20int%20jumlah%20%3D%203%3B%0A%20%20%20%20int%20total%20%3D%20harga%20*%20jumlah%3B%0A%20%20%20%20printf(%22total%20bayar%3A%20%25d%5Cn%22%2C%20total)%3B%0A%20%20%20%20return%200%3B%0A%7D\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>#include <stdio.h>\n\nint main(void) {\n    int harga = 20000;\n    int jumlah = 3;\n    int total = harga * jumlah;\n    printf(\"total bayar: %d\\n\", total);\n    return 0;\n}\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Jalanin lewat \u003Ccode>gcc\u003C/code>, dan hasilnya:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"total%20bayar%3A%2060000\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>total bayar: 60000\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Sekarang hapus satu titik koma di baris \u003Ccode>int total = harga * jumlah\u003C/code>. Proses \u003Cem>compile\u003C/em> langsung berhenti dan \u003Cem>compiler\u003C/em>-nya nunjuk lokasi masalahnya:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"error%3A%20expected%20'%2C'%20or%20'%3B'%20before%20'printf'\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>error: expected ',' or ';' before 'printf'\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Perhatikan: yang dikeluhkan \u003Cstrong>bukan\u003C/strong> baris yang kehilangan titik koma, melainkan baris sesudahnya. \u003Cem>Compiler\u003C/em> baru sadar ada yang aneh ketika sampai ke \u003Ccode>printf\u003C/code> dan baris sebelumnya belum ditutup. Kalau kamu heran kok \u003Cem>error\u003C/em>-nya nunjuk baris yang kelihatan udah benar, ingat kebiasaan ini.\u003C/p>\n\u003Cp>Python jalan dengan cara lain. Di sana akhir baris alias \u003Cem>newline\u003C/em> sudah cukup jadi penanda, jadi titik koma nggak wajib. Yang jadi penentu struktur malah indentasi. Itulah kenapa topik ini butuh bagian sendiri.\u003C/p>\n\u003Ch2 id=\"kurung-kurawal-atau-indentasi\">Kurung kurawal atau indentasi?\u003C/h2>\n\u003Cp>Di C, Java, dan JavaScript, blok kode dibatasi kurung kurawal \u003Ccode>{ }\u003C/code>. Mau kamu tulis menjorok ke dalam atau rata kiri, selama kurungnya seimbang, programnya tetap sah. Python justru kebalikannya: indentasi bukan sekadar hiasan, tapi bagian dari \u003Cem>syntax\u003C/em> yang nggak bisa ditawar.\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">PYTHON\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"total_belanja%20%3D%20150000%0A%0Aif%20total_belanja%20%3E%20100000%3A%0A%20%20%20%20print(%22dapat%20diskon%2010%25%22)%0A%20%20%20%20print(%22total%20bayar%3A%22%2C%20int(total_belanja%20*%200.9))%0Aprint(%22terima%20kasih%20sudah%20berbelanja%22)\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 150000\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F97583\">if\u003C/span>\u003Cspan style=\"color:#E1E4E8\"> total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">>\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 100000\u003C/span>\u003Cspan style=\"color:#E1E4E8\">:\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">    print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"dapat diskon 10%\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">)\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">    print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"total bayar:\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">, \u003C/span>\u003Cspan style=\"color:#79B8FF\">int\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">*\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 0.9\u003C/span>\u003Cspan style=\"color:#E1E4E8\">))\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"terima kasih sudah berbelanja\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">)\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Dijalankan, hasilnya:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"dapat%20diskon%2010%25%0Atotal%20bayar%3A%20135000%0Aterima%20kasih%20sudah%20berbelanja\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>dapat diskon 10%\ntotal bayar: 135000\nterima kasih sudah berbelanja\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Sekarang hapus indentasi di baris \u003Ccode>print("dapat diskon 10%")\u003C/code>:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"IndentationError%3A%20expected%20an%20indented%20block%20after%20'if'%20statement%20on%20line%203\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>IndentationError: expected an indented block after 'if' statement on line 3\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Ada versi yang lebih berbahaya lagi: indentasinya sah, tapi salah tempat.\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">PYTHON\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"total_belanja%20%3D%2050000%0A%0Aif%20total_belanja%20%3E%20100000%3A%0A%20%20%20%20print(%22dapat%20diskon%2010%25%22)%0A%20%20%20%20print(%22terima%20kasih%20sudah%20berbelanja%22)\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 50000\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F97583\">if\u003C/span>\u003Cspan style=\"color:#E1E4E8\"> total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">>\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 100000\u003C/span>\u003Cspan style=\"color:#E1E4E8\">:\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">    print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"dapat diskon 10%\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">)\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">    print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"terima kasih sudah berbelanja\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">)\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Kalau dijalankan, layarnya kosong 😅. Jumlah \u003Cem>statement\u003C/em>-nya sama dengan versi benar, tapi baris \u003Ccode>print("terima kasih sudah berbelanja")\u003C/code> ikut masuk ke dalam blok \u003Ccode>if\u003C/code>. Artinya kalimat itu cuma dicetak kalau dapat diskon, padahal niatnya selalu tercetak. Tuh, bentuk \u003Cem>error\u003C/em> yang paling licin: tanpa pesan kesalahan sama sekali, tapi artinya sudah bergeser.\u003C/p>\n\u003Cp>Jadi, indentasi di Python itu \u003Cem>syntax\u003C/em>, bukan gaya penulisan. Urusan bentuk sudah beres; sekarang kita masuk ke soal penamaan, dan di sini huruf besar-kecil ikut bermain.\u003C/p>\n\u003Ch2 id=\"huruf-besar-kecil-dan-nama-yang-boleh-dipakai\">Huruf besar-kecil dan nama yang boleh dipakai\u003C/h2>\n\u003Cp>Sebagian bahasa \u003Cem>case-sensitive\u003C/em> alias membedakan huruf besar dan kecil. Python adalah salah satunya:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">PYTHON\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"Total%20%3D%2010%0Aprint(total)\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">Total \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 10\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(total)\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Output:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"NameError%3A%20name%20'total'%20is%20not%20defined.%20Did%20you%20mean%3A%20'Total'%3F\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>NameError: name 'total' is not defined. Did you mean: 'Total'?\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>\u003Ccode>Total\u003C/code> dan \u003Ccode>total\u003C/code> dianggap dua wadah yang \u003Cstrong>beda\u003C/strong>. Di dalam satu program, kamu bebas memakai keduanya, dan itu juga berarti gampang salah ketik 😄 kalau penamaannya nggak konsisten.\u003C/p>\n\u003Cp>Ada juga bahasa yang \u003Cem>case-insensitive\u003C/em>. SQLite contohnya; nama tabel, nama kolom, dan \u003Cem>keyword\u003C/em>-nya nggak peduli huruf besar-kecil:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">PYTHON\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"import%20sqlite3%0A%0Aconn%20%3D%20sqlite3.connect(%22%3Amemory%3A%22)%0Acur%20%3D%20conn.cursor()%0Acur.execute(%22create%20TABLE%20laporan%20(total_belanja%20INTEGER)%3B%22)%0Acur.execute(%22insert%20into%20LAPORAN%20values%20(150000)%3B%22)%0Aprint(cur.execute(%22select%20TOTAL_BELANJA%20from%20Laporan%3B%22).fetchone())\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#F97583\">import\u003C/span>\u003Cspan style=\"color:#E1E4E8\"> sqlite3\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">conn \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#E1E4E8\"> sqlite3.connect(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\":memory:\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">)\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">cur \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#E1E4E8\"> conn.cursor()\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">cur.execute(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"create TABLE laporan (total_belanja INTEGER);\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">)\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">cur.execute(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"insert into LAPORAN values (150000);\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">)\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(cur.execute(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"select TOTAL_BELANJA from Laporan;\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">).fetchone())\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Output:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"(150000%2C)\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>(150000,)\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Kamu nulis \u003Ccode>create\u003C/code> kecil, \u003Ccode>TABLE\u003C/code> besar, \u003Ccode>LAPORAN\u003C/code> besar-besar semua—tetap jalan. Sebaliknya di Python, huruf besar-kecil itu emang harga mati.\u003C/p>\n\u003Cp>Selain soal besar-kecil, ada dua batas lain buat nama yang kamu bikin sendiri (\u003Cem>identifier\u003C/em>). Kata kunci bahasa nggak boleh dipakai jadi nama, dan nama nggak boleh diawali angka:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">PYTHON\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"class%20%3D%20%22matematika%22\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#F97583\">class\u003C/span>\u003Cspan style=\"color:#F97583\"> =\u003C/span>\u003Cspan style=\"color:#9ECBFF\"> \"matematika\"\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>→ \u003Ccode>SyntaxError: invalid syntax\u003C/code>\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">PYTHON\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"2total%20%3D%205\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#FDAEB7;font-style:italic\">2total\u003C/span>\u003Cspan style=\"color:#F97583\"> =\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 5\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>→ \u003Ccode>SyntaxError: invalid decimal literal\u003C/code>\u003C/p>\n\u003Cp>Kata seperti \u003Ccode>class\u003C/code>, \u003Ccode>if\u003C/code>, dan \u003Ccode>for\u003C/code> sudah "dipesan" buat bahasa, jadi kamu tinggal pilih nama lain, seperti \u003Ccode>kategori\u003C/code>, \u003Ccode>total_belanja\u003C/code>, atau \u003Ccode>jumlah_data\u003C/code>. Urusan penamaan sudah kamu pegang; pertanyaan berikutnya, apa sih bedanya \u003Cem>statement\u003C/em> dan \u003Cem>expression\u003C/em>?\u003C/p>\n\u003Ch2 id=\"statement-dan-expression-apa-bedanya\">Statement dan expression, apa bedanya?\u003C/h2>\n\u003Cp>\u003Cem>Statement\u003C/em> adalah perintah lengkap yang melakukan sebuah aksi. \u003Cem>Expression\u003C/em> adalah potongan yang menghasilkan nilai begitu dievaluasi. Baris \u003Ccode>total_belanja = 150000\u003C/code> itu \u003Cem>statement\u003C/em>: dia menyuruh komputer menyimpan sesuatu. Sedangkan \u003Ccode>total_belanja >= 100000\u003C/code> itu \u003Cem>expression\u003C/em>: dia cuma nilai, dan nilai itu bisa kamu pakai atau cetak:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">PYTHON\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"total_belanja%20%3D%20150000%0Aprint(total_belanja%20%3E%3D%20100000)\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 150000\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">>=\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 100000\u003C/span>\u003Cspan style=\"color:#E1E4E8\">)\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"True\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>True\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Di JavaScript pembedaannya sama:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">JS\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"const%20total_belanja%20%3D%20150000%3B%0Aconsole.log(total_belanja%20%3E%3D%20100000)%3B%0Aconsole.log(%22total%20bayar%3A%20%22%20%2B%20total_belanja%20*%200.9)%3B\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#F97583\">const\u003C/span>\u003Cspan style=\"color:#79B8FF\"> total_belanja\u003C/span>\u003Cspan style=\"color:#F97583\"> =\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 150000\u003C/span>\u003Cspan style=\"color:#E1E4E8\">;\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">console.\u003C/span>\u003Cspan style=\"color:#B392F0\">log\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">>=\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 100000\u003C/span>\u003Cspan style=\"color:#E1E4E8\">);\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">console.\u003C/span>\u003Cspan style=\"color:#B392F0\">log\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"total bayar: \"\u003C/span>\u003Cspan style=\"color:#F97583\"> +\u003C/span>\u003Cspan style=\"color:#E1E4E8\"> total_belanja \u003C/span>\u003Cspan style=\"color:#F97583\">*\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 0.9\u003C/span>\u003Cspan style=\"color:#E1E4E8\">);\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"true%0Atotal%20bayar%3A%20135000\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>true\ntotal bayar: 135000\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Perhatikan baris terakhir: \u003Ccode>total_belanja * 0.9\u003C/code> dievaluasi jadi \u003Ccode>135000\u003C/code>, baru dirangkai ke teks. \u003Cem>Expression\u003C/em>-nya dihitung lebih dulu, \u003Cem>statement\u003C/em>-nya yang mengantar hasil ke layar. Pembagian ini bakal kepakai terus, terutama pas kamu baca pesan \u003Cem>error\u003C/em>. Karena bentuk dan makna tadi bisa diuji terpisah, jenis kesalahannya pun bisa kita kelompokkan.\u003C/p>\n\u003Ch2 id=\"sintaks-salah-program-jalan-hasil-keliru\">Sintaks salah, program jalan, hasil keliru\u003C/h2>\n\u003Cp>Sekarang bagian yang paling berguna buat nge-debug: mengenali tiga jenis \u003Cem>error\u003C/em>. Ketiganya muncul di waktu yang beda, jadi petunjuknya juga beda.\u003C/p>\n\u003Cp>\u003Cem>Syntax error\u003C/em> terjadi paling awal. Kode nggak sampai dijalankan karena bentuknya melanggar \u003Cem>grammar\u003C/em>, seperti titik koma yang hilang di C tadi. \u003Cem>Tool\u003C/em>-nya bakal kasih tahu baris dan karakter yang dia tersangka.\u003C/p>\n\u003Cp>\u003Cem>Runtime error\u003C/em> muncul saat kode sudah sah dan mulai jalan, tapi ada yang nggak beres di tengah proses. Contohnya membuka \u003Cem>file\u003C/em> yang nggak ada atau membagi angka dengan nol. Kodenya lolos \u003Cem>parsing\u003C/em>, tapi berhenti saat eksekusi.\u003C/p>\n\u003Cp>\u003Cem>Logic error\u003C/em> yang paling diam-diam. Program jalan sampai selesai tanpa pesan apa pun, tapi hasilnya salah. Perhatikan potongan ini:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">PYTHON\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"harga%20%3D%2020000%0Ajumlah%20%3D%203%0Atotal%20%3D%20harga%20*%20jumlah%20%2F%20100%0Aprint(%22total%20bayar%3A%22%2C%20total)\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">harga \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 20000\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">jumlah \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 3\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E1E4E8\">total \u003C/span>\u003Cspan style=\"color:#F97583\">=\u003C/span>\u003Cspan style=\"color:#E1E4E8\"> harga \u003C/span>\u003Cspan style=\"color:#F97583\">*\u003C/span>\u003Cspan style=\"color:#E1E4E8\"> jumlah \u003C/span>\u003Cspan style=\"color:#F97583\">/\u003C/span>\u003Cspan style=\"color:#79B8FF\"> 100\u003C/span>\u003C/span>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#79B8FF\">print\u003C/span>\u003Cspan style=\"color:#E1E4E8\">(\u003C/span>\u003Cspan style=\"color:#9ECBFF\">\"total bayar:\"\u003C/span>\u003Cspan style=\"color:#E1E4E8\">, total)\u003C/span>\u003C/span>\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>Output:\u003C/p>\n\n\u003Cdiv class=\"code-block-wrapper my-6 not-prose rounded-xl border-2 border-black dark:border-gray-600 shadow-neo overflow-hidden bg-[#24292e] text-[#e1e4e8] transition-all\">\n  \u003Cdiv class=\"code-block-header flex items-center justify-between px-4 py-2.5 bg-[#1f2428] border-b-2 border-black dark:border-gray-600 font-mono text-xs font-bold text-gray-300 select-none\">\n    \u003Cdiv class=\"flex items-center gap-2\">\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ff5f56] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#ffbd2e] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"w-3 h-3 rounded-full bg-[#27c93f] border border-black/40 inline-block\">\u003C/span>\n      \u003Cspan class=\"ml-2 font-mono font-bold text-xs uppercase tracking-wider text-gray-300\">TEXT\u003C/span>\n    \u003C/div>\n    \u003Cbutton type=\"button\" class=\"copy-code-btn flex items-center gap-1.5 px-3 py-1 text-xs font-bold bg-[#2f363d] text-gray-200 border-2 border-black dark:border-gray-500 rounded-lg shadow-neo-sm hover:translate-x-0.5 hover:translate-y-0.5 hover:shadow-none hover:bg-gray-700 transition-all cursor-pointer\" data-code=\"total%20bayar%3A%20600.0\" title=\"Salin kode\">\n      \u003Csvg class=\"w-3.5 h-3.5 copy-icon-svg\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        \u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\">\u003C/path>\n      \u003C/svg>\n      \u003Cspan class=\"copy-text\">Copy\u003C/span>\n    \u003C/button>\n  \u003C/div>\n  \u003Cdiv class=\"code-block-content p-4 overflow-x-auto text-sm font-mono leading-relaxed bg-[#24292e]\">\n    \u003Cpre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\">\u003Ccode>total bayar: 600.0\u003C/code>\u003C/pre>\n  \u003C/div>\n\u003C/div>\u003Cp>\u003Cem>Syntax\u003C/em>-nya sempurna, nggak ada yang berhenti, tapi ada \u003Ccode>/ 100\u003C/code> nyasar yang bikin totalnya jadi 100 kali lebih kecil dari yang seharusnya. \u003Cem>Compiler\u003C/em> dan \u003Cem>interpreter\u003C/em> nggak bisa menangkap yang seperti ini; cuma kamu yang tahu 60000 itu angka yang dimaksud. Karena itu, menguasai \u003Cem>syntax\u003C/em> memang baru langkah pertama.\u003C/p>\n\u003Cp>Kalau kamu sudah bisa ngebedain bentuk yang salah dari makna yang salah, pesan \u003Cem>error\u003C/em> berhenti jadi sumber panik dan mulai jadi petunjuk. Berikutnya, coba baca balik empat artikel sebelumnya di seri ini dengan mata baru: tiap contoh di sana tunduk pada aturan yang baru saja kamu pelajari. Selamat ngoprek, dan semoga layar merahmu makin jarang! 👋\u003C/p>\n\u003Cp>Baru mendarat di seri ini? Mulainya dari \u003Ca href=\"/p/konsep-dasar-pemrograman\">Konsep Dasar Pemrograman\u003C/a> — di situ konsep-konsep lain di seri ini dibahas satu per satu.\u003C/p>\n","\u003Cul>\n\u003Cli>Sintaks adalah aturan tata bahasa yang menentukan bentuk kode yang sah, terpisah dari semantik yang menentukan maknanya.\u003C/li>\n\u003Cli>Penutup statement, indentasi, dan huruf besar-kecil termasuk aturan sintaks yang beda-beda antar bahasa.\u003C/li>\n\u003Cli>Nama (identifier) tidak boleh memakai kata kunci bahasa dan tidak boleh diawali angka.\u003C/li>\n\u003Cli>Kesalahan terbagi tiga: syntax error, runtime error, dan logic error yang paling sulit dilacak.\u003C/li>\n\u003C/ul>\n",[117,128,139,150,159,161],{"id":118,"title":119,"slug":120,"excerpt":121,"thumbnail_image":48,"tags":122},"111","Rust Masuk Kernel Linux: Revolusi Nyata atau Cuma Euforia RIIR?","rust-di-kernel-linux-revolusi-atau-cuma-hype","Selama lebih dari 30 tahun kernel Linux cuma mau bahasa C, lalu tiba-tiba Rust resmi masuk di Linux 6.1. Itu revolusi beneran atau cuma kebawa euforia meme Rewrite It In Rust? Yuk lihat datanya, bukan cuma opininya.",[123,124,125,126,127],"rust","linux","kernel","system-programming","memory-safety",{"id":129,"title":130,"slug":131,"excerpt":132,"thumbnail_image":48,"tags":133},"118","Belajar Idempotency dari Stok yang Keburu Kebeli","pub-sub-sendiri-lalu-belajar-idempotency","Tugas pertama saya di kerjaan pertama: sistem yang kewalahan menerima webhook. Saya putuskan membangun pub/sub sendiri dari nol, dan pelajaran yang akhirnya datang bukan dari situ — tapi dari stok gudang yang keburu kebeli orang.",[134,135,136,137,138],"idempotency","event-driven","celery","rabbitmq","post-mortem",{"id":140,"title":141,"slug":142,"excerpt":143,"thumbnail_image":48,"tags":144},"112","Aplikasimu lambat, dan kamu udah kepikiran ganti bahasa. Tunggu dulu","aplikasimu-lambat-dan-kamu-udah-kepikiran-ganti-bahasa-tunggu-dulu","Ada endpoint yang grafiknya spike tiap beberapa menit, dan kepikiran buat pindah dari Go ke Rust? Discord dan Cloudflare beneran melakukannya — tapi cuma setelah kehabisan cara lain dan punya datanya. Yuk, bedah gejala mana yang beneran butuh rewrite, dan mana yang cuma butuh profiling. 🤔",[145,146,147,123,148,149],"backend","performance","golang","system-design","profiling",{"id":151,"title":152,"slug":153,"excerpt":154,"thumbnail_image":48,"tags":155},"113","Garbage Collector dituduh bikin aplikasi lemot. Seberapa adil tuduhan itu?","garbage-collector-dituduh-bikin-aplikasi-lemot","GC sering jadi tersangka utama tiap aplikasi melambat, dan banyak yang percaya dia jalan pakai timer tiap beberapa detik. Dua-duanya nggak sepenuhnya benar. Yuk bedah cara kerja GC dari dalam, plus satu pengecualian yang bikin Discord kesakitan tiap 2 menit. 🤔",[145,146,147,156,157,158],"jvm","garbage-collector","memory",{"id":49,"title":50,"slug":51,"excerpt":52,"thumbnail_image":48,"tags":160},[55,56,57,58],{"id":162,"title":163,"slug":164,"excerpt":165,"thumbnail_image":48,"tags":166},"120","Tiap Nota di Kafe Ini Isinya Pesanan yang Sama","tiap-nota-isinya-pesanan-yang-sama","Nota tiap meja isinya sama semua, dan totalnya Rp0 — padahal tiap meja cuma pesan satu barang. Coba tebak kenapa.",[58,167,168,40],"scope","mutasi",[170,174,177,180,183,186],{"text":171,"depth":172,"id":173},"Grammar dulu, makna kemudian",2,"grammar-dulu-makna-kemudian",{"text":175,"depth":172,"id":176},"Titik koma: satu karakter yang bikin kompilator ngamuk","titik-koma-satu-karakter-yang-bikin-kompilator-ngamuk",{"text":178,"depth":172,"id":179},"Kurung kurawal atau indentasi?","kurung-kurawal-atau-indentasi",{"text":181,"depth":172,"id":182},"Huruf besar-kecil dan nama yang boleh dipakai","huruf-besar-kecil-dan-nama-yang-boleh-dipakai",{"text":184,"depth":172,"id":185},"Statement dan expression, apa bedanya?","statement-dan-expression-apa-bedanya",{"text":187,"depth":172,"id":188},"Sintaks salah, program jalan, hasil keliru","sintaks-salah-program-jalan-hasil-keliru",1791759826055]