7 Framework JavaScript tốt nhất để tung hoành năm 2020

Trong cuộc chiến trình duyệt đầu tiên, Brendan Eich đã tạo JavaScript như một ngôn ngữ kịch bản để thao túng DOM của Trình duyệt Netscape . Trước đó, JavaScript chủ yếu được sử dụng để phát triển Front-End Web. Trong thập kỷ qua, Node.js đã trở nên phổ biến tăng vọt. Sự thành công và phổ biến của Node.js đã biến Javascript thành ngôn ngữ của cả 2 phía client và server gắn liền với sự bùng nổ về số lượng và chất lượng của các framework javascript.

Nếu bạn muốn phát triển ứng dụng back-end dựa trên JavaScript, bạn nên chọn framework nào? Ở đây tôi liệt kê 7 Framework JavaScript tốt nhất dựa trên các tiêu chí sau:

Cực kỳ phổ biến dựa trên các trang web đáng tin cậy ( GitHub , Xu hướng NPM ).
Chính thống.
Được dùng trong các dự án lớn.
Tính ổn định.

1. Express

Express là khung Ứng dụng Web nổi tiếng nhất dựa trên Node.js, chủ yếu được sử dụng để phát triển Ứng dụng web và API REST. Tác giả ban đầu, TJ Holowaychuk , được lấy cảm hứng từ framework Sinatra .

5 tính năng chính

Express là framework JavaScript Server Side tiêu chuẩn thực tế.
Express là khung Ứng dụng hoàn chỉnh với: middleware, routing, template.
Express hỗ trợ mô hình MVC với hệ thống View hỗ trợ 14+ templating engines.
Express cũng hỗ trợ routing mạnh mẽ.
Express cũng hỗ trợ content

Cài đặt

Cài đặt Express rất đơn giản. Khi bạn đã cài đặt Node.js, bạn có thể cài đặt express bằng lệnh đơn sau:

npm install express --save

Ví dụ ứng dụng Hello World

Đây là một ứng dụng mẫu sử dụng Express:

const express = require('express')
const app = express()
const port = 3000
app.get('/', (req, res) => res.send('Hello World!'))
app.listen(port, () => console.log(`Example app listening on port ${port}!`))

Ứng dụng này tạo web server trên cổng 3000 ở URL gốc ( /) . Đối với mọi path khác, nó sẽ chuyển đến trang 404 Không tìm thấy .

Độ phổ biến

Express là framework JavaScript Server Side phổ biến nhất và được chấp nhận rộng rãi nhất theo github.

framework javascript express — Nguồn: GitHub

Theo khảo sát của “State of JavaScript”, đây là framework JavaScript số một trong ba năm liên tiếp (2017, 2018, 2019):

Khảo sát của StackOverflow Developer đã xếp hạng Express phổ biến nhất năm 2019:

Sự phổ biến và ứng dụng của Express thể hiện rõ từ các xu hướng NPM khi nó bỏ xa tất cả các framework khác:

2. Next.js

framework javascript next.js — Nguồn: nextjs

Một nhóm các kỹ sư từ các công ty phần mềm Hà Lan Zeit đã tạo ra Next.js như một Web Framework end-to-end trên nền Node.js . Next.js cung cấp cả Server-Rendered và Static Web sites cho Web, Desktop, Mobile.

5 tính năng chính:

Next.js được xây dựng dựa trên thư viện Web nổi tiếng là React.
Next.js hỗ trợ Server-Side rendering , SEO và khởi động nhanh.
Giống như React, chỉ cần build 1 lần là chạy ở mọi nơi, tức là Next.js có thể chạy trên nền Web, Mobile và Desktop.
Next.js cũng cung cấp tính năng automatic code splitting và filesystem-based routing.
Nó cũng hỗ trợ data fetching và built-in CSS.

Cài đặt

Next.js yêu cầu Node.js phiên bản 10 trở lên. Cài đặt như lệnh bên dưới:

npm install next react react-dom --save

Bây giờ, hãy mở file package.json và thêm đoạn sau:

"scripts": {
  "dev": "next",
  "build": "next build",
  "start": "next start"
}

