教你免费搭建个人网站(GitHub Desktop)

(4) 2024-09-04 15:12

Hi,大家好,我是编程小6,很荣幸遇见你,我把这些年在开发过程中遇到的问题或想法写出来,今天说一说
教你免费搭建个人网站(GitHub Desktop),希望能够帮助你!!!。

▲ 点击新的灵感关注我们

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第1张

GitHub Desktop 是GitHub公司发布的一款桌面版应用。无论您是Git的新手还是经验丰富的用户,GitHub Desktop都可以简化您的开发工作流程。不需要使用Git命令,即可把您本地代码轻松上传到GitHub进行托管。下面我来教大家使用此工具快速免费的搭建属于自己的个人网站。

1

-THE FIRST-

首先,您需要确认你本地有一份可以正常打开预览的个人网页源码。如果您没有网站开发基础的话请不要继续向下阅读,您可以选择在后台和我留言,我很乐意帮助您继续完成属于您的个人网站。

2

-THE SECOND-

如果您满足上一条件,请访问GitHub Desktop官网,下载您电脑对应版本的软件安装包,安装并打开。登录自己的GitHub账号(没有账号的同学请在GitHub官网注册,这里就不教大家了)。

点击File-New repository 创建一个新本地仓库,下图是各个输入框的说明:

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第2张

仓库信息填写完毕后,点击下方的Create创建本地仓库。然后点击软件上方的Publish按钮,把这个本地仓库发布到GitHub上。

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第3张

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第4张

一定注意不要选中底部单选按钮。信息填写完毕后,我们点击Publish,这样新的GitHub仓库就创建完成了。

3

-THE THIRD-

重点来了,把你本地网站的源码全部拖到新建的GitHub仓库中来:

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第5张

如果是使用了VUE CLI等脚手架工具生成的项目,只需要把打包完成后的静态文件拖进来。

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第6张

我们再次打开GitHub Desktop,会发现这个有一个文件改变的提示。

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第7张

这时候我们点击下方的Commit按钮提交本次更改

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第8张

提交完成后,我们点击页面上方Push按钮,等待完成,这时我们的本地代码就上传到GitHub中了。

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第9张

4

-THE FOURTH-

我们在GitHub官网点击右上角头像,再次点击Your repositories查看我们刚刚建好的仓库。在打开的新页面中点击刚才新建的仓库名字进入到仓库中。

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第10张

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第11张

点击仓库导航栏中的setting按钮,把仓库名字改成您的“GitHub名字.github.io",点击Rename等待完成。

教你免费搭建个人网站(GitHub Desktop)_https://bianchenghao6.com/blog__第12张

5

-THE FIFTH-

到这里您的个人网站已经搭建完成,在浏览器中输入”您的GitHub名字.github.io“查看吧!如果您成功了分享给更多的人吧!谢谢!

今天的分享到此就结束了,感谢您的阅读,如果确实帮到您,您可以动动手指转发给其他人。

上一篇

已是最后文章

下一篇

已是最新文章

发表回复