这学期的项目设计课小组选题选择了制作一个机械臂STEAM教具，我的任务主要做用户所接触到的图形化编程界面。

采取的尝试

scratch_www搭建

文章来源：Windows 下搭建Scratch环境
scratch-www是scratch-gui的网页版，功能包括gui的编辑，保存，播放，和gui的作品展示，这里主要介绍scratch-www在window系统下的安装和运行。
必须安装的三个工具：git、python、nodejs

安装 git

下载链接：https://git-scm.com/downloads

  1. 注册或登录GitHub
  2. 下载git客户端并安装
    查看是否安装完成：安装完成后，在任意地方鼠标右键，打开 Git Bash Here，键入以下命令，验证是否安装完成
    1
    git --version
  3. 安装好git后，需要在PowerShell或CMD或git bash下配置用户信息：
    1
    2
    git config --global user.name "comecode.net"          #设置自定义用户名
    git config --global user.email "[email protected]"    #设置全局邮箱（此邮箱也是github账号）
    验证设置成功的命令：
    1
    2
    git config --global user.name  #查看设置的全局用户名
    git config --global user.email #查看设置的全局邮箱
    设置出错时，取消设置的命令：
    1
    2
    git config --global --unset user.name  #取消设置全局用户名
    git config --global --unset user.email #取消设置全局邮箱
  4. 生成SSH key
    1
    ssh-keygen -t rsa -C "github账号的邮箱" #邮箱换成你github账号的邮箱
    然后，需要输入的地方，一直回车即可。
    之后会在 【C:\Users\用户名.ssh 】下产生两个文件。其中，id_rsa是私钥，id_ras.pub是公钥。
  5. 配置github的SSH key
    登陆的你github，找到settings–>SSH and GPG keys，然后点击New SSH key
    Title可自定义，key则填入【C:\Users\用户名.ssh 】目录下的【id_ras.pub】的文件内容
  6. 验证配置好的Git
    PowreShell或CMD或Git Bash中，键入以下命令，检查是否配置成功
    1
    ssh -T [email protected]
    至此，在win 10系统上的git环境已经搭建完毕
安装python以及nodejs

python安装2.7版本，并需要把安装目录配置在Windows系统环境变量path中，重开CMD才能在CMD中直接使用；
下载链接：https://www.python.org/downloads/windows/
nodejs版本要求为8.0+版本，本人安装的12.16.2，并自带安装了npm
下载链接：https://nodejs.org/en/download/
设置npm安装源为淘宝源，国内源安装快。

1
npm config set registry https://registry.npm.taobao.org

验证是否成功：

1
npm config get registry
下载scratch-www源代码

从官网下载源代码有两种方式：

  1. 直接下载：直接下载的包很小，只有30M左右。
  2. 用git工具下载：git工具下载的包会很大，约300M左右。
    （注：多出的200多M是git的内容，一般都不会用到，由于服务器在海外，如果您选用git方式下载时，您差不多可安逸的吃碗泡面。）
    获取源代码方式1：直接下载版本。(推荐此方式)
    直接下载的链接：https://github.com/LLK/scratch-www
    左侧可选择你需要的版本，一般下载三类中的一类即可：develop（正在开发的版本）、master（主版本）、release（发布的版本，此版本可能会有多个，后面都标注有日期，建议选择最近发布的版本）
    获取源代码方式2：用git工具下载：（建议加上–depth=1，这样只获取最新版本，不下载历史库，包的大小就只有30M不到了）
    1
    git clone --depth=1 https://github.com/LLK/scratch-www
安装scratch-www依赖的N个包：npm install

进入scratch-www源代码目录后运行下面的命令：

1
npm install

注意：如果卡住了，或报错了，分析相应的错误并重新npm install。
如：遇到的问题：经常会卡在安装chromedriver这个模块，提示当前使用的chrome版本无效，需要下载指定版本的chrome(76.0.0),这个安装的话会访问google的网站，一般无法访问到，会导致安装失败。
解决办法是：在package.json文件的devDependencies属性中，把”chromedriver”: “76.0.0”这行删掉，先npm install好其他模块，再单独安装 chromedriver。