Ví dụ ứng dụng Hello World

Sau khi cài đặt Next.js hoàn tất, tạo thư mục ‘pages’ và file ‘Pages / index.js’ với nội dung sau:

function HomePage() {
  return <div>Hello World!</div>
}
export default HomePage

Chạy lệnh npm run dev để khởi động local web server

Truy cập http://localhost:3000để xem ứng dụng của bạn.

Độ phổ biến

Theo sao GitHub, Next.js là framework phổ biến thứ hai. Nó cũng có số lượng người đóng góp cao nhất, như hình dưới đây:

3. Meteor

framework javascript meteor — Nguồn: Meteor

Meteor cung cấp đầy đủ tính năng để xây dựng các ứng dụng end-to-end (frontend-to-backend) cho nền tảng web / di động / máy tính để bàn ( Fullstack ) .

5 tính năng chính

Meteor là framework javascript cung cấp đầy đủ tính năng cần thiết để xây dựng 1 ứng dụng web hoàn chỉnh từ Frontend đến Backend.
Để phát triển front-end, nó có template engine riêng. Nhưng Meteor cũng có thể tích hợp các thư viện nổi tiếng khác như Angular / React.
Nó là cross-platform framework nên có thể phát triển một ứng dụng cho Web, Mobile và Desktop.
Meteor xây dựng sẵn tính năng tích hợp với MongoDB và React giúp dev tiết kiệm công sức nhất.
Đây là một nền tảng Isomorphic chia sẻ cùng một API ở phía client và phía server.

Cài đặt

Trên máy Linux / OSX, chạy lệnh sau để cài đặt bản mới nhất của Meteor:

curl https://install.meteor.com/ | sh

Trên Windows, trước tiên hãy cài đặt Chocolatey . Sau đó chạy lệnh này quyền Administrator trên command line:

choco install meteor

Ví dụ ứng dụng Todo

Sau khi đã cài đặt Meteor, chạy lệnh sau để khởi tạo project mới:

meteor create simple-todos

Lệnh này sẽ tạo một thư mục mới được gọi simple-todosvới tất cả các files mà ứng dụng Meteor cần:

client/main.js        # a JavaScript entry point loaded on the client
client/main.html      # an HTML file that defines view templates
client/main.css       # a CSS file to define your app's styles
server/main.js        # a JavaScript entry point loaded on the server
test/main.js          # a JavaScript entry point when running tests
package.json          # a control file for installing npm packages
package-lock.json     # describes the npm dependency tree
node_modules/         # packages installed by npm
.meteor/              # internal Meteor files
.gitignore            # a control file for git

Để chạy ứng dụng mới được tạo:

cd simple-todos
meteor

Mở trình duyệt web của bạn http://localhost:3000để xem ứng dụng đang chạy.

Độ phổ biến

Theo GitHub, đây là framework JavaScript phía server phổ biến thứ 3:

4. Koa

Các thành viên trong core team của Express.js ( TJ Holowaychuk, Jonathan Richard Ong ) đã tạo ra Koa như một middleware framework chuyên dụng cho Web Applications và APIs đáp ứng các tiêu chí “lightweight, modern, expressive”.

5 tính năng chính:

Koa có Core nhẹ hơn, nhỏ hơn, không bao gồm bất kỳ package trung gian nào.
Koa là mô-đun và cung cấp các middlewares giúp module hoá và dễ dàng cài cắm.
Koa hỗ trợ cascading middleware.
Koa sử dụng async / await thay vì callback và các tính năng ES 2015, ES 2017 tạo ra mã sạch hơn với khả năng xử lý lỗi tốt hơn.
Koa cung cấp hiệu suất tốt hơn một chút so với Express.js.

Cài đặt

Koa yêu cầu Node v7.6.0 trở lên để hỗ trợ chức năng ES2015 và async. Nhưng theo mình tốt nhất nên cài Node v10 trở lên, vì Node v8 vẫn còn nhiều lỗi lắm

nvm install 7
npm install koa
node my-koa-app.js

Ví dụ ứng dụng Hello World

