Framework-javascript-1-wolfactive-949x475
12/04/2020

[Angular] Part 1 : Hướng dẫn cài đặt Angular

Chắc hẳn các bạn đã biết về Angular, nó là một JavaScript framework dùng để viết giao diện web (Front-end), được phát triển bởi Google. Hiện nay, Angular đang được sử dụng bởi rất nhiều các công ty lớn. Và hôm nay, mình sẽ hướng dẫn các bạn cách cài đặt Angular để sử dụng.

Bước 1: Thiết lập môi trường và không gian làm việc

Bước đầu tiên chúng ta cần làm đó là setup môi trường làm việc , các bạn hãy cài đặt Node.js cho máy tính của mình . Để sử dụng Angular CLI thì bạn cài đặt Node.js phiên bản 6.9.x và NPM (node package manager) phiên bản 3.x.x.

Sau khi cài đặt xong , các bạn có thể kiểm tra bằng cách gõ node -v  và  npm -v trong cửa sổ Command Prompt(cmd):

 

cài đặt

Bước 2 : Cài đặt Angular CLI

Để tạo dự án , tạo ứng dụng , các thư viện và sử dụng Angular thì các bạn cần cài đặt Angular CLI. Các bạn hãy mở cửa sổ terminal(cmd) và nhập lệnh sau:

cài đặt

Bước 3: Tạo dự án mới

Sau khi setup xong Angular CLI thì việc tạo một dự án Angular có thể được thực hiện một cách đơn giản thông qua việc chạy câu lệnh sau:

Việc chạy câu lệnh này sẽ setup cho các bạn một project mới để làm việc , do đó nó sẽ mất kha khá khoảng thời gian nên hãy kiên nhẫn chờ nhé.

Bước 4: Chạy ứng dụng

Sau khi cài đặt xong ở bước 3, các bạn hãy gõ tiếp câu lệnh sau đây vào terminal(cmd) :

Câu lệnh ng serve sẽ khởi động web server được tích hợp cùng Angular CLI khi cài đặt và sau đó chạy dự án Angular. Đồng thời với câu lệnh này Angular CLI cũng sẽ theo dõi (watch) sự thay đổi của các tập tin và thư mục bên trong ứng dụng Angular. Nếu có bất kỳ sự thay đổi này thì Angular CLI sẽ tự động build lại ứng dụng.

Tuỳ chọn –open trong câu lệnh trên sẽ tự động mở trình duyệt và truy cập vào địa chỉ http://localhost:4200/. Bạn sẽ trình duyệt hiển thị kết quả như sau:

cài đặt

 

Vui lòng chọn size trước khi đặt hàng (*)