AngularJS là gì? Nó có giống các framework khác không? AngularJS là 1 framework front end khá phổ biến hiện nay. Cùng TopDev khám phá kiến thức về AngularJS một cách chi tiết nhất tại bài viết dưới đây. [caption id="attachment_50943" align="aligncenter" width="1200"] AngularJS Là Gì? AngularJS và Angular có khác nhau?[/caption] AngularJS là gì? AngularJS là một framework JavaScript mã nguồn mở, được phát triển bởi Google năm 2009. [caption id="attachment_24488" align="aligncenter" width="575"] AngularJS là một framework được phát triển bởi Google[/caption] AngularJS dùng để xây dựng các ứng dụng web động. Nó được thiết kế để làm cho quá trình phát triển các ứng dụng web dễ dàng và hiệu quả hơn thông qua việc cung cấp các công cụ mạnh mẽ và linh hoạt. AngularJS cho phép các nhà phát triển sử dụng HTML như một ngôn ngữ mẫu và mở rộng cú pháp HTML để biểu diễn các thành phần ứng dụng một cách rõ ràng và dễ hiểu. Kiến trúc AngularJS MVC AngularJS được xây dựng dựa trê [...]

Trong thế giới phát triển ứng dụng web ngày càng phức tạp, Angular đã trở thành một trong những framework JavaScript phổ biến và mạnh mẽ nhất. Với khả năng xây dựng ứng dụng web đa nền tảng, mạnh mẽ và linh hoạt, Angular đã thu hút được sự quan tâm của các Developers và các doanh nghiệp trên khắp thế giới. Trong bài viết này, chúng ta sẽ tìm hiểu về Angular là gì và tại sao công cụ này lại trở thành một công nghệ quan trọng trong việc phát triển ứng dụng web. Angular là gì? Angular là một framework JavaScript mã nguồn mở, được phát triển và duy trì bởi Google, giúp cung cấp một bộ công cụ đầy đủ các tính năng như two-way data binding, dependency injection, routing, forms để xây dựng ứng dụng web hiện đại, đáp ứng các yêu cầu về tính năng, khả năng mở rộng và hiệu suất cao. Angular sử dụng ngôn ngữ TypeScript, giúp phát hiện lỗi sớm và nâ [...]

Angular và React là hai công nghệ phổ biến được sử dụng để xây dựng ứng dụng Web phía Frontend, cả hai đều có những tính năng tương đồng cung cấp cho các nhà phát triển một sự lựa chọn đáng giá để xây dựng dự án Web của mình. Bài viết hôm nay chúng ta cùng nhau so sánh giữa Angular và ReactJS xem bạn sẽ quyết định lựa chọn công nghệ nào cho dự án tiếp theo của mình nhé. Tổng quan về Angular và ReactJS Angular được phát triển bởi Google từ năm 2016, nó là bản thiết kế lại hoàn toàn khác với AngularJS (còn được gọi là Angular 1.0 ra mắt từ năm 2010). ReactJS được Facebook (hiện nay là Meta) phát hành và sử dụng từ năm 2013. Cả 2 nền tảng này ngay từ khi ra mắt đã cho thấy nhiều ưu điểm vượt trội cho việc xây dựng ứng dụng đơn trang (Single Page Application) và được đông đảo lập trình viên Frontend lựa chọn làm công nghệ cho dự án [...]

Bài viết được sự cho phép của tác giả Tống Xuân Hoài Vấn đề Angular, React, Vue, Svelte (A, R, V, S)… là những cái tên mà không quá xa lạ với bạn đọc. Có lẽ mọi người sẽ ngạc nhiên hơn khi nhắc đến một nhân vật như là jQuery- một tượng đài già cỗi, đã lặng lẽ nhường ngôi cho các thanh niên trẻ bấy giờ. Nếu chịu khó tìm hiểu, cuộc đọ sức giữa các tên này không bao giờ hạ nhiệt. Rất nhiều bài viết phân tích cũng như so sánh chúng với nhau. Rằng A có cấu trúc rất chặt chẽ, R rất mạnh mẽ, nhưng V lại cho khả năng phát triển với tốc độ tuyệt vời. Còn S, một cái tên sinh sau đẻ muộn nhưng lại đang thể hiện ưu thế rất lớn khi kết hợp cả hai Back-end và Front-end làm một. Vâng! Trông nó giống như PHP, nhưng lại là… JavaScript. Có rất nhiề [...]