Đây là một ứng dụng Hello world mẫu sử dụng Koa:

const Koa = require('koa');
const app = new Koa();
app.use(async ctx => {
  ctx.body = 'Hello World';
});
app.listen(3000);

Ứng dụng này khởi động máy chủ và lắng nghe trên cổng 3000 để kết nối.

Độ phổ biến

Mặc dù tương đối mới, Koa đã trở nên rất phổ biến. GitHub đã xếp Koa phổ biến thứ 4.

5. Nuxt.js

framework javascript nuxt js — Nguồn: nuxtjs

Evan You , một Kỹ sư của Google, đã tạo ra Vue.js , 1 front-end framework javascript đơn giản và thân thiện với người mới bắt đầu . Theo thời gian, Vue.js đã phát triển thành một trong hai Web framework phổ biến nhất. Mặc dù Vue.js được đánh giá cao hơn React, nhưng nó vẫn không hỗ trợ các tính năng vượt trội như Angular hay Ember.

Một nhóm các Kỹ sư phần mềm do Alexandre Chopin và Sebastien Chopin dẫn đầu đã tạo ra Nuxt.js để để đưa Vue.js lên 1 tầm cao mới. Nuxt.js cho phép ta phát triển Universal Apps, tức là cả ứng dụng được hiển thị phía Máy chủ và trang Web tĩnh. Do đó, Nuxt.js kết hợp tất cả các ưu điểm của ứng dụng được render phía Máy chủ (ví dụ: thân thiện với SEO, khởi động nhanh hơn) , kế thừa tất cả các điểm mạnh của Vue.js.

5 tính năng chính

Nuxt.js được xây dựng trên nền tảng nguồn mở rất phổ biến và mạnh mẽ Vue.js.
Nuxt.js cung cấp tính năng server side rendering (SSR) hỗ trợ SEO và khởi động nhanh.
Nó cũng cung cấp giải pháp “Out-of-the-box” như Angular / Ember với cấu trúc thư mục, cấu hình và thư viện tiêu chuẩn.
Nuxt.js có tính mô-đun cao với 50 mô-đun chuẩn hỗ trợ hầu hết mọi thứ bạn cần để phát triển Ứng dụng Web.
Nó cũng hỗ trợ automatic code-splitting (các trang được render trước ở server).

Cài đặt

Khi bạn đã cài đặt Node.js, bạn có thể cài đặt Nuxt bằng một lệnh duy nhất:

npm install --save nuxt

Ví dụ ứng dụng Hello World

Nuxt cung cấp công cụ ‘create-nuxt-app’ để nhanh chóng thiết lập và tạo mã cho Ứng dụng Nuxt:

npx create-nuxt-app hello-world-app

Sau đó, nó sẽ yêu cầu các options (ví dụ: Express hoặc Koa) và generate các files cần thiết cho ứng dụng.

Cũng dễ dàng để tạo một project thủ công. Trong tệp package.json, thêm đoạn sau:

{
  "name": "hello-world-app",
  "scripts": {
    "dev": "nuxt"
  }
}

Tạo thư mục “pages” và 1 file ‘pages/index.vue’ với nội dung:

<template>
  <h1>Hello world!</h1>
</template>

Start project:

npm run dev

Truy cập http://localhost:3000, để xem thành quả

Độ phổ biến

Theo sao GitHub, Nuxt.js được xếp hạng 5, như được hiển thị bên dưới:

6. NestJS

framework javascript nest js — Nguồn: Nestjs

Kamil Mysliwiec, một kỹ sư phần mềm người Ba Lan, đã được Angular truyền cảm hứng và tạo ra Nest như một framework javascript phía server. Giống như Angular, Nest cũng tập trung rất nhiều vào Configuration-over-Configuration và hoạt động như end-to-end framework.

5 tính năng chính

