모든 사람은 자바스크립트가 웹 페이지에 사용되는 언어가 아니라는 것을 알아야 한다.재미있는 JavaScript 라이브러리는 다음과 같습니다. D

1.ExpressJS

Express는 웹 응용 프로그램을 만드는 가장 간단한 방법입니다.이것은 웹 응용 프로그램과 API를 위해 구축된 학습이 쉽고 여러 개의 역할 영역을 가진 방대한 중간부품을 제공한다.이것은 간단한 Express 응용 프로그램입니다.

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}`);
});

이것은 간단한 Express 웹 응용 프로그램입니다!
그럼 택배 중간 제품에 대해 얘기해 봅시다.

여권

인증 시스템이 있는 웹 응용 프로그램을 구축하고 싶다면.여권은 바로 가야 할 곳이다.그것은 정책의 개념을 사용하여 요청을 검증한다.
정책에는 사용자 이름과 비밀번호 증명서 검증, OAuth(예를 들어 페이스북이나 구글)를 통해 인증 의뢰를 하거나 OpenID를 사용하여 연합 인증을 할 수 있다.

B, CORS 회사

소스 간 요청은 표준 HTTP 요청 방법을 사용하여 수행됩니다.대부분의 서버에서 GET 요청을 허용합니다. 이는 외부 소스의 리소스에서 자산을 읽을 수 있도록 허용한다는 것을 의미합니다.HTTP 요청 방법(예: 패치, 배치 또는 삭제)은 악의적인 행위를 방지하기 위해 거부될 수 있습니다.예를 들어 많은 서버들이 자산 변경 요청을 허용하지 않는다.

C, 본문 분석기

본문 해석기는 프로세서를 처리하기 전에 중간부품에서 전송된 요청 본문을 해석합니다. req.body 속성에서 사용할 수 있습니다.

D, 투구

그것은 응용 프로그램을 안전하게 하고 서로 다른 빈틈을 막기 위한 중간부품이다.
또한 모든 응용 프로그램은 웹 응용 프로그램/api가 최고의 응용 프로그램/api가 되더라도 독특한 범위를 가지고 있습니다.
자세한 내용은 freeCodeCamp와 ExpressJS 문서에 있는 녀석을 보십시오

2.ElectronJS

UI 실행 가능한 응용 프로그램을 구축하는 것이 NodeJS에게는 불가능하다고 생각합니까?네가 틀렸어, 내 친구야!전자는 전진하는 방향이다!
만약 네가 색인을 가지고 있다고 가정해라.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, 윈도우즈, 마코스) 를 위한 실행 가능한 프로그램을 구축할 수 있습니다.
Electron은 html 파일에 함수를 통합할 수 있는 API를 제공합니다.ipcMain는 이벤트 발사기 구축으로 html 파일에서 이벤트를 보내고 백엔드에서 처리하는 데 사용된다.
전자JS는 정적 html 파일이나 Vue, React 또는 Angular 등의 프레임워크에 사용할 수 있다.

3.VueJS

VueJS는 사용자 인터페이스와 단일 페이지 응용 프로그램을 구축하는 데 사용되는 JavaScript 프레임워크입니다.Evan You가 만들었으며 다른 활동적인 핵심 팀원들이 관리합니다.

가상 DOM

VueJS는 가상 DOM을 사용하고 다른 프레임워크(예를 들어 React, Ember 등)도 가상 DOM을 사용합니다. DOM을 변경하지 않고 JavaScript 데이터 구조로 존재하는 DOM 복사본을 만듭니다.

데이터 바인딩

데이터 바인딩 기능은 HTML 속성을 조작하거나 HTML 속성에 값을 분배하고 스타일을 변경하는 데 도움이 된다. VueJS에서 v-bind라는 바인딩 명령 분배 클래스를 빌려서.

구성 요소

구성 요소는 VueJS의 중요한 기능 중 하나로 HTML에서 재사용할 수 있는 사용자 정의 요소를 만드는 데 도움이 됩니다.

이벤트 처리

v-on는 VueJS의 이벤트를 탐지하는 데 사용되는 DOM 요소에 추가된 속성입니다.

속성 계산

이것은 VueJS의 중요한 기능 중 하나입니다.UI 요소에 대한 변경 사항을 듣고 필요한 계산을 수행하는 데 도움이 됩니다.이것은 별도의 인코딩이 필요 없다.

경량의

VueJS는 매우 가벼운 프레임워크이며 성능이 매우 빠르다.

4. 장량류

TensorFlow는 Google에서 개발한 자바스크립트 라이브러리로 브라우저나 NodeJ에서 기계 학습 배치와 훈련 모델을 사용하는 데 사용된다.
더 찾기here!

5, 로컬 VUEJ

Vue Native는 VueJS를 기반으로 JavaScript를 사용하여 플랫폼 간 모바일 응용 프로그램을 구축하는 프레임워크입니다.
Vue native core는 React와 Vue를 연결하기 위한 것으로 React에서 Vue를 실행하는 데 도움이 됩니다.하지만 이 예쁜 프레임워크에 대한 더 많은 정보를 찾을 수 있습니다here

6. 비동기식, 대기 및 약속

나는 마지막에 금을 남겼다.과거에javascript에 큰 문제가 있었어요. 들어보셨겠지만 callback hell, 지옥으로 돌아가는 것은 이렇습니다.

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);
                       }
                   })
               }
           })
       }
   })
};

그것은 읽기 쉽습니까?나는 그렇게 생각하지 않는다!
이러한 상황을 피하기 위해서, 당신은 비동기적인 기다림과 약속을 사용하여 그것을 작성해야 합니다

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);
        });
    });
}

지금 읽기 쉬워요?나는 그렇다고 생각한다!

그래서 간단히 되돌아보면

JavaScript 커뮤니티는 매우 크고 아름답습니다.이 프레임워크의 모든 것은 독특한 기능을 가지고 있기 때문에 자바스크립트는 거의 모든 종류의 조작 언어가 된다.만약 네가 이 방면의 경험이 없다면.해봐야지.좋아할 거예요.
모두들 즐겁고 효과적인 하루를 보내세요!