是 JavaScript 大神，

能写出漂亮的代码，

还会很多 JavaScript 奇技淫巧？

比如这种 Hello World

ﾟωﾟﾉ= /｀ｍ´)ﾉ ~┻━┻ //*´∇｀*/ ['_']; o=(ﾟｰﾟ) =_=3; c=(ﾟΘﾟ) =(ﾟｰﾟ)-(ﾟｰﾟ); (ﾟДﾟ) =(ﾟΘﾟ)= (o^_^o)/ (o^_^o);(ﾟДﾟ)={ﾟΘﾟ: '_' ,ﾟωﾟﾉ : ((ﾟωﾟﾉ==3) +'_') [ﾟΘﾟ] ,ﾟｰﾟﾉ :(ﾟωﾟﾉ+ '_')[o^_^o -(ﾟΘﾟ)] ,ﾟДﾟﾉ:((ﾟｰﾟ==3) +'_')[ﾟｰﾟ] }; (ﾟДﾟ) [ﾟΘﾟ] =((ﾟωﾟﾉ==3) +'_') [c^_^o];(ﾟДﾟ) ['c'] = ((ﾟДﾟ)+'_') [ (ﾟｰﾟ)+(ﾟｰﾟ)-(ﾟΘﾟ) ];(ﾟДﾟ) ['o'] = ((ﾟДﾟ)+'_') [ﾟΘﾟ];(ﾟoﾟ)=(ﾟДﾟ) ['c']+(ﾟДﾟ) ['o']+(ﾟωﾟﾉ +'_')[ﾟΘﾟ]+ ((ﾟωﾟﾉ==3) +'_') [ﾟｰﾟ] + ((ﾟДﾟ) +'_') [(ﾟｰﾟ)+(ﾟｰﾟ)]+ ((ﾟｰﾟ==3) +'_') [ﾟΘﾟ]+((ﾟｰﾟ==3) +'_') [(ﾟｰﾟ) - (ﾟΘﾟ)]+(ﾟДﾟ) ['c']+((ﾟДﾟ)+'_') [(ﾟｰﾟ)+(ﾟｰﾟ)]+ (ﾟДﾟ) ['o']+((ﾟｰﾟ==3) +'_') [ﾟΘﾟ];(ﾟДﾟ) ['_'] =(o^_^o) [ﾟoﾟ] [ﾟoﾟ];(ﾟεﾟ)=((ﾟｰﾟ==3) +'_') [ﾟΘﾟ]+ (ﾟДﾟ) .ﾟДﾟﾉ+((ﾟДﾟ)+'_') [(ﾟｰﾟ) + (ﾟｰﾟ)]+((ﾟｰﾟ==3) +'_') [o^_^o -ﾟΘﾟ]+((ﾟｰﾟ==3) +'_') [ﾟΘﾟ]+ (ﾟωﾟﾉ +'_') [ﾟΘﾟ]; (ﾟｰﾟ)+=(ﾟΘﾟ); (ﾟДﾟ)[ﾟεﾟ]='\\'; (ﾟДﾟ).ﾟΘﾟﾉ=(ﾟДﾟ+ ﾟｰﾟ)[o^_^o -(ﾟΘﾟ)];(oﾟｰﾟo)=(ﾟωﾟﾉ +'_')[c^_^o];(ﾟДﾟ) [ﾟoﾟ]='\"';(ﾟДﾟ) ['_'] ( (ﾟДﾟ) ['_'] (ﾟεﾟ+(ﾟДﾟ)[ﾟoﾟ]+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ (ﾟｰﾟ)+ (ﾟΘﾟ)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((ﾟｰﾟ) + (ﾟΘﾟ))+ (ﾟｰﾟ)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ (ﾟｰﾟ)+ ((ﾟｰﾟ) + (ﾟΘﾟ))+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((o^_^o) +(o^_^o))+ ((o^_^o) - (ﾟΘﾟ))+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((o^_^o) +(o^_^o))+ (ﾟｰﾟ)+ (ﾟДﾟ)[ﾟεﾟ]+((ﾟｰﾟ) + (ﾟΘﾟ))+ (c^_^o)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟｰﾟ)+ ((o^_^o) - (ﾟΘﾟ))+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ (ﾟΘﾟ)+ (c^_^o)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ (ﾟｰﾟ)+ ((ﾟｰﾟ) + (ﾟΘﾟ))+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((ﾟｰﾟ) + (ﾟΘﾟ))+ (ﾟｰﾟ)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((ﾟｰﾟ) + (ﾟΘﾟ))+ (ﾟｰﾟ)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((ﾟｰﾟ) + (ﾟΘﾟ))+ ((ﾟｰﾟ) + (o^_^o))+ (ﾟДﾟ)[ﾟεﾟ]+((ﾟｰﾟ) + (ﾟΘﾟ))+ (ﾟｰﾟ)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟｰﾟ)+ (c^_^o)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((o^_^o) +(o^_^o))+ ((ﾟｰﾟ) + (o^_^o))+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((ﾟｰﾟ) + (ﾟΘﾟ))+ ((ﾟｰﾟ) + (o^_^o))+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((o^_^o) +(o^_^o))+ ((o^_^o) - (ﾟΘﾟ))+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ ((ﾟｰﾟ) + (ﾟΘﾟ))+ (ﾟｰﾟ)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟΘﾟ)+ (ﾟｰﾟ)+ (ﾟｰﾟ)+ (ﾟДﾟ)[ﾟεﾟ]+(ﾟｰﾟ)+ ((o^_^o) - (ﾟΘﾟ))+ (ﾟДﾟ)[ﾟεﾟ]+((ﾟｰﾟ) + (ﾟΘﾟ))+ (ﾟΘﾟ)+ (ﾟДﾟ)[ﾟoﾟ]) (ﾟΘﾟ)) ('_');

