Add guide for tuture hub

Author: mrcfps

.vuepress/config.js

@@ -44,6 +44,7 @@ module.exports = {
             'installation',
             'start-writing',
             'sharing',
+            'hub',
             'configuration',
             'advanced',
           ],

assets/image-20191123150907849.png

@@ -0,0 +1,109 @@
+# 图雀社区漫游指南
+
+## 关于教程
+
+我们可以看一下下面这张图，这是图雀社区的某篇讲授 Django 快速入门的教程，你以后在图雀社区里面看到的和将要学习的每篇教程都会是这样的形态，具体主要包含以下几个部分（截图中以数字标明）：
+
+- 1：是整个教程的目录，具体会分为一个一个的步骤
+- 2：教程的标题
+- 3：此教程的发表时间和更新时间
+- 4：此教程所属的分类，表示该教程是属于前端还是后端，语言/技术，内容难度等
+- 5：此教程的阅读次数，代表此教程的受欢迎程度
+- 6：教程包含的字数，以及通过程序大致计算阅读此教程需要花费的时间，帮助你合理的判断阅读是否存在充裕的时间阅读
+- 7：关于此教程的一个简介，具体会讲述这门技术的一些现状和历史，以及此篇技术教程将完成的东西，让你在开始阅读正文之前就对教程有一个比较初步的了解
+- 8：贡献此篇教程的作者，主要包含：Github 头像，Github 用户名，托管此教程的 Github 代码仓库。你点击左边的头像或用户名，会前往此教程作者的 Github 用户主页，如果您对这位作者感兴趣，可以在 Github 上 Follow 它；你点击查看代码，就会前往此篇教程的代码仓库的 Github 地址，如果你觉得这篇教程对你有帮助，不妨给作者 Star 一下，以表示对作者的感谢，或者给作者一点鼓励（Github Sponsors 功能）
+- 9：每篇教程都会在教程开始时给定对应需要的预备知识，以及相应的学习目标，进一步明确你对此教程的投入将获得什么样的回报，你是否可以通过学习此篇教程解决现有手头的问题。
+- 再往下就是教程的正文内容
+
+![](../assets/image-20191123150907849.png)
+
+## 关于评论
+
+当你翻到每篇教程的底部，你会发现我们还为每篇教程提供了评论入口，我们的评论使用了 [Gitalk](https://github.com/gitalk/gitalk)，即将 Github 仓库的 Issue(提问题) 的板块作为了教程的评论后台，所以如果你有评论的需求，你需要首先注册 Github 账号。
+
+![](../assets/image-20191123160237465.png)
+
+图中圈出了当你没有使用 Github 登录时，你可以通过点击这两个按钮，跳转到 Github 的登录页面，如果你还没有 Github 账号，那么我们强烈建议你注册一个，同时这也是图雀社区推荐的做法："每一个学习编程的人都应该要了解 Github，并首先从拥有一个 Github 账号开始”。
+
+当你使用 Github 登录之后，你的界面看起来是下面这样的：
+
+![](../assets/image-20191123160800771.png)
+
+在图中的标号 1，你可以点击蓝色的文字前往图雀社区 comments 仓库，此篇教程对应的 Issue 评论地址。图中标号 2 代表你登录后的 Github 用户名显示，你可以点击这个按钮，然后进行注销登录操作。图中标号 3 就是评论区域，你可以使用 Markdown 语法进行评论，评论过程中，可以点击右下角的预览查看自己的 Markdown 显示效果。
+
+## 关于步骤
+
+因为图雀社区所以的技术实战教程都是使用开源工具 [Tuture](https://github.com/tuture-dev/tuture) 写成，而 Tuture 是对 Git 的每个 Commit 进行抽取，从而形成我们教程的每个步骤，所以每个步骤的核心代码都是相对上一步核心代码的变化，这里的变化有两层含义，即：
+
+- 核心代码展示并不是一个完整可运行的代码
+- 核心代码中**加粗**的代码表示相对上一步代码进行新增，有一定~~透明~~的代码表示相对上一步代码的删除
+
+接下来我将用具体的实例给你展示一下这些变化：
+
+比方说，我们现在在这篇教程的第三个步骤中，我们可以看到此时步骤的 `news/views.py` 文件的内容是这样：
+
+![](../assets/image-20191123155125168.png)
+
+我们可以看到内容中有些代码文字颜色比较淡：比如步骤 1 和 3，这个代表相对上一步的 `news/views.py` 文件来说，这些淡的代码内容被删除了。有些代码文字被加粗了：比如步骤 2 和 4，这个代表相对上一步的 `news/views.py` 文件来说，这些加粗的代码是新增的。
+
+所以这个 `news/views.py` 之前的内容是这样的：
+
+```Python
+from django.shortcuts import render
+
+# Create your views here:
+```
+
+经过第三步的修改变成下面这样：
+
+```Python
+from django.http import HttpResponse
+
+def index(request):
+    return HttpResponse('Hello World!')
+```
+
+再比如，我们看到第四步的内容如下：
+
+![](../assets/image-20191123153050324.png)
+
+其中标号数字为 1 和 4 的内容被透明处理了，这个代表相对第三步，这两行内容被删除了。其中标号为 2 和 5 的内容被加粗了，这个代表相对第三步增加的内容。其中标号为 3 的内容是正常格式，这个代表相对上一步，这一行代码没有变化。
+
+所以在第三步 `news/views.py` 的代码是这样的：
+
+```Python
+from django.http import HttpResponse
+
+def index(request):
+    return HttpResponse('Hello World!')
+```
+
+经过修改，到第四步，`news/views.py` 的代码是这样的：
+
+```Python
+from django.shortcuts import render
+
+def index(request):
+    context = {
+        'news_list': [
+            {
+                "title": "图雀写作工具推出了新的版本",
+                "content": "随随便便就能写出一篇好教程，真的很神奇",
+            },
+            {
+                "title": "图雀社区正式推出快速入门系列教程",
+                "content": "一杯茶的功夫，让你快速上手，绝无担忧",
+            },
+        ]
+        }
+
+    return render(request, 'news/index.html', context=context)
+```
+
+对于上面的变化，你可能一开始接触的时候会感到有点迷茫，甚至不知所措，但是相信我，当你对图雀社区实战教程的运行机制有了一定了解之后，你一定会觉得这种变化是非常合理的。
+
+## 关于好处
+
+每篇教程都会有明确的步骤，每一个步骤的致力于讲解一个完整的知识点，并且会运用这一步骤学到的知识点完成这个完整项目的一部分，并且每个步骤的代码都会依赖于上一个步骤的代码，最终所有的步骤会串成一个整体，当关于技术的知识点讲完之后，你也完成了一个完整的项目。
+
+通过这样的方式，你不仅知道这门技术的概念是什么，还能知道这些概念如何组合在一起并为一个实际的项目服务，这就是图雀社区希望每篇教程能够达到的效果：既知树木，也见森林。