1
npm install --save-dev [email protected] --chromedriver_cdnurl=https://npm.taobao.org/mirrors/chromedriver

遇到的问题：Cannot download “https://github.com/sass/node-sass/releases/download/v4.6.1/win32-x64-79_binding.node"
解决办法是：先在package.json文件中删除 devDependencies属性中的"node-sass": "4.6.1"，然后

1
npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/

注：node-sass的安装，个人建议不管有没有遇到上面的问题，都删除package.json中的"node-sass": "4.6.1"，然后通过上面的命令单独安装，这是本人踩过的一个大坑：nodejs12以上的版本，需要node-sass4.12.0以上的版本。
另外：npm install 时，会报几条警告，基本上说是某个包没安装，但被另一个包所依赖，此时可以单独用下面的命令一个一个的安装所需要的包，也可以跳过这些警告不处理，至于不处理这些警告会有什么后续问题，本人现在还不知道（好尴尬啊）

1
2
npm install xxx             #xxx 为需要单独安装的包名，也可以带版本的安装
npm install [email protected]       #此为带版本安装的格式

到此，npm install完毕。

修改scratch-www目录下的packpage.json

官网的scratch-www是要linux系统下编译运行的，有些指令在window系统下无法使用，需要修改packpage的scripts属性中的一些指令。

  1. 临时环境变量，在windows下，需要用set 才能设置成功。
  2. “rm -rf”是在linux下才有的指令。这条指令是用来删除build和intl这两个文件夹，再重新创建这两个文件夹，我们使用rimraf 来代替 rm 指令。
    修改 package.json:
    把
    1
    "build": "npm run clean && npm run translate && NODE_OPTIONS=--max_old_space_size=8000 webpack --bail",
    修改为：（在NODE_OPTIONS前 ‘set’ ）
    1
    "build": "npm run clean && npm run translate && set NODE_OPTIONS=--max_old_space_size=8000 webpack --bail",
    把
    1
    "clean: "rm -rf ./build && rm -rf ./intl && mkdir -p build && mkdir -p intl",
    修改为：
    1
    "clean": "rimraf ./build && rimraf ./intl && mkdir build && mkdir intl",
    安装rimraf:
    1
    npm i -g rimraf
    编译scratch-www：
    1
    npm run build
    与gui直接运行npm start 不一样，scratch-www安装后第一次运行时，需要先运行npm run build 再运行npm start。
    为什么呢？因为scratch-www是多语言的网页，需要先创建语言文件，才能正常运行，显示。
    npm run build 时，会删除build和intl文件夹，再translate远程获取语言文件。
    build指令如下：
    1
    npm run build
    package.json中还有几条translate指令:
    1
    2
    3
    "translate:urls": "node ./bin/get-localized-urls localized-urls.json",
    "translate:files": "node ./bin/build-locales node_modules/scratch-l10n/www intl",
    "translate": "npm run translate:urls && npm run translate:files"
    有时运行到npm run translate:urls指令时会卡住，访问不到远程文件，导致npm run build失败。
    这是因为scratch官网被我国封锁了，请全局科学上网再执行npm run translate:urls。
    如果你npm run translate:urls 成功后，建议把这指令删除掉，即把上面最后一行改成：
    1
    "translate": "npm run translate:files"
    因为scratch-www需要的几十种语言文件，并不都需要，这样每次npm run build也会节省我们时间。
    至此，编译完毕。
git 操作

需要运行下面3个指令完成git的初始化及准备提交的动作，在npm start时需要这几个操作的支持才能正常运行：

1
2
3
git init
git add .
git commit -m firstcommit

多语言支持：

1
npm run translate    #有多语言需要时

最后一步：运行scratch-www：

1
2
make translations
npm start

至此，恭喜您，您现在可在浏览器中打开 http://localhost:8333/ 即可开始访问你本机的scratch-www了

作为服务运行

node应用通过npm来执行，但是每次执行都需要一直保持，一旦关闭当前Terminal，程序就将终止。为了保持程序持续运行，可以使用forever

  1. 安装forever
    1
    npm install forever -g
  2. 进入应用目录运行程序
    1
    forever start app.js
    也可以通过下面的方式运行：
    1
    forever start -c "npm start" ./
    可以通过下面命令查看正在运行的应用：
    1
    forever list