除了这些

你是否尝试过

用 JavaScript 开发硬件应用？

点亮一盏灯，

又或是根据灯光的亮度，

在显示器上显示不同的表情。

你可能试过很多种的开发方法，

但是高效率的开发，

才是最重要的。

如何高效率？

手把手教你！

首先，一张图了解必备技能和工具

拥有技能和工具后，

我们以点亮一盏灯为起步，

开始高效开发硬件应用

炒鸡甜美的女程序猿解读~比林志玲还嗲，不信点击听呀！

一、下载和配置 Ruff SDK

1. 下载 Ruff SDK 并解压。2. 配置环境变量 RUFF_HOME 和 PATH(以下方法仅在当前命令行会话中有效，参考环境变量配置了解如何保留配置)：

· Linux / OS X 打开终端，分别执行以下两条命令

(需将 /path/to/ruff-sdk 替换为解压后的文件夹路径)：export RUFF_HOME=/path/to/ruff-sdk

export PATH="$PATH:$RUFF_HOME/bin"

· Windows

打开命令行，分别执行以下两条命令

(需将 X:\path\to\ruff-sdk 替换为解压后的文件夹路径)：set RUFF_HOME=X:\path\to\ruff-sdk

setx PATH "%PATH%;%RUFF_HOME%\bin"3. 这时在命令行中尝试执行 rap version，如果 rap 版本正常打印，说明 PATH 配置成功。Ruff SDK 中包含了 rap 和 ruff 两个可执行文件。其中 rap 是包含了设备匹配，应用初始化，驱动及模块管理等功能的开发工具；而 ruff 则是 Ruff 的运行时，在电脑中主要用于测试及模拟。

二、创建项目

