美文网首页
github建站展示(前端必备 静态页面)

github建站展示(前端必备 静态页面)

作者: sissi110 | 来源:发表于2017-08-07 23:18 被阅读0次

    (动态网站展示外网请参考另外一篇文章,这个仅限于静态网站)
    google一下了解到Github有一个Github pages的功能可以搭建博客或者托管网页,而且免费耶,搜了下教程,猛地一看感觉步骤也不是很麻烦,所以就用这个了!

    开始教程之前的准备工作:
    1、需要你自己写的网页文件。
    2、注册Github。
    3、下载安装git。

    你的前提工作:

    本地git要配置一些东西
    第一个要配置的是你个人的用户名称和电子邮件地址。这两条配置很重要,每次 Git 提交时都会引用这两条信息,说明是谁提交了更新,所以会随更新内容一起被永久纳入历史记录:

    $ git config --global user.name "John Doe"
    $ git config --global user.email johndoe@example.com
    如果用了 --global 选项,那么更改的配置文件就是位于你用户主目录下的那个,以后你所有的项目都会默认使用这里配置的用户信息。如果要在某个特定的项目中使用其他名字或者电邮,只要去掉 --global 选项重新配置即可,新的设定保存在当前项目的 .git/config 文件里。

    (一)github down下来一个项目,修改再提交

    教程开始:(以下出现的test指你的网页名或者你想起的一切名字)
    步骤一:登录到Github上,新建一个repo,命名为test,勾选 initialize this repository with a README,点击create repository。

    步骤二:打开settings,有一个Github Pages 的设置,点击 source 中的本来的 None ,使其变成 master 分支,也就是作为部署github pages 的分支,然后点击 save。

    步骤三:页面刷新之后,再看 github pages 设置框处,多了一行网址,就是你的 github pages 的网址了。

    步骤四 :打开此电脑,选择一个盘,比如 f 盘,右键空白处点击 git bash here。

    步骤五:输入如下命令,用来在 f 盘创建 test 文件夹放你的github上的test repository,克隆test repository到 test 文件中。
    $ git clone https://github.com/[username]/[directory].git
    这个时候你的 f 盘,就会多一个 test 文件,打开它,

    会看到一个 README.md 的文件,这个文件是从哪来的呢?追溯到gihub上,你会发现 README 文件是来自 master 分支。

    步骤六: 将自己的网页文件复制粘贴至 f 盘的 test 文件中

    步骤八:执行如下命令

    解释一下上面的命令:首先输入 git status 列出当前目录所有还没有被git管理的文件和被git管理且被修改但还未提交(git commit)的文件,也就是所有改动文件,红色字体标出。
    然后输入 git add . (有个点) 表示添加当前目录下的所有文件和子目录,
    然后 再输入一次 git status 如果看见文件都变绿了 ,那么就代表 它们已经准备好了被提交(git commit)。

    步骤九:输入如下命令,将你的文件上传至远程 master 分支
    git commit -m "modify"
    git pull
    输入最后一行 git push,按回车,等一会,会有弹出框让你输入你的 github 账号和密码。

    ok之后耐心等待。
    当出现像下图中的语句之后,你已经完成了99%。

    最后一步:打开浏览器输入给你的网址加上你上传的 html 文件名 test.html,然后重重的按下回车。

    (二)本地项目第一次上传github

    1 git init
     
    选择要添加进仓库的文件:
    2 git add .
     
    一般如果你想分享这个文件夹里的所有代码,就在 add后面加“.”,上面的例子就是这样,如果传指定的,只需要把“.”改为文件名即可,现在只是选择了要加入仓库的文件,下面才是添加进入仓库:
    3 git commit -m 'Test'
     
    -m后面跟一个参数,表示说明,将代码提交到GitHub后,将会在代码文件信息上显示这个说明,如下图标记的地方。
    搞了这么久,现在才开始把本地仓库上传到GitHub了,下面两行命令搞定问题:
    首先需要pull下代码,才能push上传成功
    (git pull origin master)
    继续下面的操作
    1  git remote add origin git@github.com:XXX/XXX.git
    2 git pull origin master
    3 git push -u origin master
    

    第一次:
    git init
    git add README.md
    git commit -m "first commit"
    git remote add origin https://github.com/xiaoxi110/Project.git
    git push -u origin master

    (三)关于一个仓库如何上传多个项目

    之前自己总是一个项目一个仓库 不好管理
    一些小的demo可以集成一起到一个仓库
    假如现在你有三个项目
    一个:e:/a/one
    e:/a/two
    e:/b/three
    a文件夹根目录下git init
    git add . //(全部项目)
    git remote add origin https://github.com/xiaoxi110/Project.git
    如果不报错----》你就跟以前一样提交ok
    (我的报错了)

    分析原因:
    看看origin 本体git还是一个指令是clone就是克隆。一个项目的刚开始,在服务器端,建立一个 origin,就是本体然后在本体基础上 clone到本地,就是克隆,也可以分支。clone在本地的,叫master,有种本地的 本体的味道,因为本地的还可以根据master进行分支,或者被别人再clone
    
    so   
    因为自己没有pull 本体
    可能加上git pull origin master
    自己可以试一试
    
    Paste_Image.png

    如果报错---》你敲一下git status

    Paste_Image.png

    ------>一个一个项目提交
    请不要all项目用 orign 去提交

    Paste_Image.png Paste_Image.png

    附录一:常用git命令:

    $ git clone //本地如果无远程代码,先做这步,不然就忽略
    $ cd //定位到你blog的目录下
    $ git status //查看本地自己修改了多少文件
    $ git add . //添加远程不存在的git文件
    $ git commit -m "what I want told to someone" //提交修改
    $ git push //更新到远程服务器上
    $ git rm //移除文件

    附录二:如何修改你的网页?

    方法一:在github上的master分支中直接进行修改。(如果不添加新的文件推荐此法)
    方法二:在github客户端进行修改在同步。(如果添加了新的文集推荐此法)

    相关文章

      网友评论

          本文标题:github建站展示(前端必备 静态页面)

          本文链接:https://www.haomeiwen.com/subject/kxjmlxtx.html