Bài học thứ 2 trong series học Angular của Trung Tâm Đào Tạo Lập Trình Viên JANETO.

Trước khi chúng ta có thể bắt đầu code những dòng lệnh đầu tiên bằng Angular. Chúng ta cần chuẩn bị những hành trang cần thiết. Chào mừng các bạn trở lại với series học Angular từ laptrinhvien.io. Mình là Lê Xuân Quỳnh Developer của công ty JANETO và cũng là giảng viên của Trung Tâm Đào Tạo Lập Trình Viên JANETO (laptrinhvien.io).

Trong bài học này, mình sẽ hướng dẫn các bạn những cài đặt cần thiết để có thể bắt đầu, đó là những công cụ, framework, editor phù hợp và những gói mở rộng để giúp cho công việc lập trình của các bạn trở nên dễ dàng.

Để xây dựng ứng dụng Angular, chúng ta sử dụng ngôn ngữ TypeScript. Một trong những thế mạnh của TypeScript là strongly-typed, có nghĩa là mọi thứ đều sẽ có một kiểu dữ liệu, nó khác với cách mà chúng ta thường làm việc với Javascript tất cả đều chỉ khai báo bằng từ khoá “var”. Chính vì vậy mà TypeScript có rất nhiều công cụ hỗ trợ như kiểm tra cú pháp, điều hướng code, giúp cho việc code những ứng dụng trở nên rõ ràng và chắc chắn chúng ta sẽ có một bài học riêng về TypeScript để tìm hiểu nhiều hơn về ngôn ngữ mới này.

Có rất nhiều Editor hỗ trợ đầy đủ lập trình TypeScript. Bạn hãy chọn cho mình một trong những editor mà bạn cảm thấy là tốt nhất, và Editor đó phải hỗ trợ TypeScript nhé. Trong loạt bài giảng này, Mình sử dụng Visual Studio Code, VSC có thể chạy trên nhiều nền tảng như Linux, Windows và MacOS nó có những tính năng tuyệt vời hỗ trợ cho TypeScript như “auto completion”, IntelliSense, Syntax checking, và refactorings. Nếu bạn muốn sử dụng Visual Studio Code như của mình, bạn có thể tải về bản cài đặt tại đây. Trong suốt hành trình này, mình sẽ nói thêm những tính năng hay ho khác mà Visual Studio Code mang lại.

Chúng ta đã chọn được một Editor phù hợp, vậy tiếp theo hãy thiết lập môi trường để bắt đầu code nào.

Để thiết lập môi trường phát triển Angular thì đòi hỏi phải có 2 bước cơ bản:

1. Cài đặt NPM hay còn gọi là Node Package Manager
2. Thiết lập ứng dụng Angular thông qua Angular CLI

Đầu tiên NPM là gì? Npm hay Node Package Manager là một công cụ quản lý những gói thư viện JavaScript opensource thông qua Command Line.

Sử dụng NPM chúng ta có thể cài đặt những thư viện, gói, và những ứng dụng cũng những dependency của chúng. Chúng ta sẽ sử dụng npm để cài đặt tất cả những thư viện của Angular và đưa thư viện này vào ứng dụng của chúng ta.

Nếu bạn chưa có NPM, bạn có thể download nó từ đường link này https://www.npmjs.com/. Đây là website của npm, để cài đặt bạn cuộn xuống cuối trang và click vào đây. Nó sẽ dẫn chúng ta tới trang download của Node. Hãy chọn hệ điều hành mà bạn đang sử dụng để tải về bản cài đặt. Sau cài đặt xong chúng ta hãy dùng lệnh npm -v để có thể kiểm tra được phiên bản mà bạn đã cài đặt.

Bước thứ 2, để thiếp lập ứng dụng Angular, thật may mắn là nhóm phát triển Angular cung cấp cho chúng ta một công cụ có tên là Angular CLI. Chúng ta cài đặt Angular CLI thông qua NPM và câu lệnh cài đặt rất đơn giản.

Ngay bây giờ hãy mở terminal lên và gõ câu lệnh dưới đây. npm install -g@angular/cli

Sau khi các bạn cài đặt xong, hãy kiểm tra Angular CLI bằng lệnh ng -v  thì nó sẽ hiển thị phiên bản mà bạn đã cài đặt.

Tiếp theo để thiết lập một ứng dụng Angular, chúng ta sẽ sử dụng những lệnh mà Angular CLI cung cấp đó là ng new -tên ứng dụng để thiết lập một ứng dụng đầu tiên. Để chạy ứng dụng mẫu này bạn chỉ cần đơn giản chạy lệnh ng serve

Cuối cùng các bạn hãy cài những extentions cần thiết để nó hỗ trợ chúng ta trong lúc lập trình Angular.

1. TSLint
2. Auto Import
3. Angular 5 TypeScript Snippet
4. Angular2-inline
5. …

Để biết rõ hơn về những cài đặt cần thiết, cũng như những extentions quan trọng. Chúng ta hãy tập trung và cùng xem video bên dưới các bạn nhé!

Như vậy là chúng ta đã hoàn thành xong những hành trang cần thiết trong Angular. Cảm ơn các bạn đã theo dõi bài học hôm nay. Hẹn gặp lại các bạn ở bài học tiếp theo trong series học Angular.

Chúng tôi luôn mong muốn mang lại những kiến thức bổ ích cho các bạn yêu thích lập trình. Các bạn hãy đón xem và ủng hộ bằng cách LIKE/SHARE hay SUBCRIBE để có thể cập nhật thông tin mới nhất từ chúng tôi. Và đừng quên chia sẻ bài học này tới bạn bè của mình để cùng nhau chinh phục Angular bạn nhé!

Đặc biệt, hiện tại Trung Tâm đang tuyển sinh cho Khoá học Angular 5 khai giảng trong tháng 12. Các bạn hãy xem chi tiết lịch khai giảng và đăng ký học tại đây: ►►► LỊCH KHAI GIẢNG THÁNG 12

TRUNG TÂM ĐÀO TẠO LẬP TRÌNH VIÊN JANETO

 0933067997 – 0933267337
 facebook.com/laptrinhvienio
 YouTube/laptrinhvienio
 tuyensinh@laptrinhvien.io
 Tầng 2 Tòa nhà The Morning Star – 57 Quốc Lộ 13, Phường 26, Quận Bình Thạnh, Tp. Hồ Chí Minh.