Day 5 — Introduction to JavaScript: Node, Compiler, CLI, and Variables

Catatan dari materi Introduction to JavaScript. Materi membahas setup Linux untuk coding, tradisi Hello World, compiler sebagai translator source code ke machine code, proses tokenisasi source code, JavaScript reserved keywords, variable dengan let, penyimpanan value di RAM, memory address, lexical environment, penggunaan Node.js sebagai compiler/runtime JavaScript, dasar CLI vs GUI, command terminal seperti cd/ls/pwd/mkdir/touch, file index.js, single quote vs double quote, dan Q&A tentang Node alias, terminal command, import/require, serta standar penulisan code.

Detail sesi

Mood: normal

Durasi: 2 jam

Program: JavaScript Bootcamp Journey

Learning points

• Node.js menjalankan file JavaScript
Dalam kelas ini, Node dipakai untuk menjalankan source file JavaScript seperti index.js dari terminal.
• Token memiliki type dan attribute
Token bisa berupa keyword, identifier, operator, number, atau punctuation tergantung apa yang dibaca compiler.
• CPU membutuhkan machine code
CPU tidak bisa langsung memahami source code yang mudah dibaca manusia, sehingga instruksi harus diterjemahkan menjadi machine code.
• Source code adalah kode yang ditulis manusia
Kode seperti console.log('Hello World') adalah source code karena merupakan bentuk asli sebelum diterjemahkan/dieksekusi.
• Hello World adalah tradisi programming
Program pertama sering mencetak Hello World karena tradisi panjang dari contoh bahasa pemrograman awal seperti C.

Bug notes

Menjalankan JavaScript tanpa Node terinstall atau terkonfigurasi

File JavaScript tidak bisa dieksekusi dari terminal karena binary Node hilang atau PATH/alias belum benar.

Solusi: Install Node.js dengan benar, verifikasi dengan node --version, dan cek lokasi binary memakai which node.

Style quote string tidak konsisten

Kode mungkin tetap jalan, tetapi terlihat berantakan dan kurang profesional.

Solusi: Pilih satu style quote untuk project dan gunakan secara konsisten.

Salah memahami variable sebagai value itu sendiri

Ini membuat bingung saat belajar memory, reference, variable binding, dan perilaku runtime.

Solusi: Pahami nama variable sebagai alias yang dipetakan ke memory address tempat value disimpan.

Komentar pembaca

Komentar akan muncul setelah disetujui admin.

Belum ada komentar yang disetujui.

Tulis komentar

