Angular Js – Fullstack Station https://fullstackstation.com Hướng dẫn lập trình, thiết kế, lập trình web, thiết kế web, lập trình javascript, lập trình fullstack từ cơ bản đến nâng cao Thu, 25 Apr 2024 04:24:30 +0000 vi hourly 1 https://wordpress.org/?v=6.8.5 https://fullstackstation.com/wp-content/uploads/2019/08/favicon.ico Angular Js – Fullstack Station https://fullstackstation.com 32 32 So sánh Vue.js và React.js: một cái nhìn toàn diện https://fullstackstation.com/so-sanh-vue-js-va-react-js-mot-cai-nhin-toan-dien/ https://fullstackstation.com/so-sanh-vue-js-va-react-js-mot-cai-nhin-toan-dien/#comments Thu, 06 Jun 2019 06:07:12 +0000 http://fullstackstation.com/?p=1722 So sánh Vue.js và React.js là một chủ đề rất hay. Vue.js đã vượt qua React.js về số lượng sao ở Github, với 140k so với 130k, chắc chắn là sẽ tạo cuộc đua hấp dẫn. Nên chọn cái nào bây giờ? Dù chưa có kinh nghiệm nhiều về Vue.js, cũng cố gắng nghiên cứu […]

The post So sánh Vue.js và React.js: một cái nhìn toàn diện appeared first on Fullstack Station.

]]>
So sánh Vue.js và React.js là một chủ đề rất hay. Vue.js đã vượt qua React.js về số lượng sao ở Github, với 140k so với 130k, chắc chắn là sẽ tạo cuộc đua hấp dẫn. Nên chọn cái nào bây giờ? Dù chưa có kinh nghiệm nhiều về Vue.js, cũng cố gắng nghiên cứu xem 2 bạn này phù hợp với từng dự án ra sao nhé. Bài viết này giới thiệu một góc nhìn tổng quát nhưng cũng đầy đủ về 2 nền tảng/hệ sinh thái này.

Angular.js thì sao?

Mình không muốn nhắc tới Angular.js nữa, mình nghĩ Angular.js sẽ bái bai chúng ta trong thời gian không lâu nữa. Cuộc đua đã ngã mũ với Angular.js khi hiện tại chỉ đạt gần 50k sao ở Github và đà tăng trưởng về sao cũng chậm lại khá rõ khi cách đây 2 năm đã ở ngưỡng ~35k.

Thử nhìn đoạn mã sau trong “Getting Started” của Angular 8:

<h2>Products</h2>
 <div *ngfor="let product of products">
  <h3>
    <a [title]="product.name + ' details'">
      {{ product.name }}
    </a>
  </h3>
  <p *ngif="product.description">
    Description: {{ product.description }}
  </p>
   <button (click)="share()">
    Share
  </button>
</div>

Đoạn mã này trình bày 5 ý:

  • *ngFor
  • *ngIf
  • Interpolation {{ }}
  • Property binding [ ]
  • Event binding ( )