Nest theo một kiến trúc tương tự như Angular. Nó cung cấp một giải pháp Out-of-the-box cho các ứng dụng cấp Doanh nghiệp với cấu hình ít.
Nó có hỗ trợ TypeScript và Vanilla JavaScript.
Nó cung cấp một công cụ CLI để tạo scaffolding và generate code.
Nó được xây dựng trên TypeScript và JavaScript hiện đại (ES6 +). Nó kết hợp các yếu tố của OOP (Lập trình hướng đối tượng), FP (Lập trình chức năng) và FRP (Lập trình phản ứng chức năng).
Nhờ kiến trúc mô-đun, nó có thể mở rộng và có thể được sử dụng trong các tình huống khác nhau và đặc biệt phù hợp với Kiến trúc microservice.

Cài đặt

Nest đi kèm với công cụ Giao diện dòng lệnh (CLI). Nest CLI giúp tạo bộ code mẫu chuẩn để bắt đầu dự án mới

npm install -g @nestjs/cli

Ví dụ ứng dụng Hello World

Với Nest CLI, bạn có thể tạo một ứng dụng mới bằng lệnh sau:

nest new hello-world-app

Nó sẽ tạo ra một ứng dụng hello world với tất cả các mã nguồn và cấu trúc cần thiết. Bạn có thể khởi chạy dự án bằng lệnh sau:

npm run start:dev

Trong trình duyệt của bạn, hãy mở http: // localhost: 3000 để xem một ứng dụng mới đang chạy! Ứng dụng sẽ tự động biên dịch lại và tải lại khi bạn thay đổi bất kỳ file nào.

Độ phổ biến

Nest chỉ mới ba tuổi nhưng đã được xếp hạng 6 theo GitHub:

Ngoài ra, theo NPM trending, nó được xếp hạng 4, như hình dưới đây:

7. Fastify

framework javascript fastify — Nguồn: fastify

Fastify là một framework javascript phía máy chủ tối giản, tập trung lớn vào trải nghiệm của nhà phát triển và hiệu suất ứng dụng. Nó được lấy cảm hứng từ Express.js và Hapi.

5 tính năng chính

Đây là một trong những Server Side framework nhanh nhất . Theo điểm chuẩn , nó có thể xử lý nhiều yêu cầu hơn mỗi giây so với Express, Hapi, Koa, Restify.
Nhờ Kiến trúc Plugin mạnh mẽ, fastify có thể dễ dàng mở rộng.
Đây cũng là một trong số ít hỗ trợ JavaScript và TypeScript.
Fastify có một công cụ CLI để khởi động dễ dàng với việc generate code và bản mẫu.
Fastify cung cấp trải nghiệm nhà phát triển tuyệt vời với cách phát triển tối giản.

Cài đặt

Giống như NestJS, fastify cũng cung cấp CLI để tạo dự án. Đầu tiên, cài đặt fastify-cli bằng lệnh sau:

npm i -g fastify-cli

Ví dụ ứng dụng Hello World

Khi bạn đã cài đặt fastify-cli, bạn có thể tạo một dự án mới bằng lệnh sau:

fastify generate hello-world-app

Sau đó thêm các dòng sau vào package.json:

{
  "scripts": {
    "start": "fastify start server.js"
  }
}

Thêm vài đoạn code vào file server.js

// server.js
'use strict'
module.exports = async function (fastify, opts) {
  fastify.get('/', async (request, reply) => {
    return { hello: 'world' }
  })
}

Sau đó chạy lệnh:

npm start

Độ phổ biến

Theo sao GitHub, đây là thư viện phổ biến thứ 7:

Xếp hạng 9 trên NPM trending

Tổng kết:

Mình vừa giới thiệu 7 framework javascript tốt nhất hiện nay, giúp developer nhanh chóng triển khai ứng dụng phia backend, cá nhân mình thì yêu thích và quen dùng Meteor , Koa , Sails – express ( Nest cũng hơi bị ngon ) chuyên dụng để tạo restful api với đầy đủ tính năng
Bạn có thể xem thêm bài viết hướng dẫn từng bước tạo 1 ứng dụng restful api với nodejs

HocWeb VN

Bài viết này được sưu tầm và tổng hợp từ nhiều nguồn trên Internet.

Nếu có gì không hiểu thì inbox messenger bên dưới mình hỗ trợ thêm nhé.