慕课教程视频网址：
https://www.imooc.com/video/17302
技术栈：
已经安装npm和node
webpack的基础
了解 html javascipt css 和 nodejs 基础知识。
了解 git 常用操作。

第一章：什么是开源

开源并不是仅仅贡献一份实现某种功能的代码，而是还是要包含以下东西：

第二章：做什么？

很多开源项目的产生是由于日常工作生活中有某个需求了，但是并没有对应的开源项目，于是就开始做出来，并把它开源了。
想要做开源项目，你就得有一个预先的期望，然后再去想做什么？
一来要能快速做出第一版，然后慢慢迭代。
二来要方便地进行推广，最好零成本使用。

这是一个缓存工具，整合localStorage，以及合理地内粗销毁机制。

第三章：在github上创建一个项目

第一步：github上项目地创建：

创建好了就进入了项目主页：

第二步，是添加ssh key

ssh key就是链接你地电脑和github服务器地一把钥匙，只有添加成功了才能把你本地地代码提交到github服务器。
这里我还不懂https和ssh克隆的区别，查了一下：

在git中clone项目有两种方式：HTTPS和SSH，它们的区别如下：
HTTPS：不管是谁，拿到url随便clone，但是在push的时候需要验证用户名和密码；
SSH：clone的项目你必须是拥有者或者管理员，而且需要在clone前添加SSH Key。SSH 在push的时候，是不需要输入用户名的，如果配置SSH key的时候设置了密码，则需要输入密码的，否则直接是不需要输入密码的。
在git中使用SSH Key的步骤：
检查电脑是否存在SSH Key：$ cd ~/.ssh$ ls
如果存在id_rsa.pub 或 id_dsa.pub 文件，说明文件以及存在，跳过创建SSH Key步骤。
创建SSH Key
将公共的SSH 放到远程仓库上

这里采用ssh的方法吧！

因为我还是前端小萌新，当然得有小萌新的亚子！我用windows!!
这篇博客就讲了生成ssh key的流程：https://blog.csdn.net/tanzhengyu/article/details/51064380
然后我就装好啦！

第三步：拷贝项目到自己的电脑上

这样之后我桌面就多了这个项目的文件夹：

进入这个文件夹，修改当前git的用户名和邮箱：

git config user.name 'fast-cache'
git config user.email 'fast-cache@gmail.com'

第四步：验证下ssh是否添加成功

随便修改下readme的内容，打开代码，修改下：

打开Git查询状态：

查看下未暂存的修改：

将修改添加到缓存区，并提交修改：

将变更的代码提交到远程仓库：

然后刷新github上的项目：

说明已经提交成功了，说明可以正常的下载和提交项目，后续的工作可以正常进行了！

第四章：初始化项目的开发环境

这里需要提前安装好npm和node,我之前就装好了。

第一步：初始化一个环境：npm init

这样的话，目录下就会多出一个名为package.json的文件：

值得注意的是这里的版本号，我定义为0.0.1,是因为版本号分三级：

第二步：规范一级目录

创建这几个文件夹：

第三步：创建入口文件：index.js(先前初始化设置好了，但是未创建)

第四步：构建工具，这里用webpack。

 npm i babel-core babel-loader babel-polyfill babel-preset-es2015 babel-preset-latest webpack webpack-cli --save-dev

安装完成之后会多出这些东西：

（注意，这里的两个babel版本会冲突，解决办法点击这里）

第五步：在fast-cache（项目根目录）下创建.babellrc文件

这是babel的配置文件

第六步：在fast-cache（项目根目录）下创建webpack.config.js文件

webpack配置内容如下：


module.exports={entry:'./src/index.js',output:{path:__dirname,filename:'./release/bundle.js'},module:{rules:[{test:/\.js?$/,exclude:/(node_modules)/,loader:'babel-loader'}]}
}

第七步：设置打包的脚本命令行

这样直接命令行：npm run release就可以用webpack进行打包。打包后生成项目文件：

但是这个代码打包出来，我们需要测试一下是否成功。

第八步：测试

安装这个浏览器工具：
npm install http-server -g
然后再在package.json中加一行：

 npm run example

再在浏览器输入地址就可以啦：

这就说明我们原代码，到打包出来的代码，已经跑通了！

第九步：规范git分支

可以看到，现在只有主分支master.

第十步：完善readme

这样，就完成了初始的配置：

第五章：提交代码

第一步：开源项目主体代码的书写

假设此时我们的代码已经书写完毕：

测试用例：

再用npm run release发布一下，npm run example运行。

第二步：书写文档和测试用例

这里主要讲文档的书写：
这里需要先全局安装一个文档的工具，它能够帮助程序员快速地创建文档，并发布成html格式。
安装地命令行：npm i gitbook-cli -g

然后在根目录下创建SUMMARY.md，内容如下：

# Summary* [Introduction](README.md)
* [使用文档](doc/use/README.md)* [使用1](doc/use/use1.md)* [使用2](doc/use/use2.md)
* [二次开发](doc/dev/README.md)*  [开发2](doc/dev/dev1.md)* [开发2](doc/dev/dev2.md)

然后命令行执行gitbook init

在doc下，就出现了这些文件：