Vừa thay đổi cấu trúc nhận event lại còn thuộc tính của thẻ html, lại còn thêm *. Nói thiệt ai chê mình ngu thì mình chịu, chứ từ lúc làm cái dự án với Angular 1 là mình tởn, tới tận giờ phiên bản 8 vẫn còn thấy ngu :(.

Với kết quả thăm dò của Scotch.io cho câu hỏi “Lần cuối bạn sử dụng Angular (bất kể phiên bản nào) để tạo 1 dự án mới là khi nào?”, hơn 50% trả lời là hơn 1 năm. Mình nghĩ kết quả này đã quá rõ ràng cho kết cục của Angular.

Vậy nhé, nếu sếp bắt làm dự án với Angular thì thành thật chia buồn.

So sánh Vue.js và React.js qua các con số thống kê

React.jsVue.jsWinner?
Sao130,480 140,459 Vue.js
Được sử dụng2,041,980864,314React.js
Người đóng góp1297276React.js
Số lượng commit110083017React.js
Số bản release116248Vue.js
Số pull request~8000~1500React.js
Số issues~7500~8000React.js (ít hơn thì tốt hơn)

Tần suất phát hành phiên bản mới

Với sự hình thành đã lâu không khó để hiểu React.js vượt trội về số lượng commit và pull request. Tuy nhiên cũng nhìn nhận 1 điều là số lần release của Vue.js lại gấp đôi React.js, có thể kết luận về tính stable của dự án thì React.js hơn hẳn. Vì sao? Vì commit code ít nhưng lại release nhiều, mình nghi ngờ về chất lượng release, không tin à, nhìn hình sau nhé:

Vue.js Releases (so sánh Vue.js và React.js)

Trong 1 ngày mà release xong fix bug muối mặt luôn, còn React.js thì bản nào release mình thấy rất an tâm mà cập nhật ngay, còn với Vue.js thì chắc là không.

Winner: React.js

Mức độ thịnh hành

Mục này mình xét các thông số: được sử dụng, fork, và số người đóng góp.

React.js rõ ràng được sử dụng rộng rãi hơn khi được sử dụng ở 2 triệu dự án, so với khoảng gần 900k với Vue.js. Mặc dù vậy, cũng có thể do React.js được ra đời sớm nên được sử dụng nhiều hơn? Còn Vue.js ra đời sau nhưng đã đạt 900k thì quả thực rất ấn tượng.

Fork về có kết quả tương đương, React.js nhỉnh hơn 1 chút với 24k, so với 20k của Vue.js, nhưng số người đóng góp lại khá chênh lệch 1297/276 ~ gấp 5 lần. Có thể suy ra fork vue.js về cho vui :D. Tính tương quan về số lượng pull requests/forks và người đóng góp/forks thì lần lượt React.js đạt 33% và 5%, còn Vue.js đạt 7.5% và1.4%. Đây là tỉ lệ khá chênh lệch, và có thể nói rằng người dùng React.js giỏi hơn (?), có khả năng đóng góp, chịu khó đóng góp hơn người dùng Vue.js.

Kết quả về tỉ lệ pull requests/forks và contributes/forks này, mình không cho là vì React.js có trước Vue.js có sau, vì rõ ràng số lượng forks của Vue.js rất cao. Ý nghĩa về việc forks của mỗi người thì cũng khó biết, tuy nhiên chỉ gói gọn trong 2 mục đích:

  • Lưu giữ làm của riêng (sợ mất, mình cũng có khi có suy nghĩ đó :D)
  • Đóng góp cho cộng đồng, kết quả này cho thấy cộng đồng React.js phát triển hơn, có khả năng đóng góp và phát triển nền tảng hơn hẳn Vue.js.

Winner: React.js

So sánh Vue.js và React.js trong lĩnh vực phát triển ứng dụng di động, native

Đối thủ lớn Flutter

Flutter (so sánh Vue.js và React.js)

Việc được sử dụng rộng rãi hơn cũng do React Native sử dụng React, còn Vue.js thì không có nền tảng di động chính thức mà chỉ có đối tác là Weex hoặc Vue-Native, sự tồn tại và phát triển của Weex sẽ gặp thách thức khá lớn khi Flutter đã chứng tỏ được khả năng và sự thống trị của React Native.

So sánh Vue.js và React.js thì không thể bỏ qua Flutter. Mình thấy Flutter rất tuyệt (xem thêm Flutter là gì), tuy rằng theo mình sẽ rất khó ăn hiếp được Reat Native, nhưng với Weex thì khả năng cạnh tranh được với Flutter là cực khó. Bằng chứng là số sao của Flutter gấp 5 lần Weex, mặc dù Flutter cũng mới ra mắt cách đây không lâu.

Hơn nữa, Flutter là nền tảng được hỗ trợ chính thức bởi Google (Google I/O), và hỗ trợ đa nền tảng. Có thể dùng Flutter để tạo Web, Mobile, Desktop và cả hệ thống nhúng. Thực sự là Flutter rất khủng, điểm khó của Flutter là dùng ngôn ngữ Dart.

Một điều cần lưu tâm là động thái Alibaba chuyển giao Weex cho tổ chức Apache, và đồng thời tạo ra ứng dụng “Xianyu” bằng Flutter, với 50M download (showcase của Flutter ngay trên trang chủ của Flutter). Không chắc là Alibaba chuyển qua sử dụng Flutter hẳn luôn hay không, nhưng rõ ràng họ không mặn mà gì với Weex cả.

Weex hoàn toàn bị lép vế so với Flutter!

React Native Windows

React Native Windows (so sánh Vue.js và React.js)
React Native Windows

React Native có thể được sử dụng cho việc phát triển ứng dụng trên Windows với React Native Windows được hỗ trợ chính thức bởi Microsoft. Bạn có thể sử dụng React Native Windows để phát triển cho toàn bộ hệ sinh thái của Microsoft: desktop, tablet, xbox. Còn gì tuyệt vời hơn?

Ngoài ra, Microsoft còn có nền tảng Xamarin cũng mạnh mẽ không kém. Việc hỗ trợ React Native cho Windows trong khi đã có Xamarin là bước đi thông minh của Microsoft, vì hiện tại Javascript đang rất nóng và có nhiều lập trình viên theo đuổi hơn bao giờ hết.

Nền tảng di động của Vue.js bị phân tán

Weex - Vue.js - NativeScript (so sánh Vue.js và React.js)
Weex – Vue.js – NativeScript

Không hỗ trợ chính thức nền tảng phát triển ứng dụng di động mà còn có sự phân mảnh. Bản thân trong chính Weex cũng hỗ trợ cả Vue.js và Rax (React.js), nghĩa rằng Vue.js được hỗ trợ để trong Weex, không có Vue.js thì Weex vẫn sống. Đây thực sự là điều đáng lưu ý, khi một nền tảng bị phân mảnh thì rõ ràng cộng đồng phát triển không mạnh, không tập trung.

Ngoài Weex thì còn có Vue-Native, được tạo ra bởi nhóm GeekyAnts, nhóm đã tạo ra NativeBase cho React Native cũng khá nổi tiếng. Nhưng có lẽ Vue-Native cũng còn khá nhỏ, để có thể tạo nên đột phá, hay làm được gì. Và bản chất Vue-Native là dựa trên React Native và dùng Vue.js để viết codekết nối. Theo mình đây là cách cực kỳ nguy hiểm, không nên đi theo. Vì trong khi phát triển chắc chắn sẽ có vấn đề với React Native mà dựa trên đó là React, như vậy bạn có thể sẽ phải học cả 3 thứ: Vue, React, React Native.

NativeScript cũng là hình thái lai, khi dùng được cả Vue.js và Angular.js, cũng không phải bắt buộc dùng Vue.js nên nhận định cũng như Weex, không có Vue.js thì NativeScript vẫn sống.

Hơn nữa, như đã phân tích ở trên về tính stable của Vue.js, cái gốc đã không thực sự ngon, thì các nền tảng cho di động hay native cũng khó có thể có cuộc cách mạng được. Với lý do phân mảnh thì việc củng cố và phát triển nền tảng di động với Vue.js không khả quan cho lắm.

Rủi ro từ quan hệ Mỹ – Trung

Không thể không nói điều này, vì các đóng góp cho Vue.js cũng có phần lớn đến từ Alibaba với Weex do Alibaba tạo ra. Và các sản phẩm dùng Weex đa phần là của Trung Quốc, xem Ai đang sử dụng Weex.

Mặc dù Weex đã chuyển giao sang cho tổ chức Apache, tuy nhiên chắc chắn sự đóng góp vào Weex sẽ đến phần lớn từ Trung Quốc, và tất nhiên cũng sẽ được sử dụng phần lớn từ Trung Quốc. Với quan hệ của Mỹ Trung xấu đi, các vấn đề liên quan đến công nghệ, học thuật của Trung Quốc đều bị hạn chế. Nó có thể là việc sử dụng Weex trên thế giới, cũng như sự đóng góp của cộng đồng trên toàn thế giới vào Weex có khả năng bị ảnh hưởng. Flutter cũng được lập trình viên Trung Quốc quan tâm và đóng góp, ví dụ là https://github.com/alibaba/flutter-go. Tuy nhiên, vị thế của Flutter khác hoàn toàn do Google chống lưng.

So sánh Vue.js và React.js trong mảng phát triển ứng dụng di động và native có kết quả quá khập khiễng khi kết quả nghiên hoàn toàn về React.js.

Winner: React.js

Khi nào nên sử dụng Vue.js

Nếu theo phân tích ở trên thì phần thắng nghiên hẳn về React.js với tỉ số 3-0. Tất nhiên, đây là góc nhìn có thể khác với nhiều người khác, nhưng mình nghĩ các con số thống kê không hề nói dối. Tuy nhiên, Vue.js có những điểm mạnh riêng mà mình cũng rất thích. Hãy cùng phân tích xem Vue.js phù hợp như thế nào nhé.

Như mình đã phân tích khá kỹ ở phần di động, native ở trên bạn không nên sử dụng Vue.js cho mục đích phát triển ứng dụng di động. Do vậy nhiệm vụ còn lại khả dĩ cho Vue.js là mảng web mà thôi.

Khi so sánh Vue.js và React.js, dễ dàng nhận ra điểm mạnh của Vue.js hơn React.js là có thể sử dụng template và cả JSX. JSX có một điểm yếu khá lớn là phải biết javascript, rồi cách build khá phức tạp. Như vậy đã hạn chế 1 lượng lớn frontend developer, nhất là các bạn chỉ chuyên cắt html từ photoshop và làm template. Team mình từng thất bại 1 dự án sử dụng React.js vì vấn đề này. Từ design, cắt ra html, rồi import vào react là một quá trình phức tạp, tình huống là bạn code react.js không giỏi trong việc cắt html, hoặc trong dự án tách biệt giữa bạn mockup html và bạn code javascript:

  • Có 1 khoảng cách khá lớn về việc kỹ năng cắt html và kỹ năng code javascript, nó có vẻ là có điểm chung nhưng thực tế không như kỳ vọng. Bạn cắt html không biết nhiều về javascript, cũng như ngược lại.
  • Mất tài nguyên con người với việc thay đổi html/css trong JSX, phải sử dụng 2 người. Vì với Styled-component thì mỗi component nắm giữ style riêng. Nên khi thay đổi html, css thì cũng phải sửa lại component.

Việc sử dụng Vue.js khá dễ dàng vì có thể tách biệt được phần template và phần logic, sử dụng Vue.js ở cách này không khác gì cách dùng jQuery cả. Với vue.js thì template mockup và code javascript sẽ nằm chung trên 1 repo chứ không cần phải tách ra, và có thể 2 phía html mockup và javascript developer có thể làm chung trên cùng tập tin.

Bỏ qua sự so sánh về tốc độ, mình thực sự không quan tâm lắm, trừ khi quá chênh lệch. Và các vấn đề về kỹ thuật chi tiết giữa 2 nền tảng, thì có thể sử dụng Vue.js tốt nếu:

  • Bạn không hề có ý định làm ứng dụng di động, ứng dụng native với Vue.js
  • Team bạn thiên về graphics design và phụ thuộc khá nhiều vào html mockup.
  • Làm phần dashboard, web application

Fullstack Station Tips

React từ 16.8 có Reack Hooks rất lợi hại, có thể thay đổi về cách viết React nhiều trong tương lai gần. React Hooks sẽ giúp cho dự án không phụ thuộc vào Component Class mà vẫn có các tính năng hay, tiện lợi của component class. Dù Vue.js cũng rất tuyệt để làm sản phẩm, nhưng với những ưu điểm của React, độ phổ biến của hệ sinh thái kết hợp với React Hooks sẽ tạo ra sức mạnh đáng kể cho React.js

Sự so sánh Vue.js và React.js, hay chọn lựa chỉ có giá trị trong dự án nhất định, còn về con đường lập trình thì mình nghiêng hẳn hoàn toàn về React.js.

Hi vọng bài viết có ích cho những bạn đang còn lăn tăn giữa việc chọn React.js hay Vue.js, và mong có ý kiến phản biện từ các bạn đã sử dụng Vue.js.

The post So sánh Vue.js và React.js: một cái nhìn toàn diện appeared first on Fullstack Station.

]]>
https://fullstackstation.com/so-sanh-vue-js-va-react-js-mot-cai-nhin-toan-dien/feed/ 7
Javascript làm được gì? https://fullstackstation.com/javascript-lam-duoc-gi/ https://fullstackstation.com/javascript-lam-duoc-gi/#comments Thu, 19 May 2016 14:27:58 +0000 https://www.businesscard.vn/blog/?p=488 Lời nói đầu Trước khi đọc bài viết, mình xin khẳng định một điều: Javascript là ngôn ngữ lập trình full stack duy nhất cho đến thời điểm hiện nay, Javascript làm được nhiều thứ hơn bạn tưởng từ web client đến server, từ desktop đến mobile ….và vì có lẽ cũng không ai rãnh […]

