本地网站开发(在GitHub上创建和免费托管个人网站)

GitHub真是个好东西,除了可以进行软件版本和代码管理以外,还可以创建和免费托管个人网站。其中即可在线创建文件,也可以上传文件(不包括文件夹),也可以使用Git工具上传包含多个文件或文件夹的文件夹,当然也可以下载。GitHub上的repository相当于本地磁盘的文件夹,但其中文件的每次修改都会自动保存一个历史版本。1 Git, GitHub, and GitHub Pages分别都是什么?Git,GitHub和GitHub Pages都是非常密切相关的。 想象一下Git作为完成工作的工作流程,GitHub和GitHub Pages作为存储工作的地方。 使用Git的项目被公开存储在GitHub和GitHub Pages中,以一种非常普遍的方式解释: Git是你在自己的计算机上本地执行的任务,而GitHub则是你的任务在服务器上公开存储的地方。1.1 GitGit是一个版本控制系统,可以随时跟踪项目文件的变化。它通常会记录所做的更改(如:已添加的内容?从文件中删除的内容?),进行更改的人员,更改人员对更改的注释和注释,以及更改时间。它主要用于经常多人协作的软件开发项目,所以从这个意义上说,它是帮助实现和改进协作的工具。然而,它的合作性让它对出版社群产生了兴趣,一些社区将其作为编辑和编辑工作流程中提供帮助的工具。Git适用于那些希望以高效的方式维护多个文件版本的人,并及时返回访问不同的版本,而不会将大量文件与存储在不同位置的令人困惑的名称混杂在一起。想想Git和版本控制就像一个魔术撤消按钮。在下图中,每个阶段代表一个“保存”。如果没有Git,你就不能回到初稿和最终稿之间的任何阶段。如果您想在最终草案中更改开头段落,则必须删除无法恢复的数据。要解决这个问题,我们使用“另存为”选项,命名不同的东西,删除开头的段落,并开始写一个新的。使用Git,流程是多方向的。 每个重要的更改在版本中标记为重要,然后继续。 如果你需要回到早期阶段,你可以不丢失任何数据。 目前,Google Docs“修订历史”或维基百科的“修改历史”以这种方式工作。 Git只是更详细一些,如果需要的话可以变得更复杂。1.2 GitHubGitHub是使用Git的软件和Web开发项目(或其他基于文本的项目)的源代码的Web托管服务。 在许多情况下,大部分代码都是公开的,使开发人员可以轻松地调查、协作、下载、使用、改进和混合代码。 特定项目代码的容器称为存储库repository。GitHub上有成千上万个非常酷且令人兴奋的版本库,每天都会添加新的版本库。1.3 GitHub PagesGitHub Pages是通过GitHub免费托管的公共网页。 GitHub用户可以创建和托管个人网站(每个用户允许一个)和与特定GitHub项目相关的网站。 页面可以让你做和GitHub一样的东西,但是如果这个存储库是以特定的方式命名的,并且它里面的文件是HTML或者Markdown,你可以像其他网站一样查看这个文件。 GitHub Pages是GitHub的自我认识版本。 Pages还附带了一个名为Jekyll的强大的静态网站生成器。2 创建GitHub Pages2.1 注册个人帐户在https://github.com上注册个人帐户,如帐户名wwuhn,届时用你的帐户名做为你的个人页面登录名,如https://wwuhn.github.io/2.2 创建你的个人页面的仓库repository。 登录到您的GitHub帐户,并转到https://github.com/new或从您的帐户主页上单击添加新的存储库图标“+”:2.2 命名您的存储库wwuhn.github.io,确保它是公开的。特别注意:wwuhn.github.io中的wwuhn也就是GigHub的帐户名,必须相同,否则通过域名https://wwuhn.github.io/无法显示创建的主页。2.3 添加一个index.html文件做为个人网站的主页(开始页面)。2.3.1 单击存储库名称旁边的加号图标,然后直接在出现的输入框中输入文件名,创建一个index.html页面。2.3.1 在HTML文件中输入以下代码<!DOCTYPE html>
<html>
<head>
<title>wwuhn</title>
<style type=”text/css”>
body{
margin:auto;
width:66%;
}
ul li{
list-style:none;
display:inline;
list-style-position:inside;
}
</style>
</head>
<body>
<nav>
<ul>
<li><a href=”/”>Home</a></li>
<li><a href=”/about”>About</a></li>
<li><a href=”/cv”>CV</a></li>
<li><a href=”/blog”>Blog</a></li>
</ul>
</nav>
<div class=”container”>
<h3>Hi there, I’m Hank Quinlan!</h3>
<p>I’m best known as the horrible cop from <em>A Touch of Evil</em> Don’t trust me. <a href=”/about”>Read more about my life…</a></p>
</div><!– /.container –>
<footer>
<ul>
<li><a href=”mailto:[email protected]”>e-mail</a></li>
<li><a href=”https://wwuhn.github.io/”>git pages:https://wwuhn.github.io/</a></li>
</ul>
</footer>
</body>
</html>
如果网页中有中文或规定了字码编码,注意编码格式:<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />2.3.3 提交index.html。 在页面的底部,有一个文本输入区域,用于添加更改的描述以及提交文件的按钮。至此,一个简单的个人网页就已建立。打开浏览器,输入https://wwuhn.github.io/即可,主页为index.html。index.html及相关文件如果已在本地磁盘建立,也可以在上面的页面(https://github.com/wwuhn/wwuhn.github.io)内点击“Upload files”上传本地文件至https://github.com/wwuhn/wwuhn.github.io内,可以多选,但不能上传文件夹。3 使用git工具将包含有文件夹的整个本地站点上传参考:https://www.toutiao.com/i6589522244660101635/3.1 下载和安装Git工具下载地址:https://git-scm.com/downloads根据操作系统进行选择,windows版本的安装副本大概40M左右。git bash界面如下:符号$是命令提示符。3.2 将github上的witiso.github.io仓库克隆到本地文件夹f:\wwuhn$ cd f:\wwuhn
$ git clone https://github.com/wwuhn/wwuhn.github.io
3.3 git bash切换至wwuhn.github.io$ cd wwuhn.github.io
此时git bash上的提示符路径为:wwuhnwu01@wwuhnwu01 MINGW32 /f/wwuhn/wwuhn.github.io (master)
3.4 将文件复制到witiso.github.io文件夹内。3.5 本地磁盘目录中的文件(包括文件夹)加载到缓存将所有文件添加缓存(在index数据结构中记录文件提交之前的状态):$ git add .
(注意上面的命令使用了通配符:英文句点.)或$ git add –all
3.6 递交到本地Git仓库$ git commit -m “Initial commit”
(双引号内是提交注释)git commit命令可以将当前缓存中的文件实际保存到仓库的历史记录中。以上几个操作可随时git status查看本地git仓库中的基本情况。3.7 push到远程GitHub仓库的分支$ git push -u origin master
上述命名执行完后,整个F:\wwuhn\wwuhn.github.io文件夹中的全部内容就上传到了远程仓库https://github.com/wwuhn/wwuhn.github.io中。-End-

本文出自快速备案,转载时请注明出处及相应链接。

本文永久链接: https://kuaisubeian.cc/39368.html

kuaisubeian