Hari ini aku belajar Introduction to JavaScript. Materi dimulai dari persiapan environment. Untuk belajar JavaScript di bootcamp ini, peserta diarahkan memakai Linux atau Mac karena workflow programming profesional biasanya lebih dekat dengan dua sistem operasi tersebut. Windows tetap bisa dipakai, tetapi instructor menyarankan Linux/Mac agar proses belajar coding, terminal, Node.js, dan tooling lebih sesuai dengan standar kerja profesional. Jika masih butuh Windows untuk aktivitas lain, salah satu opsi adalah dual boot: satu komputer memiliki dua sistem operasi, misalnya Windows dan Linux. Setelah itu materi masuk ke tradisi pertama dalam programming: Hello World. Hampir semua bahasa pemrograman, buku, kursus, dan kampus memulai contoh pertama dengan program yang mencetak “Hello World”. Tradisi ini berasal dari contoh lama bahasa C oleh Dennis Ritchie dan Ken Thompson, ketika mereka menunjukkan bahwa sebuah bahasa pemrograman bisa mencetak text sederhana ke layar. Karena itu, saat belajar JavaScript, contoh pertama juga menggunakan console.log('Hello World'). Materi lalu menjelaskan bahwa code yang kita tulis disebut source code. Source code adalah bentuk asal yang ditulis manusia, misalnya console.log('Hello World');. Komputer tidak menjalankan source code secara langsung. CPU hanya memahami instruksi dalam bentuk machine code, yaitu representasi rendah seperti 0 dan 1. Karena itu dibutuhkan compiler atau translator untuk membaca source code, menerjemahkannya menjadi machine code, lalu CPU menjalankan hasil tersebut. Dalam konteks JavaScript di kelas ini, program yang dipakai untuk menjalankan dan menerjemahkan file JavaScript adalah Node.js. Istilah source code juga penting secara profesional. Di perusahaan, developer sering menandatangani NDA atau non-disclosure agreement yang melarang membocorkan source code. Setelah memahami definisi source code, aku jadi paham bahwa yang dimaksud adalah file code asli yang ditulis developer, bukan sekadar output program. Materi berikutnya membahas cara compiler membaca source code. Compiler tidak membaca semua code sekaligus seperti manusia membaca kalimat. Compiler membaca karakter demi karakter dari kiri ke kanan, lalu memecahnya menjadi token. Token punya type dan attribute. Contohnya pada code let sum = 10 + 20;, compiler membaca huruf L, E, T, lalu ketika bertemu spasi, ia tahu bahwa let sudah selesai dan cocok dengan JavaScript reserved keyword. Maka token yang dibuat adalah keyword dengan attribute let. Compiler juga membaca identifier seperti sum. Ia tidak langsung membuat token ketika baru membaca s, u, m karena bisa saja kata itu masih berlanjut menjadi summary atau summer. Compiler baru yakin ketika bertemu delimiter seperti spasi, operator, atau tanda titik koma. Dengan cara yang sama, angka 10 dibaca sebagai number setelah compiler tahu angka itu selesai. Operator seperti = dan + juga menjadi token sendiri, sedangkan titik koma menjadi punctuation yang menandakan akhir statement. Dari sini aku belajar bahwa yang spesial bukan warna text di editor, melainkan compiler. Warna syntax hanya bantuan visual untuk manusia. Yang benar-benar menentukan apakah code bisa dijalankan adalah compiler/runtime yang bisa membaca source code, memecahnya menjadi token, memahami aturan bahasa, lalu menerjemahkan dan menjalankannya. Materi lalu masuk ke variable. Contoh let age = 20 menunjukkan bahwa variable punya identifier bernama age dan value 20. Kata let dipakai untuk mendeklarasikan variable. Dulu JavaScript memakai var, tetapi var punya banyak side effect dan bisa menyebabkan bug, sehingga JavaScript modern lebih menyarankan let untuk variable yang nilainya bisa berubah. Instructor menjelaskan lebih dalam bahwa angka 20 tidak hanya “menempel” di kata age. Value 20 disimpan di RAM dalam bentuk binary, di sebuah lokasi tertentu. Lokasi itu memiliki memory address, biasanya ditulis dalam bentuk hexadecimal. Prefix seperti 0x atau x menunjukkan angka hexadecimal. Karena manusia sulit mengingat alamat memori seperti itu, JavaScript menyediakan variable name sebagai alias yang lebih mudah dibaca. Ketika let age = 20 dijalankan, runtime mencari lokasi kosong di RAM untuk menyimpan value 20. Memory controller membantu mencari slot kosong tersebut dan mengembalikan memory address. Setelah itu JavaScript membuat mapping antara variable name age dan memory address tempat value disimpan. Tempat mapping antara identifier dan address ini disebut lexical environment. Jadi variable name adalah jembatan manusiawi agar developer tidak perlu menulis alamat memori secara manual. Setelah konsep compiler, token, dan variable, materi masuk ke praktik. Ada dua cara mengoperasikan komputer: GUI dan CLI. GUI atau graphical user interface adalah cara klik-klik dengan mouse, seperti membuka folder, membuat folder, dan menyimpan file lewat tampilan visual. CLI atau command line interface memakai terminal. Programmer biasanya banyak memakai CLI karena lebih cepat, presisi, dan sesuai workflow development. Beberapa command dasar terminal dijelaskan. pwd berarti print working directory untuk melihat lokasi saat ini. cd berarti change directory untuk masuk atau keluar folder. ls berarti list untuk melihat isi folder. mkdir berarti make directory untuk membuat folder baru. touch dipakai untuk membuat file baru. cd .. dipakai untuk naik ke parent directory. Terminal juga bisa memakai autocomplete dengan tombol Tab agar nama folder/file tidak harus diketik penuh. Demo dilakukan dengan membuat folder learn-console-log, membuat file index.js, lalu menulis console.log('Hello World');. File JavaScript memakai extension .js agar jelas bahwa isinya source code JavaScript. Secara teknis compiler bisa membaca isi file, tetapi extension .js adalah standar agar manusia dan tooling tahu jenis file tersebut. Materi juga menyinggung single quote dan double quote. Dalam JavaScript, string bisa memakai single quote atau double quote. Keduanya bisa jalan selama konsisten: jika dibuka dengan single quote, harus ditutup dengan single quote; jika dibuka dengan double quote, harus ditutup dengan double quote. Instructor menekankan bahwa kerapihan code penting karena source code adalah karya yang dibaca manusia. Code yang tidak konsisten terlihat tidak rapi dan bisa memberi kesan kurang profesional. Program kemudian dijalankan dengan command node index.js. Node membaca file index.js, menerjemahkannya, lalu output muncul di terminal. Jika isi file diganti dari Hello World menjadi Hello KodingUp, output juga berubah. Ini menunjukkan bahwa source code yang berbeda diterjemahkan menjadi instruksi yang berbeda. Instructor juga menunjukkan bahwa node sebenarnya adalah program/file nyata di sistem, bukan kata ajaib. Dengan command which node, kita bisa melihat lokasi binary Node di folder tertentu, misalnya di dalam folder nvm/versions/node/.../bin/node. Saat kita menulis node index.js, command node menjadi alias atau shortcut yang menunjuk ke program Node tersebut. Program Node lalu menerima file index.js sebagai input untuk dijalankan. Q&A membahas bahwa token dibuat berurutan karena compiler membaca karakter dari kiri ke kanan. Pertanyaan lain membahas command Linux seperti cd, ls, mkdir, dan manual command dengan man. Ada juga pembahasan require vs import di Node.js, single quote vs double quote, standar style dari perusahaan seperti Airbnb, dan penamaan folder/file seperti dash atau underscore yang biasanya mengikuti standar perusahaan atau project. Kesimpulannya, Introduction to JavaScript bukan hanya tentang menulis console.log. Materi ini menghubungkan banyak fondasi penting: environment Linux/Mac, terminal, source code, compiler, token, reserved keyword, variable, RAM, memory address, lexical environment, Node.js, file .js, dan kerapihan code. Dengan memahami fondasi ini, aku tidak hanya tahu cara menjalankan JavaScript, tetapi juga mulai memahami apa yang terjadi di balik layar ketika program dijalankan.