The post Javascript làm được gì? appeared first on Fullstack Station.

]]>
Lời nói đầu

Trước khi đọc bài viết, mình xin khẳng định một điều: Javascript là ngôn ngữ lập trình full stack duy nhất cho đến thời điểm hiện nay, Javascript làm được nhiều thứ hơn bạn tưởng từ web client đến server, từ desktop đến mobile ….và vì có lẽ cũng không ai rãnh rỗi để tạo ra ngôn ngữ lập trình đã thống trị thế giới web (phần máy khách), do vậy hiển nhiên Javascript là vua của ngôn ngữ lập trình full stack, vì không có đối thủ :). Ngôn ngữ lập trình full-stack hoàn toàn khác với lập trình viên full-stack, tuy có phần giao nhau nhưng phía cạnh đề cập khác nhau, ngôn ngữ lập trình full-stack là…ngôn ngữ mà như tiếng Anh thôi, rất phổ dụng trên thế giới, rất nhiều người có thể giao tiếp với bạn, nhưng không phải tất cả họ đều chào đón bạn, vì mỗi quốc gia, dân tộc, bộ tộc, khu vực… đều tự hào về hệ thống ngôn ngữ của họ. Javascript là độc tôn của thế giới web phần máy khách thì đã rõ, còn ở các mảng khác như máy chủ, ứng dụng máy tính, điện thoại di động thì hãy nhường những ngôi vị cao nhất cho những anh chàng tương ứng, còn Javascript chỉ có mặt và có mặt khắp nơi!

