NodeJS开发

因为最近使用的两个博客系统都是基于NodeJS开发的,也顺便谈谈我理解的JavaScript及前端开发.

NodeJS的是伴随Chrome的V8 Engine而出现,由于JS群众基础及高性能而快速发展,本质是它使用类似Nginx的事件循环模型可以处理极高的并发请求.

异步IO及基于NodeJS的第三方库都提供的异步版本,使得较简单的编程模型带来极高的性能, JavaScipt这一应用于前端开发的古老语言焕发出新的生机.

早期前端开发的JavaScript由于要处理浏览器版本兼容且语言本身问题,充斥着丑陋的代码. 伴随着JQuery及第三方框架/库的流行,JavaScript也变得优美起来.

前端开发三剑客: HTML + CSS + JavaScript这些年随着新标准的发展也比我最初接触时强大易用多了, 一切事物还真得以发展的眼光看待,技术领域尤其容不得偏见.

因为偶尔会忘记,下面记些简单的笔记:

NodeJS

Node是一个JS应用的平台,而不是框架. 尤其适用于数据密集型实时服务和大并发量/小数据块的长连接场景.

匿名函数调用也被称为回调(a.k.a callback)
steams是随时间进行的数据分发

安装

稳定版本: 14/16.x

Linux二进制安装

参考文档

# Using Ubuntu
curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash -
sudo apt-get install -y nodejs

# or
sudo snap install node --classic

# 初始工作

# 使用国内镜像加速
npm config set registry https://registry.npmmirror.com
# or
npm install --registry=https://registry.npmmirror.com

卸载

# Ubuntu
sudo rm -rf /usr/local/lib/node_modules
sudo rm -rf ~/.npm
# Mac
brew uninstall --force node

node多版本

使用nvm管理多版本

# 安装
git clone https://ghproxy.com/https://github.com/nvm-sh/nvm ~/.nvm
cd ~/.nvm
./install.sh

# 使用
nvm ls-remote --lts
nvm install v12.22.12
nvm ls
nvm alias default v12.22.12
nvm use v16.19.1

使用n管理多版本

npm install -g n
n stable  # n lts

包管理/依赖管理

npm

选项说明:

-g: 代表全局
–save: 将模块安装到项目目录下，并在package文件的dependencies节点写入依赖

# 创建package.json
npm init

# 安装依赖库
npm i vue-cli -S
npm install vue --save-dev

# 更新包
npm update cypress
npm install cypress@latest
# 查看全局可更新版本
npm outdated -g --depth=0

# 使用第三方工具
npm i -g npm-check-updates
ncu -u
npm install

# 全局卸载
npm uninstall vue-cli -g

Yarn

Facebook出品替代npm的新工具

# Node.js >=16.10
corepack enable
# Node.js <16.10
npm i -g corepack

# https://yarnpkg.com/lang/en/docs/install/
# Using Mac
brew install yarn  # 会自动安装Node
brew install yarn --without-node  # 使用node版本管理工具安装

# Using Ubuntu 
curl -sL https://dl.yarnpkg.com/debian/pubkey.gpg | gpg --dearmor | sudo tee /usr/share/keyrings/yarnkey.gpg >/dev/null
echo "deb [signed-by=/usr/share/keyrings/yarnkey.gpg] https://dl.yarnpkg.com/debian stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt-get update && sudo apt-get install yarn

# 全局安装
yarn global add @vue/cli
# 全局更新
yarn global upgrade --latest @vue/cli
# 全局卸载
yarn global remove vue-cli

# 更新
yarn upgrade cypress

# 添加到PATH
vi ~/.zshrc
export PATH=/home/xulz/.yarn/bin:$PATH

资源

前端工具集

本地预览

live-server

pnpm add -g live-server

# or
yarn global add live-server
# ~/.yarn/bin

# 本地预览，默认端口8080
live-server
# 指定端口
live-server --port 9000

构建工具

注: 前面出现的较新

自动化构建工具

Gulp vs. Grunt

把依赖全部提取到一个文件

webpack vs. browserify

桌面开发Electron

最早知道基于HTML+CSS+JavaScript的桌面开发是看到豌豆荚团队的访谈,知道了基于Chromium的CEF框架.

之后不断演进出优秀的Electron,该框架极大的简化了跨平台开发的成本,你很难想象VSCode,Slack等工具是基于Electron和Web开发技术做出来的.

后端开发

koa

Express继任者,用于api或其他服务快速开发

nodemon

自动监控变更并重启服务,适用于开发环境

npm install -g nodemon