1.在开始制作之前我们先预览一下我的网站吧!

1.方式一:

由于是手机版的所以用手机访问下面的链接体验比较好一点:

https://tom-shushu.github.io/MyWeb.github.io/

2.方式二:

你也可以在我博客的右侧扫描我的网站二维码进行访问;

2.具体制作过程:

开发工具:Github Desktop ,GitHub,Hbuilder(纯静态网页)

1.第一步:

作为一个程序员你一定有GitHub吧,如果没有你需要注册一个GitHub账号:具体步骤请按照下面步骤进行操作:

https://blog.csdn.net/qq_35246620/article/details/67636563

2.第二步:

在GitHub上建立一个仓库如图所示:

1>.名字自己起,注意必须以  .github.io结尾(由于我这里已经建好所以会出现错误)

2>.然后用Github Desktop工具将刚才建立的仓库克隆到本地,如果不了解Github Desktop工具的可以查看:

https://www.jianshu.com/p/06a960d991aa

我这里已经克隆下来了

打开MyWeb.github.io:里面就只有一个.git文件

3>.编码:

关于编码这里我就步详细介绍了,有点关公面前耍大刀,哈哈。如果觉得我这个网站还比较炫酷你可以到我的GitHub上去免费下载:

https://github.com/Tom-shushu/MyWeb.github.io

将我的信息更改一下就可以了。

4>.上传项目到GitHub上:

将整个项目拷贝到刚才克隆下来的仓库之中,用Github Desktop进行上传即可;

5>.到GitHub远程仓库的setting中将Source改为master branch

之后它会给你生成一个访问网址,它就是你的网站访问网址:

点击就可访问了

https://tom-shushu.github.io/MyWeb.github.io/

如何利用GitHub设计一个炫酷的个人网站(含代码)的更多相关文章

  1. 一个炫酷的flash网站模板

    这是一个炫酷的flash欧美网站模板,它包括首页,公司简介,留言等五个页面,界面转换非常的炫酷!他还有时间.全屏.背景音乐开关的功能!有兴趣的朋友可以看看!贴几张网站图片给大家看看! 下载后直接找到s ...

  2. 利用UIWebView打造一个炫酷的视频背景视图(OC & Swift)

    http://www.cocoachina.com/ios/20151023/13860.html 2015-10-6更新:适配 Swift2.0 如有需要,可以通过pjin.elvin@gmail. ...

  3. 利用GitHub制作在线炫酷简历

    首先我们先体验一下炫酷简历.然后决定我们要不要使用. https://jessezhao1990.github.... 如何使用本项目部署你自己的在线简历 1. 书写简历 在src文件夹里面有个con ...

  4. canvas的进阶 - 学习利用canvas做一个炫酷的倒计时功能

    先给大家贴一张图片,因为我不会上传视频( ̄□ ̄||) ,请大家谅解了~  如果有知道怎么上传视频的大神还请指点指点 ^_^ ~ 然后看一下代码: html部分 :  <!DOCTYPE html ...

  5. 百度前端技术学院2018笔记 之 利用 CSS animation 制作一个炫酷的 Slider

    前言 题目地址 利用 CSS animation 制作一个炫酷的 Slider 思路整理 首先页面包含三种东西 一个是type为radio的input其实就是单选框 二是每个单选框对应的label 三 ...

  6. 一个炫酷的Actionbar效果

    今天在网上看到一个炫酷的Actionbar效果,一个老外做的DEMO,目前很多流行的app已经加入了这个效果. 当用户初始进入该界面的时候,为一个透明的 ActiionBar ,这样利用充分的空间显示 ...

  7. 2019基于Hexo快速搭建个人博客,打造一个炫酷博客(1)-奥怪的小栈

    本文转载于:奥怪的小栈 这篇文章告诉你如何在2019快速上手搭建一个像我一样的博客:基于HEXO+Github搭建.并完成SEO优化,打造一个炫酷博客. 本站基于HEXO+Github搭建.所以你需要 ...

  8. Android一个炫酷的树状图组织架构图开源控件实现过程

    Android一个炫酷的树状图组织架构图开源控件 文章目录 [1 简介] [2 效果展示] [3 使用步骤] [4 实现基本布局流程] [5 实现自由放缩及拖动] [6 实现添加删除及节点动画] [7 ...

  9. 教你用canvas打造一个炫酷的碎片切图效果

    前言 今天分享一个炫酷的碎片式切图效果,这个其实在自己的之前的博客上有实现过,本人觉得这个效果还是挺炫酷的,这次还是用我们的canvas来实现,代码量不多,但有些地方还是需要花点时间去理解的,需要点数 ...

随机推荐

  1. Django:Python3.6.2+Django2.0配置MySQL

    持续学习Django中... Django默认使用的数据库是python自带的SQLlite3,但SQLlite并不适用于大型的项目,因此我将数据库换成了MySQL,下面介绍下Django如何配置数据 ...

  2. 一份完整的阿里云 Redis 开发规范,值得收藏!

    来源:yq.aliyun.com/articles/531067 作者:付磊-起扬 本文主要介绍在使用阿里云Redis的开发规范,从下面几个方面进行说明. 键值设计 命令使用 客户端使用 相关工具 通 ...

  3. ES 14 - (底层原理) Elasticsearch内部如何处理不同type的数据

    目录 1 type的作用 2 type的底层数据结构 3 探究type的存储结构 3.1 创建索引并配置映射 3.2 添加数据 3.3 查看存储结构 4 关于type的最佳实践 1 type的作用 在 ...

  4. Gradle中的闭包

    Gradle是基于Groovy的DSL基础上的构建工具,Gradle中的闭包,其原型上实际上即Groovy中闭包.而在表现形式上,其实,Gradle更多的是以约定和基于约定基础上的配置去展现.但本质上 ...

  5. Named Volume 在 MySQL 数据持久化上的基本应用

    原文作者:春哥 初识春哥时,春哥是美术设计大咖.后不久,创业并致力于游戏开发,已有3年.从Unity3D到IOS(Swift)开发,从前端开发到后端以及容器技术,从设计开发测试到产品经理以及CEO,已 ...

  6. 用Portable.BouncyCastle来进行加解密的代码demo

    前言 这里对之前对接的公司中的代码demo做一个总结,原本为清一色的java,哈哈.这里都转成C#.用到的库是Portable.BouncyCastle.官网.之前也是准备用.net core 内置的 ...

  7. Python中使用枚举类

    开发中我们经常定义常量, 其实有更好的方法:为这样的枚举类型定义一个class类型,然后,每个常量都是class的一个唯一实例.Python中提供了Enum类来实现这个功能: from enum im ...

  8. vue之$root,$parent

    $root vue状态管理使用vuex,如果项目不大,逻辑不多,name我们没必要用vuex给项目增加难度,只需要用$root设置vue实例的data就行了,如下 main.js new Vue({ ...

  9. SQLite 的 EXISTS 与 NOT EXISTS

    话不多说先来看看表结构: 显而易见 Pid 存放的 Person 的 id :下面重点(奇葩需求!!!!) 我需要向表一(Person)里插入几条数据(...)这时候不会对表二做任何操作. 需求:查询 ...

  10. Windows内置安全主体

    转自:https://blog.csdn.net/xcntime/article/details/51746148 导读:对于Windows内置安全主体特别需要注意的是:你无法创建.重命名和删除它们, ...