Chốt lại, muốn đi du lịch nhiều nơi một cách dễ dàng thì học tiếng Anh, muốn viết được nhiều thể loại ứng dụng, web thì học Javascript, chúng ta cùng bắt đầu xem Javascript có thể làm được gì nhé! Ít nhất là trong năm 2016 này: Xu hướng lập trình 2016!

Tôi muốn lập trình web phía máy khách

Javascript có thể làm được frontend

Không những riêng bạn mà tất cả lập trình viên web đều có sử dụng Javascript ở một mức độ nào đó, không hoàn toàn 100% các website trên thế giới có sử dụng Javascript, tuy nhiên mình cá là bạn đọc bài viết này không phải để viết ra các trang web đó, mà nếu có thì cũng không nên đọc bài này :). Cũng có thể là bạn đã biết, hoặc nghe các nền tảng như: JQuery, AngularJS, ReactJS, BackboneJS, EmberJS, …hoặc các front-end framework như Bootstrap, Foundation, UIKit…đều có sử dụng Javascript. Tất cả những phần liên quan đến người dùng như tạo hiệu ứng, phần hiển thị đến tương tác với người dùng đều cần đến Javascript, tất cả những gì liên quan đến web nói chung, và frontend nói riêng đều dùng Javascript.

Tôi muốn lập trình trò chơi 3D

3D trên nền tảng web

Bạn nhìn 3D sau: Threejs demo

Hình 3D trên được dựng bởi ThreeJS, và việc tạo ra ứng dụng webgame không còn quá phức tạp. Kết hợp giữa HTML5, CSS3 và Javascript để tạo ra ứng dụng 3D chỉ giới hạn bằng trí tưởng tượng và khả năng của bạn.

Ngôn ngữ kịch bản cho Unity3D

JavaScript cho unity3d