1. 新建项目文件夹(如 hello-ruff)，进入文件夹后，使用 rap 初始化应用。(请尽量避免在 SDK 目录中新建项目。mkdir hello-ruff

cd hello-ruff

rap init

2. 根据提示，填写相应内容(可全部使用默认值)，rap 会初始化项目并下载开发板的配置信息，生成默认的硬件配置文件(ruff_box.json)。

三、连接设备

1. 首先我们需要将 Ruff 开发板上的 micro USB 接口与 USB 电源线连接，Ruff 开发板将随即启动。如果是一块全新的开发板，启动完成后会看到红色 LED 闪烁，表示正在等待网络配置。

2. 现在使用 rap wifi 命令为开发板配置 WiFi：rap wifi填写好 SSID 和密码后，rap 将会广播 SSID 及密码(如果当前电脑连接了多个网络, rap 会询问使用哪一个 IP 地址进行广播)。此时开发板会通过 LED 指示网络连接情况：

· 蓝色 LED 闪烁：开发板已经收到配置，正在尝试连接。· 蓝色 LED 常亮：连接成功！· 蓝色 LED 闪烁变为红色 LED 闪烁：开发板连接网络失败或超时，需要重新配置。

除通过路由器广播外，Ruff 开发板还可以通过 AP 模式或串口模式进行 WiFi 配置。请参考网络配置了解更多。开发板与电脑需要在同一网段内。开发板目前仅支持 2.4G 频段，所以请配置支持 2.4G 的热点。部分双频路由 2.4G 与 5G 频段互通，电脑仍然可以连接 5G 热点。

3. 完成网络连接后，在应用目录中执行 rap scan 命令扫描 Ruff 开发板：rap scan一切顺利的话，将在列表中看到自己的 Ruff 设备，如：Scanning (this will take 10 seconds)...

* [unnamed] - 192.168.31.123 (SN: R0100000)

Scan completed.

? select a device to interact: (Use arrow keys)

> [unnamed] - 192.168.31.114 (SN: R0100000)4. 回车选中自己的设备，rap 会记住这个地址，便于以后的操作(仅当在应用目录时有效)。根据 rap 的提示，可以给开发板设置一个名称，并配置密码，一定程度上避免未授权的操作。

四、部署应用

1. 打开 src 目录下的 index.js，可以看到初始化过程中生成的示例代码：'use strict';

$.ready(function (error) {

if (error) {

console.log(error);

return;

}

$('#led-r').turnOn();

});

$.end(function () {

$('#led-r').turnOff();

});这段代码将在应用启动后点亮红色板载 LED(设备 ID 为 led-r，# 表示通过 ID 匹配设备)，并在退出时关闭。

2. 在应用目录下执行命令 rap deploy -s(-s 表示部署完成后自动启动应用)：rap deploy -s如果一切顺利，在应用启动成功后应该可以看到红色板载 LED 已经点亮了。

3. 这个时候再执行 rap stop，即可结束运行中的应用并看到红色板载 LED 熄灭：rap stop

五、添加外设

1. 从套件中找出大按键模块(Push Button Module，型号 CK002)，我们将尝试通过它来控制板载 LED 的点亮和熄灭。根据包装上的标签，可以在 rap 网站上查看到它的信息，包括支持这个外设的驱动。

2. 在应用目录执行命令 rap device add button(其中 button 是我们为即将添加的外设指定的 ID，将在程序中用到。)rap device add button

3. 填入外设型号 CK002 并确认，rap 将搜索 Ruff 软件包仓库并列出可用的驱动：? model: CK002

Searching supported drivers from Rap registry...

? select a driver for device "button"(CK002): (Use arrow keys)

> button-gpio@1.0.0

4. 选择 button-gpio 的最新版本并确认。rap 会根据选择自动下载驱动并配置设备信息到 app.json 文件。

六、硬件布局

1. 添加完外设后，我们需要重新对硬件进行布局(layout)和连接。在应用目录中执行命令 rap layout：

rap layoutrap 会对外设需要的资源进行自动分配，计算出设备间的连接方式，并生成新的 ruff_box.json 文件。除此之外，rap 还提供了图形化的布局编辑器，可以用于查看设备连线并进行简单的调整。在应用目录执行 rap layout --visual，rap 会下载设备的图片及针脚信息，以可视化的方式展示出来。

2. 根据 rap 计算出(或者编辑后)的方式对硬件进行连接。(建议在连接硬件的过程中断开电源。)

7绑定按键事件

1. 修改 src 目录下的 index.js，绑定 button 按键的 push(按下)和 release(释放)事件：$.ready(function (error) {

if (error) {

console.log(error);

return;

}

// 在 `#button` 按下时点亮 `#led-r`.

$('#button').on('push', function() {

console.log('Button pushed.');

$('#led-r').turnOn();

});

// 在 `#button` 释放时熄灭 `#led-r`.

$('#button').on('release', function() {

console.log('Button released.');

$('#led-r').turnOff();

});

});

$.end(function () {

$('#led-r').turnOff();

});对于其他驱动提供的 API，可以到在 Ruff 软件包仓库 搜索相应驱动及其使用说明。

2. 再次执行 rap deploy -s 命令部署并启动应用：

rap deploy -s试试看，按下和释放按键是不是能够点亮和熄灭红色板载 LED 了？

八、查看应用日志

为了更好地了解应用的运行状态，我们可以在应用中打印日志并通过 rap log 命令查看。

新建一个命令行窗口，进入应用目录，执行命令 rap log。当控制台显示 “Connected to device.” 时表示已经与开发板建立连接。

按下大按键，如果已经部署并启动了上一步修改后的应用，日志控制台应该会随即打印 “Button pushed.”，红色板载 LED 点亮。此时再释放大按键，控制台则会打印出 “Button released.”，红色板载 LED 熄灭。

简单的8个步骤即可高效率点亮一盏灯！