Javascript # js

Bài 1: JavaScript là gì? Cài đặt & chạy code đầu tiên

⏱ 7 phút đọc 👁 11 💬 0 bình luận

JavaScript là một ngôn ngữ lập trình được sinh ra để làm cho trang web “sống động”. Nếu HTML là xương sống của trang web, CSS là trang phục, thì JavaScript là linh hồn — nó giúp trang web tương tác với người dùng, xử lý dữ liệu, và tạo những hiệu ứng ấn tượng.

Bạn có thể viết JavaScript ở hai nơi: trình duyệt (như Chrome, Firefox) hoặc trên máy tính qua Node.js. Bài này sẽ dạy bạn cài đặt đầy đủ và chạy code JavaScript đầu tiên!

JavaScript là gì? Tại sao phải học?

JavaScript (viết tắt: JS) là ngôn ngữ lập trình chạy trên trình duyệt. Nó được tạo ra năm 1995 và đến nay đã trở thành ngôn ngữ lập trình phổ biến nhất thế giới.

Bạn xài JavaScript mỗi ngày khi:

  • Khi bạn click một nút trên Facebook, tin nhắn được gửi → JavaScript xử lý
  • Khi bạn cuộn trang, nội dung tải thêm tự động (Infinite scroll) → JavaScript làm việc
  • Khi bạn xem YouTube, video chạy được → JavaScript điều khiển
  • Khi bạn xài Gmail, email được gửi mà không reload trang → JavaScript kỳ diệu

Không chỉ web, JavaScript còn dùng để viết:

  • Ứng dụng desktop: Slack, Visual Studio Code, Discord (dùng Electron)
  • Ứng dụng mobile: React Native, NativeScript
  • Backend server: Node.js, Express (chạy trên máy chủ)
  • Game: Phaser, Babylon.js

Chuẩn bị môi trường lập trình

Để bắt đầu, bạn cần cài đặt 2 thứ:

  1. Visual Studio Code (VS Code) — trình soạn thảo code
  2. Node.js — để chạy JavaScript trên máy tính
Môi trường lập trình JavaScript VS Visual Studio Code Soạn thảo code Hỗ trợ JavaScript Màu syntax, Debug Extensions phong phú Tải: code.visualstudio.com ⬢ Node.js Engine JavaScript Chạy JS trên máy tính Gồm npm (package manager) Cho backend, CLI tools Tải: nodejs.org (LTS) + Kết quả: Sẵn sàng viết JavaScript! ✓ Chạy JS trên trình duyệt ✓ Chạy JS với Node.js ✓ Debug code dễ dàng ✓ Cài thêm libraries ✓ Chạy projects lớn ✓ Làm backend server
Các thành phần môi trường JavaScript

Bước 1: Cài đặt VS Code

Đây là trình soạn thảo mã nguồn được yêu thích nhất hiện nay.

  1. Truy cập: https://code.visualstudio.com
  2. Nhấn nút “Download” để tải phiên bản phù hợp với hệ điều hành của bạn (Windows, Mac, Linux)
  3. Cài đặt bình thường (nhấn Next > Install > Finish)
  4. Mở VS Code lên

Bước 2: Cài đặt Node.js

Node.js là engine JavaScript chạy trên máy tính, không cần trình duyệt.

  1. Truy cập: https://nodejs.org
  2. Chọn phiên bản “LTS” (Long Term Support) — đây là phiên bản ổn định nhất
  3. Tải về và cài đặt như bình thường
  4. Mở Command Prompt (Windows) hoặc Terminal (Mac/Linux) và gõ:
node --version
npm --version

Nếu hiển thị số phiên bản (ví dụ: v18.12.0), tức là cài đặt thành công!

Chạy code JavaScript đầu tiên

Bây giờ bạn đã có đủ công cụ. Hãy chạy code JS đầu tiên!

Cách 1: Chạy trực tiếp trên trình duyệt

Bước 1: Tạo file index.html

<!DOCTYPE html>
<html lang="vi">
<head>
    <meta charset="UTF-8">
    <title>JavaScript đầu tiên</title>
</head>
<body>
    <h1>Xin chào JavaScript!</h1>
    
    <script>
        // Dòng code JavaScript đầu tiên
        console.log("Xin chào từ JavaScript!");
        alert("Đây là code JavaScript chạy trên trình duyệt!");
    </script>
</body>
</html>

Bước 2: Lưu file lại, rồi mở file bằng trình duyệt. Bạn sẽ thấy:

  • Một hộp thoại (alert) hiện lên với nội dung “Đây là code JavaScript chạy trên trình duyệt!”
  • Mở DevTools (nhấn F12) → chọn tab Console → sẽ thấy dòng “Xin chào từ JavaScript!”

Cách 2: Chạy JavaScript với Node.js (trên máy tính)

Bước 1: Tạo file hello.js với nội dung:

// Dòng code JavaScript đầu tiên với Node.js
console.log("Xin chào từ Node.js!");
console.log("Đây là code chạy trên máy tính, không cần trình duyệt!");

// Tính toán đơn giản
let x = 5;
let y = 10;
console.log("5 + 10 =", x + y);

Bước 2: Mở Command Prompt/Terminal, điều hướng đến thư mục chứa file hello.js và gõ:

node hello.js

Kết quả:

Xin chào từ Node.js!
Đây là code chạy trên máy tính, không cần trình duyệt!
5 + 10 = 15

Xin chúc mừng! Bạn vừa chạy code JavaScript đầu tiên! 🎉

Tóm tắt

✅ JavaScript là ngôn ngữ lập trình giúp trang web tương tác với người dùng

✅ VS Code là trình soạn thảo code tốt nhất để học JavaScript

✅ Node.js cho phép chạy JavaScript trên máy tính, không cần trình duyệt

✅ console.log() dùng để in kết quả ra màn hình (Developer Console)

✅ Code JavaScript có thể viết trong thẻ <script> hoặc trong file .js riêng

🎯 Bài tập thực hành

Bài 1: Tạo file greeting.js và viết code để in ra tên của bạn:

// In ra: "Xin chào, tên của bạn!"
console.log("Xin chào, [tên của bạn]!");

Chạy bằng node greeting.js và kiểm tra kết quả.

Bài 2: Tạo file HTML với đoạn JavaScript tính tổng 3 số và hiển thị kết quả bằng alert(). Gợi ý:

let a = 10;
let b = 20;
let c = 30;
let tong = a + b + c;
alert("Tổng là: " + tong);

Bài 3: Mở trình duyệt, mở DevTools (F12), vào tab Console và gõ trực tiếp:

console.log("JavaScript là awesome!");

Xem kết quả hiện ra ngay trong Console. Đây là cách nhanh nhất để thử nghiệm code JavaScript! 💡

Để lại bình luận

Email của bạn sẽ không được hiển thị.