Unity3D dùng Javascript để viết kịch bản còn được gọi là UnityScript. Với Unity3D, bản chất làm game sẽ thiên về kịch bản là chính, còn phần hiển thị, và các model đã có sẵn (miễn phí hoặc trả tiền), vậy nên nếu bạn biết Javascript thì có thể làm game 3D là vậy. Như vậy là bạn có thể làm game có tính độ hoạ phức tạp cao, điều mà webgame khó đạt được, cũng như khó có độ mượt mà trên điện thoại di động cũng như máy tính.

Tôi muốn lập trình web phía máy chủ

Javascript cho máy chủ khá mới so với các ngôn ngữ lập trình web cũng như lập trình ở máy chủ khác. Với Nodejs rất mạnh trong sản phẩm có tính chất trực tuyến như ứng dụng trò chuyện trực tiếp, trò chơi trực tuyến hay làm việc nhóm. So với các ngôn ngữ khác để làm được ứng dụng trực tuyến thì khá là khó khăn. Đồng thời Nodejs cung cấp khả năng kết nối cho hàng chục ngàn user cùng lúc, nếu cùng cấu hình máy chủ tương tự thì điều đó là không thể đối với PHP, Java, Python, .Net.

Những framework chạy trên Nodejs nổi tiếng trong lĩnh vực này là: Meteor, SailsJS, Hapi.JS, Socket.IO, Express.JS, Mojito, Derby, Mean.JS, Koa.JS, Total.JS. Trong đó mình có cái nhìn thiện cảm với Meteor vì cung cấp sẵn nhiều tiện ích, học dễ và cộng đồng lớn, việc viết ứng dụng tính bằng ngày. Đơn cử tính dễ học là bạn có thể làm theo ứng dụng To Do hoàn thành trong vòng 2~3h đồng hồ với khả năng tính hợp dễ dàng với Cordova/Phonegap để tạo ra ứng dụng trên điện thoại di động, Meteor hướng tới tính hoàn thiện đơn nhất chỉ với Javascript. Tiếp đó là SailsJS có điểm mạnh là khả năng tạo code giúp cho thời gian phát triển ứng dụng cũng rất nhanh, Hapi thì có thế mạnh về API, Socket.IO thì cái tên cũng đủ nói lên về điểm mạnh về kết nối bằng socket. ExpressJS và KoaJS thì khá là gọn nhẹ nhưng cung cấp đủ mạnh các thành phần để tạo ra ứng dụng web, nếu đã nắm rõ thì có thể ra các framework khác dễ dàng, vì đa phần các framework khác cũng đều có sử dụng 2 anh chàng này.

Tôi muốn lập trình ứng dụng điện thoại di động – Hybrid

Ứng dụng hybrid giúp cho lập trình viên web dễ dàng tạo ra ứng dụng cho điện thoại di động hoàn toàn trên nền tảng web: Javascript, HTML và CSS, được đóng gói bởi Cordova/Phonegap tạo ra ứng dụng chạy trên trên các nền tảng iOS, Android và Window, Blackberry…cho cả diện thoại di động, máy tính bảng, website, ứng dụng máy tính (xem phần tiếp) chỉ với một mã nguồn duy nhất.

sencha-touch-hero

Những nền tảng nổi tiếng cho thể loại này là IonicFramework dựa trên Angular, Mobile Angular UI cũng dựa trên Angular, Intel XDK dựa trên JQuery Mobile, Appcelerator Titanium, Sencha Touch, KendoUI .

Trong phân khúc này, Ionic Framework có vẻ trội nhất vì dựa trên AngularJS một cách chặt chẽ, đồng thời cũng cung cấp nhiều khả năng, công cụ để phát triển ứng dụng di động một cách dễ dàng, bên cạnh đó là Sencha Touch cũng rất mạnh, nếu bạn theo hướng AngularJS thì nên chọn Ionic Framework.

Javacript làm được gì – Phần 1 đến đây tạm ngưng, phần 2 sẽ nói về ứng dụng cho điện thoại di động Native (React Native là tương lai của ứng dụng di động?), về ứng dụng trên máy tính đa nền tảng, phần mở rộng cho trình duyệt web, soạn thảo văn bản (Text editor) và vạn vật kết nối (Internet of things), các bạn đăng ký nhận tin để đọc bài mới nhất nhé.

The post Javascript làm được gì? appeared first on Fullstack Station.

]]>
https://fullstackstation.com/javascript-lam-duoc-gi/feed/ 2
Điều gì khiến Meteor Js 1.3 trở nên đặc biệt? https://fullstackstation.com/meteor-js-1-3-dieu-gi-khien-tro-nen-dac-biet/ https://fullstackstation.com/meteor-js-1-3-dieu-gi-khien-tro-nen-dac-biet/#comments Tue, 05 Apr 2016 02:14:45 +0000 https://www.businesscard.vn/blog/?p=409 Meteor Js là gì? Meteor Js là nền tảng phát triển ứng dụng web thời gian thực fullstack, được viết cho cả client và server chỉ bằng ngôn ngữ Javascript. Được ra mắt từ năm 2012 và hiện tại đã đạt 33k stars trên Github, quá đỉnh đó chứ! Giá mà… Mình viết bài viết […]

The post Điều gì khiến Meteor Js 1.3 trở nên đặc biệt? appeared first on Fullstack Station.

]]>
Meteor Js là gì?

