zoukankan      html  css  js  c++  java
  • github pages & 在线预览

          

        之前参加活动,提交demo时,自己只会提交github上的源码地址,看别人提交的不仅有源码地址还有在线预览地址,自己折腾了好久也没折腾出来,中间还遇见了js Bin、js Fiddle、极客标签。。。等,前几天遇见了github pages,,终于知道别人的github.io是哪来的了。。。做一下小整理。。。

    1   github上新建一个仓库,如test

    2   个人信息输入验证及配置密钥

         $ git config --global user.name "sunshineqtgit"

         $ git config --global user.email "m17855847521@163.com"

         $ ssh-keygen -t rsa -C "m17855847521@163.com"

         将生成的密钥(C:UsersDELL.ssh下的id_rsa.pub)配置到github上

    3   打开settings,有一个Github Pages的设置,点击source中的默认显示的None,使其变成master分支,即部署github pages的分支,然后点save

    4   页面刷新后,可在github pages处看到自己的github pages网址,如https://sunshineqt.github.io/test/

    5   点击该链接,显示一个test页面

    6   在电脑上选择一个位置,新建一个文件夹,如E: est706,在该文件夹下右击git bash here

    7   在上述文件夹下建立test文件夹:mkdir test

    8   然后进入该文件夹,cd test/

    9   克隆远程仓库:git clone https://github.com/sunshineqt/test.git

    10  将自己作品的文件复制粘贴到刚刚建的test文件中

    11  进入该文件夹 cd test/

    12  显示,列出当前目录所有还没有被git管理的文件和被git管理且被修改但还未提交的文件,也就是所有改动文件,红色字体标出 git status

    13  添加当前目录下的所有文件和子目录     git add .

    14  git status   全变绿了则准备好了被提交

    15  将文件上传至远程master分支:git commit –m “modify”

    16  git pull   第一次上传到该仓库需执行此操作,抓取远程仓库所有分支更新并合并到本地

    17  git push  push所有分支

    18  打开浏览器输入github pages分配的网址加上上传的主html文件名,回车即可看到效果图,如https://sunshineqt.github.io/test/doubanall/index.html

     

     

    git命令:

    git clone  //本地克隆远程仓库

    cd         //定位

    git status   //查看本地自己修改了多少文件

    git add .    //添加远程不存在的git文件

    git commit –m “description”  //提交修改

    git pull      //抓取远程仓库所有分支更新并合并到本地

    git push     //更新到远程服务器

    git rm     //移除文件

     

     

     

     

     

     

     

    2017-7-31 小记

     回来看博文,点开链接,有种惨不忍睹的感觉,为什么明明之前做过的小demo,演示也好好的,时隔多日之后就惨不忍睹了呢???我很疑惑。。

    2017-8-10

    还是之前整理的部分在线预览链接,现在居然又可以了!不知道以后还会不会出现问题。。。

    https://sunshineqt.github.io/test/doubanall/index.html (仿豆瓣APP,推荐谷歌浏览器检查模式下查看, http://www.cnblogs.com/haimengqingyuan/p/6760803.html 这里是自己录的效果图)

    https://sunshineqt.github.io/schoolmate/schoolmate/fangxyb/index.html (仿校友帮网站,推荐谷歌浏览器下查看,这里是自己录的效果图http://www.cnblogs.com/haimengqingyuan/p/6945497.html  )

    https://sunshineqt.github.io/test/five-in-line/index.html  (仿五子棋,推荐谷歌浏览器下查看,http://www.cnblogs.com/haimengqingyuan/p/5423877.html这里是自己录的效果图)
     
    https://sunshineqt.github.io/reader/reader/reading/demo.html   (阅读器,因文中引入文件位置,文本内容显示不出来,这里需要本地软件中打开预览,点击中间部分可显示样式设置效果,http://www.cnblogs.com/haimengqingyuan/p/7264654.html 这里是自己录的效果图)

    http://sunshineqt.github.io/programtest/programtest/webapp/index.html (组件式开发webAPP,推荐谷歌浏览器检查模式下查看,这里是自己录的效果图https://i.cnblogs.com/EditPosts.aspx?postid=6508951 )

    学习参考&感谢:

    http://www.cnblogs.com/lijiayi/p/githubpages.html

     

    宝剑锋从磨砺出,梅花香自苦寒来。
  • 相关阅读:
    501. Find Mode in Binary Search Tree
    [leetcode]Evaluate Reverse Polish Notation
    [leetcode]LRU Cache
    [mock]12月27日
    [mock]12月28日
    [leetcode]Max Points on a Line
    *[topcoder]JumpFurther
    [mock]12月11日
    *[topcoder]GUMIAndSongsDiv1
    [leetcode]Reorder List
  • 原文地址:https://www.cnblogs.com/haimengqingyuan/p/7145059.html
Copyright © 2011-2022 走看看