JavaScriptを美しいプログラミング言語にする技術!


JavaScriptはWebページに使用される言語ではないことを皆が知っているべきです.以下のいくつかの興味深いJavaScriptライブラリを見つけるつもりです:D

1 .表情



Webアプリケーションを作成する最も簡単な方法を表現します.WebアプリとAPIのために構築された、それは学ぶのは簡単ですし、複数のスコープを持つミドルウェアの巨大なセットを提供します.ここでは、単純なエクスプレスアプリです.
import express from 'express';

const app = express(); // create a new express object
const port = 3000; // declare express server port

// create a get http route
app.get('/', (req, res) =>{
// Write on localhost:3000/ the string below
   res.send("Hello dev.to user :D I hope you will have a greate and productive day"); 
});

// listen the server on the declared port
app.listen(port, () => {
   console.log(`The most simple and beautiful express app is live on port ${port}`);
});
そして、これは単純なエクスプレスのWebアプリケーションです!
それでは、いくつかのエクスプレスミドルウェアについて話しましょう.

パスポート


認証システムを使用してWebアプリケーションを構築する場合.パスポートその行く方法.これは、戦略の概念を使用して要求を認証する.
戦略は、ユーザー名とパスワード資格証明、OAuth(例えば、FacebookやGoogle経由)、またはOpenIDを使用して連邦認証を使用して委任認証を検証する範囲です.

コークス


標準的なHTTPリクエストメソッドを使って、リクエストのクロスリクエストを行います.ほとんどのサーバはGETリクエストを許可します.つまり、外部の起源からリソースを読み込むことができるようになります.パッチ、put、deleteのようなHTTPリクエストメソッドは悪意のある動作を防ぐために拒否されます.例えば、多くのサーバーは、彼らの資産を変えることを要求しません.

ボディパーサー


ボディーパーサーは、あなたのハンドラーの前にミドルウェアの着信要求本体を解析します.

ヘルメット


ヘルメットは、別の脆弱性に対して、あなたの素晴らしいアプリを安全にするために構築されたミドルウェアのセット.
そして、より多くの、彼らのユニークな範囲で、各々は、それがあなたのウェブアプリケーション/APIを最高のものにすることです.
詳細については、FreecodecampとExpressJSドキュメントからの人々をチェックアウト

2 .電子ジャーナル



あなたは、UI実行可能なアプリケーションを構築すると思いますか?あなたは間違って私の友人です!電子その行く方法!
それで、インデックスがあるふりをしましょう.HTMLファイル、いくつかの情報があります.
// index.js
const { app, BrowserWindow } = require('electron')

function createWindow () {
  // Create the browser window.
  let win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  })

  // and load the index.html of the app.
  win.loadFile('index.html')
}

app.on('ready', createWindow)
上記のコードを使用すると、任意のデスクトップオペレーティングシステム(Linux、WindowsおよびMacOS)の実行可能なアプリケーションを構築することができます.
電子は、HTMLファイル内の関数を統合できるAPIが付属しています.req.bodyはイベント・エミッター・ビルドです.そして、HTMLファイルからイベントを放出して、それをバックエンドの内部で扱います.
電子.JSは、静的なHTMLファイルやVue、反応や角度のようなフレームワークで使用することができます.

Vuejs



Vuejsは、ユーザーインターフェイスと単一のページアプリケーションを構築するためのJavaScriptフレームワークです.これはエヴァンあなたによって作成され、彼と他のアクティブなコアチームのメンバーによって維持されます.

仮想DOM


VEEJSは仮想DOMの使用を行います.そして、それは他のフレームワーク(例えば反応、燃えている)によっても使われます.

データバインド


データバインディング機能を使用すると、HTML属性に値を操作したり割り当てたりすることができます.スタイルを変更するには、VegEJで使用可能なV - BINDというバインディングディレクティブの助けを借りてクラスを割り当てます.

コンポーネント


コンポーネントは、HTMLで再利用することができますカスタム要素を作成するのに役立つvuejsの重要な機能の一つです.

イベント処理

ipcMainは、VEEJSでイベントを聞くためにDOM要素に加えられる属性です.

計算のプロパティ


これは、vuejsの重要な機能の一つです.これは、UIの要素になされた変更を聞いて、必要な計算を実行するのに役立ちます.これには追加のコーディングは必要ありません.

ライト級


Vuejsは非常に軽量なフレームワークであり、また、パフォーマンスは非常に高速です.

テンソルフロー



Googleによって開発された、TensorFlowは、ブラウザやNodeJSで機械学習を使用してモデルを展開し、トレーニングするためのJavaScriptライブラリです.
より多くのhereを見つけてください!

ネイティブVuejs


VueネイティブVuejsに基づいており、JavaScriptを使用してクロスプラットフォームのネイティブモバイルアプリケーションを構築するためのフレームワークです.
VUEネイティブコアは、反応でVueを実行するのに役立つ反応とVueを接続するように設計されています.しかし、この美しいフレームワークの詳細については、hereを見つけることができます

async , wait ,約束


私は金を最後に残した.過去に、JavaScriptは大きな問題を抱えていました.
const checkUser= function(username, password, callback){
   dataBase.checkUser(username, password, (error, userInfo) => {
       if (error) {
           callback(error)
       }else{
           dataBase.getRoles(username, (error, roles) => {
               if (error){
                   callback(error)
               }else {
                   dataBase.getAccess(username, (error) => {
                       if (error){
                           callback(error);
                       }else{
                           callback(null, userInfo, roles);
                       }
                   })
               }
           })
       }
   })
};
読みやすいですか.そうは思わない!
それを避けるために、async - waitと約束を使ってそれを書く必要があります
const checkUser= async function(username, password){
   try {
       const userInfo = await dataBase.checkUser(username, password);
       const rolesInfo = await dataBase.getRoles(userInfo);
       const logStatus = await dataBase.getAccess(userInfo);
       return userInfo;
   }catch (e){
       //handle errors as needed
   }
};
コールバックを約束に変える方法?簡単です
database.get(data, (err, data) => {
    if (err) throw new Error(err);
    else console.log(data);
});
約束に転じた
const get = (data) => {
    return new Promise((resolve, reject) => {
        database.get(data, (err, data) => {
            if (err) reject(err);
            else resolve(data);
        });
    });
}
ISは今読みやすいですか?そう思う!

だからほんの少しの要約


JavaScriptコミュニティは大きく、美しい.これらのフレームワークのそれぞれは、JavaScriptの操作のほぼすべての種類の言語になります独自の機能が付属しています.あなたがそれにどんな経験もないならば.試してみてください.私はあなたがそれを愛することを賭ける.
良い生産的な日の人々を!