Meteor Js là nền tảng phát triển ứng dụng web thời gian thực fullstack, được viết cho cả client và server chỉ bằng ngôn ngữ Javascript. Được ra mắt từ năm 2012 và hiện tại đã đạt 33k stars trên Github, quá đỉnh đó chứ!

Giá mà…

Mình viết bài viết này chỉ dựa sau khi có kinh nghiệm nghiên cứu Meteor 1 thời gian, và đã quyết định chọn Meteor bắt đầu dự án lớn chỉ sau 1/2 ngày làm Todo app theo hướng dẫn! Giá mà mình có thể biết Meteor sớm hơn, đây là câu nói mình thốt ra sau khi biết Meteor :). Vậy Meteor 1.3 có gì thú vị?

Meteor Js 1.3 và những điều thú vị

Được viết hoàn toàn bằng ES2015(ES6)

ES2015 giúp cho việc viết code Javascript trở nên rõ ràng, có cấu trúc (class, let, const, arrow function, object destructing…), mặc dù chỉ mới ra mắt từ giữa 2015, nhưng với những tính năng mạnh mẽ khiến Meteor viết toàn bộ code lại qua ES2015, mang đến một hệ thống rõ ràng, uyển chuyển hơn. (Xem thêm ES2015 là gì)

Sử dụng NPM để cài đặt các thư viện

Meteor sử dụng hệ thống quản lý thư viện, thành phần mở rộng riêng của Meteor. Thật ra bản chất bên trong cũng đã có sử dụng NPM rồi, nhưng cần bọc thêm một lớp của Meteor bên ngoài để cài đặt phù hợp với cấu trúc của Meteor. Việc Meteor hỗ trợ cài NPM một cách riêng lẻ không phải mục đích để thay thế hệ thống quản lý gói này. Tuy nhiên, việc hỗ trợ NPM một cách riêng lẻ khiến cho việc viết code trở nên linh hoạt hơn vì NPM có số lượng package vô cùng phong phú. Nhưng bạn cũng cần chú ý là việc sử dụng NPM khiến việc bảo trì tính tương thích với các gói của Meteor cũng trở nên vất vả hơn nhé.

React

Thật ra điều này không mới, Meteor hỗ trợ AngularJs và ReactJs thì có từ 1.2 rồi nhưng từ 1.3 sẽ khác, một cách không chính thức bộ template engine Blaze sẽ bị thay thế bằng ReactJs. Rõ ràng ReactJs sẽ có ngôi vương cho việc thay thế phần View trong mọi framework, nên việc sử dụng chính React sẽ giúp cho ứng dụng của bạn linh hoạt hơn vì có tính tái sử dụng rất cao, sau này bạn có thể dùng component React cho một dự án khác một cách độc lập không phụ thuộc vào Meteor, đó là một ý tưởng rất tốt đúng không nào? (Blaze nay đã trở thành 1 gói riêng chứ không còn gắn kèm chung với Meteor nữa)

Application testing

Không phải tới 1.3 mới có test đâu, nhưng bản 1.3 hỗ trợ cả unit test và integration. Unit test (meteor test) thì test cho từng thành phần riêng lẻ, còn integration test (meteor test –full-app) sẽ nạp toàn bộ code của ứng dụng và giúp cho bạn test từng tiến trình để chắc chắn các thành phần (đã test unit) tích hợp ngon lành với nhau.

Cải thiện Cordova

Cập nhật các gói Cordova lên phiên bản mới nhất (Cordova 6.0.0, Cordova iOS 4.1.0, Android 5.1.1). Meteor đã viết lại lớp Cordova giúp dễ dàng kiểm soát lỗi trong ứng dụng iOS và Android hơn, hơn nữa còn có chế độ Hot Code Push có thể quay lại phiên bản trước nếu phiên bản hiện tại bị lỗi (Việc này không cần thông qua App Store hoặc PlayStore, bạn có thể xem thêm Microsoft CodePush)

Cải thiện minimongo

Do tính năng cần đồng bộ dữ liệu giữa server và client nên việc cải thiện minimongo sẽ giúp cho tốc độ của ứng dụng tăng lên đáng kể.

Kết luận

Để viết ứng dụng có tính chất Realtime thì React + Meteor Js 1.3 quả là một sự kết hợp hoàn hảo hơn bất kỳ bộ nào khác khi React quản lý phần view và phần còn lại là Meteor đảm bảo fullstack! Ngoài ra, vì AngularJs là một framework hoàn chỉnh nên việc sử dụng chung với Meteor cũng là một framework sẽ khiến một lượng code không cần thiết cùng tồn tại. Nếu bạn vẫn chưa biết tí gì về Meteor, hãy bỏ ra 2 giờ để ngâm cứu cái Todo Example (React) bạn sẽ thấy thích thú với tốc độ viết ra ứng dụng web realtime.

Cập nhật 2017: sau một số dự án sử dụng Meteor + React, mình nhận thấy Meteor không còn phù hợp vì quá trình phát triển gặp vấn đề về tốc độ build, thiếu hỗ trợ HMR (Hot module replacement). Mặc dù một số tính năng tuyệt vời của Meteor là không thể bàn cãi, nhưng đối với những dự án lớn, tốc độ build làm cho lập trình viên cảm thấy mệt mỏi, mình khuyến nghị sử dụng hệ sinh thái mới dựa trên GraphqlNext.js để đạt nhiều mục đích, hiệu quả hơn.