现成的scratch二次开发平台

文章来源：Scratch被禁，国产少儿编程平台哪个好？

  1. Mind+（http://mindplus.cc/）
    Mind+主要就是针对国内科技创新教育需求而开发的图形化编程软件，也是国内最早的图形化编程软件工具之一。在Scratch平台不能使用后，惊喜发现它完全可以兼容sb3格式保存的编程文件，其程序文件甚至可以一键导入到软件中，实现了对Scratch功能的无缝对接。目前很多学校老师、同学很多都在使用的一款编程软件。
    Mind+最大优点是对硬件的支持非常丰富。直接支持中小学创客教育最常用的主流开源硬件如：Micro:bit、掌控板、ESP32和Arduino Uno等，可对上百种常用硬件模块进行编程控制，包括各种传感器、执行器、显示器、通讯模块、功能模块等；并且开放用户库，用户可以自己制作扩展库。另外，Mind+还能满足中小学老师对于AI人工智能知识教学的各种需求，支持 AI 与 IoT ，除了图形化编程，还可以使用 Python/C/C++等高级编程语言。
    Mind+已在国内历经8年打磨，已然成为科创教育学科、竞赛中普遍使用的青少年编程软件之一。
  2. KittenBlock（https://www.kittenbot.cn/）
    KittenBlock是小喵科技出品的一款儿童图形化编程软件，可以帮助中小学生或者非专业的技术人员快速入门编程，从而控制各种各样的电子模块。最大的特点其扩展功能丰富，尤其是人工智能AI这一块，很值得研究，如果是高水平进阶者，甚至可以自己开发相关的插件。对比Scratch功能，KittenBlock也已有了相关的替代功能，比如百度大脑这个模块可以实现文字朗读，语音识别等。另外Kittenblock也支持C++（Arduino）、python编程。
  3. 慧编程V5（https://mblock.makeblock.com/zh-cn/）
    慧编程是一款面向STEAM教育领域的积木式编程和代码编程软件，基于Scratch3.0开发，近400万用户用它创造、学习和分享。它不仅能让用户在软件中创作有趣的故事、游戏、动画等，还能对Makeblock体系、micro：bit等硬件进行编程。
    特点提炼：
    1.慧编程V5除了动画创作和游戏制作外，还支持对机器人和开源硬件编程
    2.配合硬件教学，让课堂教学内容和形式更丰富；
    3.支持丰富的开源硬件，满足更多课程需求，提高课堂创造效率
    4.支持一键切换Python和Python输入模式，实现从图形化编程到代码编程的进阶教学
    5.配套教学资源和课堂管理平台，打造高效课堂
    6.支持AI和IoT黑科技，可设计各种趣味应用
    7.即将支持多平台使用，提供流畅的编程教学体验
  4. 其他软件
    目前还有一些儿童编程替代软件，如扣叮、编程猫、kitten等，大家感兴趣都可以搜索下载尝试。

体验：
以上三个平台都是基于scratch二次开发，可以在平台上自制积木，平台有不少开源硬件的拓展套件，优先选择在已有的主控板（Arduino、micro：bit）上开发能节省时间，能直接使用已有的双向通信接口。
Mind+上拓展套件较多，Mind+内置支持上百种常见的传感器库，并从V1.6.2开始，开放用户库，任何用户均可以制作和分享自己的用户库，并提供了本地及网络加载方式，方便大家的使用。（教程：https://mindplus.dfrobot.com.cn/）
Kittenbot上有一个关于Microbit-机械臂的说明文档：（与我本学期项目相关度高）
https://learn.kittenbot.cn/kits/armKit/arm.html
在线ide上显示的拓展很少
Makeblock慧编程上拓展套件较多，可成为开发者添加拓展。（帮助文档：http://www.mblock.cc/doc/zh/）

参考文章

mark一下可能会用到的文章：
Scratch-www系统在CentOS上搭建
Python与Scratch的双向通信
使用Python拓展Scratch的能力

关联阅读

80种可视化编程语言及其界面效果图