Angular và React là hai công nghệ được nhiều anh em lập trình Frontend quan tâm, lựa chọn làm định hướng sự nghiệp. Mặc dù đều là những framework/thư viện JavaScript nhưng cách phát triển, xây dựng ứng dụng giữa 2 nền tảng này có sự khác nhau lớn; vì vậy việc lựa chọn theo một hướng ngay từ đầu là điều quan trọng đối với lập trình viên. Bài viết hôm nay chúng ta cùng nhau đi tìm hiểu về 2 công nghệ này để giúp bạn có thể trả lời câu hỏi rằng nên học Angular hay React nhé. Tổng quan về 2 nền tảng ReactJS là một thư viện JavaScript mã nguồn mở được Facebook giới thiệu từ 2013 dành cho việc xây dựng và phát triển giao diện người dùng. Angular là một framework JS được viết bằng TypeScript mà Google phát hành/ nâng cấp vào năm 2016 (phân biệt với bản AngularJS ra đời từ 2009). Angular là 1 phần của MEAN stack (ngăn [...]

AngularJS là một framework viết bằng JavaScript dành cho Web được phát triển bởi Google từ những năm 2010. Nhờ sự hỗ trợ từ Google mà Angular luôn có chỗ đứng trong top những framework phổ biến dành cho lập trình viên Frontend; và vì thế nhu cầu tuyển dụng lập trình viên AngularJS cũng luôn ở mức cao. Trong bài viết hôm nay chúng ta cùng tìm hiểu top 10 câu hỏi phỏng vấn thường gặp cho vị trí AngularJS Developer nhé. Câu 1: AngularJS có đặc điểm gì nổi bật? AngularJS có thể xem là một trong những framework / thư viện JavaScript dành cho Frontend đầu tiên hỗ trợ double-binding dữ liệu giúp công việc lập trình Web trở nên nhanh chóng và hiệu quả. Sự tăng trưởng nhanh chóng của AngularJS vào giai đoạn 2013-2015 khiến người người nhà nhà học và làm AngularJS. AngularJS có những ưu điểm như sau: Chứa khung MVC JavaScript mã nguồn mở giúp bạn dễ dàng triển khai, mở rộng dự án mà không phải lo vấ [...]

Bài viết được sự cho phép của tác giả Tino Phạm Gắn bó với AngularJS cũng khoảng 2 năm rồi. Thật sự nhìn lại nhưng app mình làm với nó vẫn chưa gọi là “good” về chất lượng (performance). Có thể do: code sh*t, hoặc do cách tổ chức (structure) chưa tốt, hoặc cũng có thể do dữ liệu quá lớn,… Đến lúc phải nhìn lại xem nó đang bị ảnh hưởng do yếu tố nào? Làm sao để cải thiện và làm thế nào để cải thiện. Ở phạm vi bài viết này, mình không bàn về vấn đề code sh*t hay không và cũng không bàn về cách tổ chức code sao cho tốt. Vì đó là việc tùy vào đẳng cấp của mỗi người, tùy vào dự án, tùy vào tâm lý xã hội tình cảm,… Và việc thực hiện nó cần cả team và cần có một TechLead giỏi để giúp thực hiện tốt. Ở đây mình chỉ tập trung nói [...]

Bài viết được sự cho phép của tác giả Tino Phạm Cho tới thời điểm này cú pháp Controller As được nhiều người khuyến khích sử dụng. Tại sao vậy? có gì lợi hại hơn khi dùng Controller As? [irp posts="39474" name="Inversion of Control nguyên lý của các nguyên lý"] [irp posts="35001" name="Inversion of Control và Dependency Injection"] Trước hết hãy xem 2 ví dụ sau đây, một cái dùng Controller và một dùng Controller As Ví dụ 1 – dùng $Scope bình thường Ví dụ 2 – dùng Controller as Với cách dùng Controller as chúng ta thấy code dễ hiểu hơn. Đó là cái thứ nhất. Khi bạn dùng cú pháp controller as thì Angular controller sẽ tạo ra một đối tượng và gán đối  tượng này vào $scope với tên mà bạn đã đặt trước đó. Ở đây các đối tượng được tạo ra là: main, another, yet. Ảnh từ angular.org Với $scope bạn sẽ gặp phải các vấn đề khi dùng controller lồng nhau, và các controller đó có nhưng thuộc tính giống nhau. Vậy bạ [...]

Bài viết được sự cho phép của tác giả Tino Phạm Ở phần 2, bạn đã tạo được một ứng dụng với Angular 2 + Typescript. Tuy nhiên, nó không có gì ngoài hiển thị dòng chữ “My First Angular 2 App”. Trong phần này, mình sẽ cố gắng giải thích thêm về các bước mà chúng ta đã thực hiện ở phần 2. [irp posts="3146" name=" Muốn đi nhanh phải dựa vào dev, muốn đi nhanh hơn nữa phải dựa vào khách hàng""] [irp posts="2545" name="8 lợi thế khi sử dụng Polymer so với Angular và React"] File tsconfig.json File tsconfig.json là file cấu hình cho trình biên dịch của Typescript (Typescript compiler configuration). Nghĩa là, chúng ta viết code Typescript ( *.ts ) nhưng khi chạy ứng dụng thì browser sẽ đọc nội dung file ( *. js ). Ví dụ: main.ts => sẽ có main.js, main.js.map được sinh ra.Các files main.js, main.js.map được Typescript compiler (tsc) tạo ra khi chúng ta gọi lệnh npm start.Vậy khi Typescript compiler chạy, nó sẽ đọc nội dung file tsconfig.json để biết được làm thế nà [...]

Bài viết được sự cho phép của tác giả Tino Phạm Phần 2: Tạo ứng dụng với Angular 2 + Typescript Phần 1 mình đã hướng dẫn bạn cài đặt môi trường để có thể phát triển ứng dụng với Angular 2. Trong phần này, chúng ta sẽ đi vào thực hành Angular 2. Để bắt đầu tạo ứng dụng thực hành với Angular 2, các bạn có thể tham khảo về cách học một công nghệ mới và xin hãy chia sẽ với mình về ý kiến của bạn. OK,  bắt đầu thực hành thôi nào. [irp posts="2545" name="8 lợi thế khi sử dụng Polymer so với Angular và React"] [irp posts="28245" name="Angular - Tự xây dựng module lazy load images""] Bước 1: tạo thư mục vơi tên “AngularDemo“. Bước 2: Mở Visual Studio Code (VS Code) > File > Open Folder… > tìm và chọn thư mục “AngularDemo”. Bước 3: Click vào button New File > đặt tên file là tsconfig.json với nội dung như sau: { "compilerOptions": { "target": "es5", "module": "system", "moduleResolution": "node", "sourceMap": true, "emitDecoratorMetadata": true, "experimentalDecorators": true, "removeComments": false, "noImplicitAny": false }, "exclude": [ "node_modules", "typings/main", " [...]

Bài viết được sự cho phép của tác giả Tino Phạm Phần 1: Cài đặt môi trường phát triển Qua bài hướng dẫn này ngoài kiến thức sẽ học được về Angular 2, chúng ta cũng sẽ học và tìm hiểu về: NodeJS, npm, Typescript, SystemJS và Visual Studio Code. Để chuẩn bị học và thực hành một công nghệ mới, việc đầu tiên là chúng ta sẽ cài đặt môi trường. Trong phần này mình sẽ hướng dẫn các bạn cài đặt những thứ cần thiết trước khi bắt đầu thực hành Angular 2. [irp posts="28245" name="Angular - Tự xây dựng module lazy load images""] [irp posts="2545" name="8 lợi thế khi sử dụng Polymer so với Angular và React"] Cài đặt NodeJS Bạn tải NodeJS về máy tính và tiến hành cài đặt theo các bước rất đơn giản.Tại sao lại phải cài đặt NodeJS nhỉ?Chúng ta sử dụng NodeJS để có thể chạy được Javascript trên máy chủ (Server). Ngoài ra, Node có tích hợp gói npm  [...]

Bài viết được sự cho phép của tác giả Lương Văn Phúc [irp posts="2545" name="8 lợi thế khi sử dụng Polymer so với Angular và React"] [irp posts="6927" name="Buils một ứng dụng thời tiết sử dụng AngularJS"] Lời tựa Trong bài viết trước của mình về lazy-loading images, mình đã giới thiệu chi tiết cả về lý thuyết lẫn thực hành kèm với các kĩ thuật khác nhau. Tuy nhiên nếu bạn đang lúng túng chưa biết cách tích hợp vào dự án sử dụng framework Angular, thì bài viết này sẽ hướng dẫn các bạn tự tay xây dựng một angular module đơn giản hỗ trợ lazy-load images mà không cần sử dụng thư viện bên ngoài. Để tránh làm bài viết quá dài, mình sẽ chỉ trình bày về phần hướng tiếp cận và thiết lập chứ không giải thích lại về "lazy-loading images" là gì nữa nhé. Online Demo Nếu bạn không muốn đọc bài viết dài [...]

Tác giả: Tobias Merkle Documentation - Tài liệu siêu việt Bạn đã bao giờ có một ý tưởng tuyệt vời cho một dự án cuối tuần, bắt đầu vào chiều thứ bảy, và sau đó dần dần nhận ra dự án sẽ mất ít nhất sáu tháng để thực hiện đầy đủ? Google đã có một khoảnh khắc như vậy khi họ bắt đầu ghi lại tài liệu các hoạt động bên trong của ANGULAR WEB DEVELOPMENT FRAMEWORK. Sau đó, họ cho một thực tập sinh ăn không có gì ngoài espresso trong nhiều tuần cho đến khi cô có một dự án mã hóa Hello World mà họ có thể thực hiện như một tài liệu hoàn chỉnh về toàn bộ stack của mình. Không có lỗi nào bạn gặp phải trong khi xây dựng ỨNG DỤNG WEB trên ANGULAR WEB DEVELOPMENT FRAMEWORK sẽ được liệt kê ra trong tài liệu này. Thật vậy đấy, rất ít trong số các design pattern hoặc khái niệm cốt lõi mà bạn cần được ghi lại [...]

Tác giả: Ankit Sharma Giới thiệu Angular đã phát hành phiên bản mới nhất của nó, Angular 7.0. Trong bài viết này, chúng ta sẽ khám phá các điểm sau: Có gì mới trong Angular 7.0? Tạo ứng dụng Angular 7.0 đầu tiên của bạn bằng Angular CLI Cách cập nhật ứng dụng Angular hiện tại của bạn lên Angular 7.0 Có gì mới trong Angular 7.0? Khi tạo một ứng dụng Angular mới, Angular CLI sẽ nhắc người dùng chọn nếu họ muốn thêm các tính năng như định tuyến Angular hoặc kiểu định dạng mà họ muốn sử dụng trong ứng dụng của họ Các ứng dụng Angular 7.0 sẽ sử dụng tính năng Bundle Budget của Angular CLI.Điều này sẽ cảnh báo các nhà phát triển nếu kích thước gói ứng dụng vượt quá giới hạn được xác định trước. Giá trị mặc định cho cảnh báo được đặt thành 2MB và đối với lỗi là 5MB.Giá trị này có thể định cấu hình [...]

Người viết: Đinh Quốc Hội Xin chào các bạn, bây giờ một ngày hầu hết mọi người thích xem báo cáo thời tiết của các thành phố cụ thể của họ. Vì vậy, tất cả mọi người có thể có nghi ngờ rằng làm thế nào các ứng dụng thời tiết được thực hiện / phát triển và khái niệm chính đằng sau này là gì. Vì vậy, không cần phải lo lắng và suy nghĩ về điều đó nhiều, bởi vì trong bài viết này, chúng ta sẽ xem làm thế nào chúng ta có thể phát triển ứng dụng Weather của riêng mình bằng cách sử dụng Angular JS. Trước khi nói điều này, ta chỉ muốn thông báo cho bạn rằng bạn nên biết về Angular JS, REST Full API và JSON. Nếu bạn không biết về những công nghệ này, tôi sẽ chia sẻ một số tài liệu tham khảo và sau này tôi sẽ viế [...]