The post Điều gì khiến Meteor Js 1.3 trở nên đặc biệt? appeared first on Fullstack Station.

]]>
https://fullstackstation.com/meteor-js-1-3-dieu-gi-khien-tro-nen-dac-biet/feed/ 6
Xu hướng công nghệ lập trình web và mobile 2016 https://fullstackstation.com/xu-huong-cong-nghe-lap-trinh-web-va-mobile-2016/ https://fullstackstation.com/xu-huong-cong-nghe-lap-trinh-web-va-mobile-2016/#comments Thu, 31 Dec 2015 17:01:50 +0000 https://www.businesscard.vn/blog/?p=34 Xu hướng công nghệ lập trình Xu hướng lập trình thì thường xoay quanh ngôn ngữ lập trình, tuy nhiên trong bài viết này mình tập trung nói về các công nghệ giúp cho việc lập trình dễ dàng hơn như cải thiện tốc độ, chất lượng code cũng như dễ dàng cộng tác, làm […]

The post Xu hướng công nghệ lập trình web và mobile 2016 appeared first on Fullstack Station.

]]>
Xu hướng công nghệ web 2016
Xu hướng công nghệ lập trình web và mobile 2016

Xu hướng công nghệ lập trình

Xu hướng lập trình thì thường xoay quanh ngôn ngữ lập trình, tuy nhiên trong bài viết này mình tập trung nói về các công nghệ giúp cho việc lập trình dễ dàng hơn như cải thiện tốc độ, chất lượng code cũng như dễ dàng cộng tác, làm việc nhóm. Những vấn đề về xu hướng công nghệ lập trình sẽ giúp bạn nâng cao khả năng lập trình cũng như chất lượng dự án.

Môi trường phát triển

  • [Môi trường chạy code, build] VagrantDocker: mặc dù sự phát triển rất mạnh của docker trong năm 2015, nhưng với sự khác biệt giữa Docker và Vagrant thì mỗi môi trường đều sử dụng cho từng mục đích phù hợp. Một số bạn vẫn còn sử dụng máy cá nhân để cài đặt môi trường phát triển vẫn ổn, tuy nhiên sẽ rất khó cộng tác với các thành viên khác trong nhóm vì không thông nhất được môi trường phát triển.  Nếu bạn vẫn chưa sử dụng 1 trong 2 công nghệ này, thì hãy tìm hiểu và áp dụng càng sớm càng tốt nhé. Mình có xu hướng ủng hộ Docker hơn vì tính đa năng và dễ làm việc cộng tác.
  • [Task Runner/Automation] GruntGulp: Cả 2 công cụ này với hàng ngàn plugin hỗ trợ giúp cho việc phát triển lập trình dễ dàng nhanh chóng khi tự động debug, test, build. Mình thiên về Gulp vì việc cấu hình tương tự như ngôn ngữ lập trình chứ không phải Over Configure phức tạp của Grunt.
  • [IDE] Atom, Sublime Text: trước đây mình sử dụng khá nhiều IDE cho việc phát triển, lập trình web như Aptana Studio, Zend Studio, PHP Storm, Text Wrangler nhưng đều không đáp ứng nhu cầu công việc. Hoặc là nặng nề, chậm chạp hoặc thiếu plugin cần thiết, nhưng với Sublime Text thì mình hoàn toàn làm chủ được việc lập trình, Atom thì có xu hướng phát triển mạnh trong năm 2015 vừa rồi tuy khá mạnh mẽ nhưng do còn mới nên lượng plugin không phong phú bằng. Điểm mạnh của Atom là open source/free, nên mình dự đoán khi cộng đồng phát triển nhiều plugin thì sẽ có nhiều lập trình viên sử dụng hơn trong năm 2016 này.

Frontend Javascript Framework

  • Angular Js/2[Beta]: Với lượng fan cực khủng từ 1.x, nên cùng những tính năng nổi trội từ phiên bản 2: nhanh và uyển chuyển, nâng cấp được từ 1.x, có thể render từ server, hỗ trợ TypeScript (chính) & Dart sẽ giúp cho AngularJs/2 tiếp tục củng cố thị phần của mình.
  • React Js: Được sử dụng cho các sản phẩm chính thức của các tên tuổi lớn Facebook, Instagram, Mapbox, Box, Paypal, Reddit… [Xem thêm tại đây], phải nói rằng sự phát triển của ReactJs nhanh hơn rất nhiều so với AngularJs thời đầu [Mặc dù chỉ là phần V trong MVC]. Theo cá nhân mình, ReactJs sẽ tiếp tục phát triển mạnh mẽ trong các năm tiếp theo. Đọc thêm bài React là quyết định của doanh nghiệp, không hẳn là sự lựa chọn do công nghệ.
  • Polymer Project: không nổi tiếng như 2 anh chàng trên, nhưng với xu hướng lập trình web component, Polymer sẽ dần có chỗ đứng vì bản chất là component sẽ giúp cho nó hoạt động 1 cách độc lập không phụ thuộc các frontend framework khác và đặc biệt là hỗ trợ hoàn toàn Material Design