接下来开始完善开发文档：

文件已经构建好了，这时候，就可以把它们加到根目录下的readme中去：

现在要把着文档变成html的格式，让用户更方便阅读：gitbook build

在项目的根目录下，就会把根目录下的文件处理成Html格式：生成的文件放在_book文件夹下:

然后运行代码npm run example，浏览器打开对应地址：

但是又因为这个_book是不提交的，所以在gitignore里面要加上这个：

这样之后，git就忽略了它，检查不到了，

第三步：提交第一版的代码

git add ./
git commit -m "v0.0.1 初次提交"
git push origin master

设置tag：

git tag -a 'v0.0.1' -m "第一版本"
git push origin  v0.0.1

这样之后：tag里面就多出一个了：

点击进去：
就可以下载这个版本的所有代码了！
接着将这个地址放到readme.md上：

第四步：提交到npm上，让用户可以通过npm install安装

 npm add usernpm login然后填写你的npm账号和密码以及注册邮箱

接下来发布，因为这个fast-cache-npm已经被发布过了。所以package.json里面的名字更改下：
我改成：fast-cachee-npm，再发布：

npm publish .

这样一来，你的npm上就会多出一个来：

点进去：用户就可以直接在命令行安装这个包！

于是readme.md可以继续更新信息：

这样，初步提交代码，发布的流程就结束了！

第六章，版本迭代

第一步，创建新的分支

创建开发的dev分支，并指向这个新分支：

git checkout -b dev

第二步：修改代码

假设，这就是修改后的代码。
然后再在package.json里面把版本升一级：

再接着修改对应的文档和测试用例
自测一下代码是否可行。

第三步：将dev分支切换到远程

 git add ./git commit -m "v0.0.2"git push origin dev

github上就出现了两个分支：

第四步：将dev合并到master,并提交master到远程

 git checkout master  //将指针指向主分支git merge dev  //将dev合并到mastergit push origin master//master到远程

第五步：创建tag ,提交到远程

git tag -a v0.0.2 -m "v0.0.2"
git push origin v0.0.2

第六步：发布到npm

npm publish .

第七章，利用github pages创建官网

第一步：创建gitpages项目

具体的教程在这里：
https://pages.github.com/

进入这个目录：里面有一个readme：

然后打开这个项目：
新建index.html文件，随便写点东西：

提交到远程：

于是就可以直接访问了：

第二步：生成项目的官网

先将之前更改的文档使用gitbook build更新一下

然后把生成的_book下的东西拷贝到官网的目录下：

这样的话，这个官网就出来了：

github开源的流程-慕课网教程学习笔记相关推荐

rviz-Ros Wiki官网教程学习笔记(1)-用户指南
0.rviz介绍 rviz是ROS自带的图形化工具,可以很方便的让用户通过图形界面开发调试ROS. 参考官网 rviz/UserGuide 1.安装根据自己的版本号,在下面选择对应的命令执行.以RO ...
慕课网android 学习笔记
1.android布局原则: (1)将可复用的组件抽出来并通过include标签使用. (2)使用viewstub标签来加载一些不常用的布局. (3)使用merge标签减少布局的嵌套层次. http: ...
慕课网 springboot学习记录
https://www.imooc.com/learn/956 idea ctrl+shift+r全局查找 springboot相关慕课网知识学习总结 demo项目生成:可以从spring官方生成, ...
廖雪峰Git教程学习笔记
廖雪峰git简单教程学习笔记教程地址:https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b ...
大数据Hadoop教程-学习笔记02【Apache Hadoop、HDFS】
视频教程:哔哩哔哩网站:黑马大数据Hadoop入门视频教程教程资源:https://pan.baidu.com/s/1WYgyI3KgbzKzFD639lA-_g 提取码: 6666 [P001-P ...
无敌python爬虫教程学习笔记（一）
python爬虫系列文章目录无敌python爬虫教程学习笔记(一) 无敌python爬虫教程学习笔记(二) 无敌python爬虫教程学习笔记(三) 无敌python爬虫教程学习笔记(四) 本文目录 ...
Linux教程学习笔记
Linux教程学习笔记目录 Linux教程学习笔记写在前面虚拟机 Linux目录结构远程登录Linux系统 vi和vim编辑器关机.重启和用户登录注销用户管理实用指令组管理和权限管理 ...
阿里云高校计划视觉AI五天训练营教程学习笔记
阿里云高校计划视觉AI五天训练营教程学习笔记 Day 1 Topic: 视觉生产技术定义:通过(一个或者一系列)视觉过程,产出 **新的** 视觉表达. 分类通用基础框架关键维度精细理解--举 ...
黑马程序员最新版JavaWeb基础教程-学习笔记
da@黑马程序员最新版JavaWeb基础教程-学习笔记 day06-HTML&CSS HTML HTML(HyperTest Markup Language):超文本标记语言是一门语言,所有 ...
【从零开始的大数据学习】Flink官方教程学习笔记（一）
Flink官方教程学习笔记学习资源基础Scala语法 Scala数据结构专题声明变量代码块函数(function) 方法(methods) Traits (接口) class(类) tupl ...

github开源的流程-慕课网教程学习笔记