!61 feat: 新增建木初体验文档。

Merge pull request !61 from 冯浩/master

.vitepress/config.js

@@ -56,7 +56,11 @@ module.exports = {
           {
           text: '如何部署',
           link: '/guide/how-to-deploy',
-        }]
+        },{
+          text: '建木初体验',
+          link:'/guide/first-project',
+          }
+        ]
       },
       {
         text: '如何使用',

guide/first-project.md

@@ -0,0 +1,63 @@
+# 建木初体验
+
+通过示例项目`hello jianmu`体验建木图形化流程编排，完成你的第一个建木流程。
+
+### 操作步骤
+1、打开建木图形化编排。
+
+![](./images/first-project-entrance.png)
+
+2、在左侧节点菜单中找到`git clone`和`shell`节点并拖拽到右侧画布上，鼠标移入到`git clone`拖动连接`shell`节点。
+
+![](./images/first-project-chart.png)
+
+3、点击`git clone`节点，在右侧参数抽屉中找到`git地址`，粘贴克隆地址：`https://gitee.com/jianmu-dev/jianmu.git`。
+
+![](./images/first-project-gitclone.png)
+
+4、点击`shell`节点，在右侧参数抽屉中选择docker镜像`alpine:3.16.0`。
+
+![](./images/first-project-image.png)
+
+5、新增环境变量。点击`shell`节点右侧参数抽屉中的`添加环境变量+`。输入变量名，点击变量值右侧参数按钮，可以选择对应的参数（只有和上游节点连接后才能选择参数）。
+
+![](./images/first-project-shell.png)
+
+**完整环境变量定义示例：**
+
+![](./images/first-project-shell-show.png)
+
+6、在`shell`节点右侧参数抽屉中的`脚本`中输入以下`echo`命令，执行后的日志中会输出这里定义的环境变量。 脚本示例：
+```shell
+echo Hello 建木
+echo 目录: ${DIR}
+echo 分支: ${BRANCH}
+echo 标签: ${TAG}
+echo id: ${COMMIT_ID}
+```
+
+![](./images/first-project-script.png)
+
+
+7、编辑项目名，选择组名后保存并返回。
+
+![](./images/first-project-edit.png)
+
+
+8、找到刚新建的`hello jianmu`，手动触发这个流程。
+
+![](./images/first-project-trigger.png)
+
+9、点击流程名称，进入流程详情页。
+
+![](./images/first-project-detail.png)
+
+
+10、等待执行结束查看`shell`节点日志即可。
+
+![](./images/first-project-logs.png)
+
+
+### 展示效果
+
+![](./images/first-project-result.png)