Ngôn ngữ lập trình

  • Javascript: với hi vọng là ngôn ngữ của tất cả, điều này chắc chắn gây tranh cãi :), nhưng… Tuy nhiên với sự ra đời Ecma Script 6(ES6) trong năm vừa rồi, đã đưa javascript lên đẳng cấp mới với những tính năng mới lạ như Arrow, Class, xử lý chuỗi dễ dàng, giá trị tham số (mặc định, không xác định, thông qua phần từ của mảng), Promise, Map, Module… . Những đặc tính của Javascript được sử dụng cho cả browser và server với Nodejs/V8 giúp cho việc sử dụng lại code chung logic cho cả browser và server, giúp cho việc phát triển ứng dụng web chạy nhanh, thời gian phát triển, lập trình nhanh. Với sự hỗ trợ từ V8/V8Js cho PHP, Python… việc thực thi javascript từ server không còn là mảnh đất riêng của Nodejs nữa!
  • PHP 7: được chờ đợi nhất trong năm 2015 của dân lập trình PHP, việc ra đời chính thức phiên bản 7 đã giúp ngôn ngữ PHP nâng cao vị thế với các ngôn ngữ phát triển web như Rails, Python, Java, Nodejs, .Net, … . Với việc thay đổi cấu trúc khai báo hàm (Scalar Type Hints & Return Types) giúp cho PHP thoát kiếp “ngôn ngữ không chặt chẽ”, cùng với sự cải thiện tốc độ gấp đôi so với PHP 5.x đã khiến mình không còn khái niệm nghiên cứu thêm ngôn ngữ khác nhanh hơn nữa. Tuy nhiên một số PHP Framework có thể mất thêm 1 thời gian ngắn nữa để hoàn toàn tương thích với PHP7. Đối với các phiên bản PHP Framework còn hỗ trợ PHP 5.3 thì khả năng sẽ không chạy tốt trên PHP 7, vì PHP 7 đã loại bỏ các hàm deprecated từ PHP 5.3.
  • Swift 3: Sự phát triển ngôn ngữ lập trình iOS mới này sẽ bước lên phiên bản 3 dự kiến vào mùa thu 2016. Với Swift, rõ ràng việc phát triển các sản phẩm cho iOS tiện lợi và nhanh chóng hơn rất nhiều. Mặc dù Objective-C chưa có thông báo hồi kết, nhưng với những đặc tính nổi trội của Swift và cũng như động thái phát triển lên phiên bản 3 đã cho thấy Apple đang tập trung vào Swift rất nhiều. Nếu bạn vẫn đang còn sử dụng Objective-C để phát triển cho iOS, hãy dành thời gian nghiên cứu xu hướng Swift!
  • Sự phát triển ổn định của Python 3, Rails 4, Java thì không có gì đáng chờ đợi trong năm 2016 cả!

React Js/React Native [Mobile/Web/Desktop and …smartWatch or smartTv !!!]

Mình chia React Native ra thành một mục riêng vì đây không phải là một ngôn ngữ lập trình mà là một nền tảng để phát triển sản phẩm di động “native”, web, desktop và… bằng Javascript. Trước đây, để phát triển sản phẩm mobile [iOS/Android] “hybrid” bằng javascript có thể dùng Phonegap/Cordova với một số framework nổi tiếng như Ionic Framework hay Onsen UI, hoặc jQuery Mobile. Tuy nhiên, điểm yếu của Hybrid là tốc độ chậm vì phải thông qua Phonegap/Cordova và không hỗ trợ một vài tính năng native (Ví dụ: với Phonegap/Cordova phải mở Apple Map trong iOS, với React Native thì có thể chạy Apple Map ngay trong chính ứng dụng).

Tất nhiên, React Js và React Native là khác nhau, nhưng sự kết hợp của 2 framework này giúp chúng ta có thể build ứng dụng cho Web, Desktop [Node Webkit], Mobile Native chỉ bằng Javascript, với việc dùng lại code tới 80%, đúng như câu “learn once, write anywhere.” (học một lần, viết mọi nơi). Bạn có thể tham khảo dự án này: Calculate for web, mobile, desktop.

Kết luận

Với những xu hướng công nghệ lập trình web trên có thể cho những lập trình fullstack có thể kiếm thêm thu nhập cho những dự án riêng ngoài thời gian làm việc cho công ty. Riêng mình thì đặc biệt quan tâm nhóm javascript với nhóm “React Js/React Native/Nodejs/Node Webkit”. Nhóm này có thể build ra 1 ứng dụng từ A->Z chỉ với Javascript, đúng với chủ trương của full stack: càng đơn giản càng kiếm được nhiều.

Còn bạn có những xu hướng lập trình gì để chờ đợi trong 2016, hãy chia sẽ với mọi người nhé. Fullstack Station sẽ cố gắng cập nhật những công nghệ fullstack cho các bạn nhanh nhất có thể.

The post Xu hướng công nghệ lập trình web và mobile 2016 appeared first on Fullstack Station.

]]>
https://fullstackstation.com/xu-huong-cong-nghe-lap-trinh-web-va-mobile-2016/feed/ 1