12/08/2018, 15:55

Xây dựng ứng dụng NodeJs cơ bản(Part 0)

Installing Node and Sublime text Trước khi xây dựng ứng dụng bạn cần phải cài đặt môi trường và IDE (ở đây mình khuyến khích dùng sublime text để code). Để cài đặt môi trường, bạn hãy truy cập vào các trang sau để download nodejs và sublime text vềm sau đó cài . https://nodejs.org/en/ ...

Installing Node and Sublime text

Trước khi xây dựng ứng dụng bạn cần phải cài đặt môi trường và IDE (ở đây mình khuyến khích dùng sublime text để code). Để cài đặt môi trường, bạn hãy truy cập vào các trang sau để download nodejs và sublime text vềm sau đó cài .

  • https://nodejs.org/en/
  • https://www.sublimetext.com/

Đối với Ubuntu các bạn có thể các lệnh sau để cài đặt: Sublime text 3:

$ sudo add-apt-repository ppa:webupd8team/sublime-text-3

$ sudo apt-get update

$ sudo apt-get install sublime-text-installer

Nodejs

$ curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -

$ sudo apt-get install -y nodejs

Hoặc bạn có thể sử dụng NVM (để cài đặt: https://github.com/creationix/nvm#install-script) . Mình khuyến khích các bạn dùng cách này hơn vì sau khi cài đặt có thể dễ dàng chuyển đổi giữa các version của Node do có một package thì yêu cầu phiên bản mới nhất của Node khi đó bạn sử dụng câu lệnh sau. Ví dụ cần module yêu cầu phiên bản 8

$ nvm install 8

$ nvm use 8

Trong trường hợp muốn dùng phiên bản khác nữa

$ nvm uninstall 8

Sau khi cài đặt gõ câu lệnh sau để kiểm tra

node -v

Kết quả

v8.4.0

Introduction to Javascript and Node

Node.js là một nền tảng chạy trên môi trường V8 JavaScript runtime - một trình thông dịch JavaScript. Trước tiên bạn hãy tạo một thư mục Node để chứa file file hello-wolrd.js sau đó đưa con trỏ tới thư mục chưa file vừa tạo

cd workspace/Node/

touch hello-wolrd.js

Trong file hello-wolrd.js gõ thử đoạn code console.log('Hello world'); sau đó ở màn hình terminal gõ

node hello-wolrd.js

Kết quả ở màn hình terminal sẽ hiện ra: Hello world

Node package manager(npm)

NPM: dùng để quản lý các module javascript được lập trình sẵn và đóng gói lại để chia sẻ cho các ứng dụng khác sử dụng. Khi bắt đầu với một ứng dụng nodejs trên github thì luôn có một file đặc biệt đó là package.json, package.json có thể hiểu nó là 1 document giúp bạn biết được trong dự án này cần có những module nào. Package.json còn là file cấu hình của npm, giúp cho npm hiểu nó cần phải cài đặt cái gì, thông tin về ứng dụng, phiên bản, ... Ví dụ: Sau khi cài nodejs thì tự động đã có npm. Thử bằng lệnh

$npm -v

Nếu dự án bạn tải về từ github ...vv thì bạn cần cài đặt các module bằng câu lệnh sau(trỏ còn trỏ về dự án vừa clone về)

npm install

Còn nếu dự án mới được tạo bạn có thể xây dựng thư viện riêng cho mình bằng câu lệnh

npm init 

Weather app

Trong ứng dụng này có sử dụng 2 module: yargs và request

  1. Yargs Yargs là một module có tác dụng tách chuỗi của các request và lấy các tham số + giá trị của các tham số, module này rất hữu ích trong việc giao tiếp lấy dữ liệu từ client. Ví dụ Tạo một project để thử như sau:
npm init

npm install yargs --save

touch example-argv.js

Trong file example vừa tạo

var yargs = require('yargs');
 
var argv = yargs.argv;
 
console.log(argv);

Chạy file example-argv.js, kết quả hiển thị như sau:

{ _: [], '$0': 'example-argv.js' }

Để truyền tham số vào file example-argv.js có 2 dạng

  • Truyền tham số trực tiếp: node example-argv.js this_is_a_test sau đó chạy lại file thì kết quả hiển thị như sau:
{ _: [this_is_a_test], '$0': 'example-argv.js' }
  • Truyền tham số dưới dạng key-value: node example-argv.js --key value, kết quả hiển thị như sau:
{
    _: [], 
    '$0': 'example-argv.js' ,
    key: value
}
  1. Request Request là module giúp cho việc thực hiện các request http đến các trang web cung cấp api, từ đó lấy các thông tin mong muốn về. Ví dụ:
  • https://openweathermap.org/
  • https://ipinfo.io/ Dưới đây là ví dụ về cách sử dụng module request:
var request = require('request');

// request (api, callback(error, response, body))
request('https://ipinfo.io/', function (error, response, body) {
  console.log('error:', error); // Print the error if one occurred
  console.log('statusCode:', response && response.statusCode); // Print the response status code if a response was received
  console.log('body:', body); // Print the HTML for the Google homepage.
});

Kết quả hiển thị:

error: null
statusCode: 200
body: {
  "ip": "1.55.242.188",
  "city": "Hanoi",
  "region": "Thanh Pho Ha Noi",
  "country": "VN",
  "loc": "21.0333,105.8500",
  "org": "AS18403 The Corporation for Financing & Promoting Technology"
}
  1. Promise Promise là một lời hứa trong javascript(được đưa vào ES6) có thể coi là một kỹ thuật nâng cao giúp xử lý vấn đề bất đồng bộ hiệu quả hơn . Promise bao gồm 3 trạng thái: pending, fulfilled, reject
  • Pending: Trạng thái chờ xử lý kết thúc. Trạng thái này chính là trạng thái ban đầu của Promise, nó thể hiện rằng thao tác xử lý của ta chưa kết thúc.
  • Fulfilled: Trạng thái xử lý thành công. Trạng thái này thể hiện rằng thao tác xử lý của ta đã kết thúc và thành công.
  • Rejected: Trạng thái xử lý thất bại. Trạng thái này thể hiện thao tác xử lý đã kết thúc và thất bại.
var promise = new Promise(function(resolve, reject){
    // Do some async task
   if (done) {
       resolve("success");
   } else {
       reject("fail");
   }
});
 
promise.then(
    function(success) {
        console.log(success);
    },
    function(error) {
        console.log(error);
);

Trong đoạn code ví dụ trên một hàm Promise sẽ bao gồm 2 callback được truyền vào: resolve là một hàm callback xử lý cho hành động thành công; reject là một hàm callback xử lý cho hành động thất bại. Tiếp theo là then được gọi khi Promise resolve hoặc reject. Lưu ý trong reject hoặc resolve có thể return được cả 1 promise khi đó ta có thể thực hiện then nhiều lần cho đến khi đạt được kết quả mong muốn thì thôi.

Then có hai tham số callbacks đó là success và error. Tuy nhiên bạn cũng có thể sử dụng phương thức catch để bắt lỗi như sau:

promise.then(function(success) {
    console.log(success);
})
.catch(function(errorMessage) {
    console.log(errorMessage);
});
  1. Xây dựng ứng dụng kiểm tra thời tiết Mô tả: ứng dụng sẽ thực hiện nhận địa chỉ gửi tới, từ địa chỉ được gửi hệ thống sẽ gọi đến api trên website https://openweathermap.org/ để lấy tình trạng thời tiết tại địa chỉ vừa nhận được. Trong trường hợp địa chỉ không tồn tại thì ứng dụng sẽ request lên địa chỉ nơi mà ứng dụng đang được chạy và lấy về tình hiện thời tiết của địa chỉ hiện tại.

Trỏ con trỏ tới folder sẽ chưa project ta thực hiện các bước sau để cài đặt cho app:

npm init
... Điền các thông tin cần thiết

npm install request --save

npm install yargs --save

Kết quả ta được file package.json như sau:

{
  "name": "weather-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo "Error: no test specified" && exit 1"
  },
  "author": "duong pham",
  "license": "ISC",
  "dependencies": {
    "request": "^2.81.0",
    "yargs": "^8.0.2"
  }
}

Trong weather app ta sẽ tách thành 2 module riêng biệt gồm : weather module và location module. Mỗi module sẽ chịu trách nhiệm riêng biệt để lấy các thông tin tương ứng về : Module location.js

var request = require('request');
var url = 'https://ipinfo.io/';

module.exports = function () {
  return new Promise(function(resolve, reject) {
    request({
      url: url,
      json:true
    }, function (error, response, body) {
      if (error) {
        reject(error);
      } else {
        resolve(body);
      }
    });
  });
}

Trước khi tạo module weather bạn cần đăng kí tài khoản trên trang openweather để lấy API_keys tương ứng cho ứng dụng của bạn, sau đó trong url phía dưới thay key vừa tạo được vào API_keys. Module weather.js

var request = require('request');

module.exports = function (location) {
  return new Promise(function(resolve, reject) {
    var encodedLocation = encodeURIComponent(location);
    var url = 'http://api.openweathermap.org/data/2.5/weather?q=' + encodedLocation + '&APPID=API_keys&units=imperial';

    if (!location || location == null) {
      return reject('No location provided');
    }

    request({
      url: url,
      json:true
    }, function (error, response, body) {
      if (error) {
        reject(error);
      } else {
        resolve(JSON.stringify(body, null, 2));
      }
    });
  });
}

Tiếp theo tạo file app.js đây là sẽ main của ứng dụng và sử dụng các module vừa tạo ở trên. Trong quá trình khởi tạo module yargs ta có thể thêm các option khi chạy node:

  • demand: có thể truyền biến location hoặc không
  • alias: key có thể được viết tắt bẵng chữ cái mong muốn
  • type: yêu cầu phải tham số truyền vào ở dạng string
  • ... app.js
// require để sử dụng các module 
var weather = require('./weather.js');
var location = require('./location.js');

var argv = require('yargs')
  .option('location', {
    demand: false,
    alias: 'l',
    description: 'Location to get current weather',
    type: 'string'
  })
  .help('help')
  .argv;

if (typeof argv.l == 'string' && argv.l.length > 0) {
  weather(argv.l)
    .then(function(currentWeather) {
      console.log(currentWeather);
    })
    .catch(function(error) {
      console.log(error);
    });
} else {
  console.log('No location given');
  location()
    .then(function(location) {
      return weather(location.city);
    })
    .then(function(currentWeather) {
      console.log(currentWeather);
    })
    .catch(function(error) {
      console.log(error);
    })
}

Sau khi đã cài đặt xong, chạy thử ứng dụng để kiểm tra tình hình thời tiết tại nơi mình muốn như sau:

node app.js -l 'Ha Noi'

Kết quả sau khi chạy xong ứng dụng:

{
  "coord": {
    "lon": 105.84,
    "lat": 21.02
  },
  "weather": [
    {
      "id": 801,
      "main": "Clouds",
      "description": "few clouds",
      "icon": "02n"
    }
  ],
  "base": "stations",
  "main": {
    "temp": 84.2,
    "pressure": 1007,
    "humidity": 83,
    "temp_min": 84.2,
    "temp_max": 84.2
  },
  "visibility": 10000,
  "wind": {
    "speed": 11.41,
    "deg": 140
  },
  "clouds": {
    "all": 20
  },
  "dt": 1503930600,
  "sys": {
    "type": 1,
    "id": 7980,
    "message": 0.0084,
    "country": "VN",
    "sunrise": 1503873563,
    "sunset": 1503918945
  },
  "id": 1581130,
  "name": "Ha Noi",
  "cod": 200
}

Reference

https://developer.mozilla.org/vi/docs/Web/JavaScript/Reference/Global_Objects/Promise https://github.com/yargs/yargs https://github.com/request/request

0