如何搭建一个免费的作品集网站

2018-11-21  本文已影响37人  Baoling

Part1. 如何纯免费

自己Coding+免服务器+免费域名。

Part2. 怎么实现

Github Pages提供了完全免费的网站生成,包括给你一个免费域名。只需要将自己的网站代码传到github上。步骤如下:

2.1 注册github

去github.com网站上注册一个自己的账号,这里账号名最好是(纯英文字母)或(英文字母+数字),不要有破折号等符号。

登录后,首页如下所示。点击“start a project”进入下一个页面。

github首页


2.2 创建github repository(可以理解为一个文件夹,用来存放你的网站代码)。

这里的Repository name有且只能起一个名字,才能变成你的域名。只能起 [你的github账号名].github.io,以后就可以用 [你的github账号名].github.io 这个网址来访问你的网站啦。

(你也可以给Repository起其他名字,那这个repository就是一个普通的存放内容的文件夹,没有网站的功能。)

创建repository


2.3 上传网站代码到这个repository

上传方法有以下两种,任选其一,推荐第一种方法。

传代码方法一. Github Desktop

步骤一, 到 https://desktop.github.com/网站上下载github desktop客户端,安装。

步骤二,回到github网站上,在刚才创建的 repository 上点击“Set up in Desktop”,然后在弹窗上点击“Open GitHub Desktop”,将把这个 repository作为一个文件夹拷贝到你电脑本地。

从github repository打开github desktop客户端

步骤三,在弹出的github desktop客户端上,选择好你本地要存放的路径local path,然后点击clone,拷贝到本地。

github desktop上拷贝

步骤四,在你电脑本地找到刚才拷贝的文件夹,打开,里面是空的。你需要把你写好的网站代码全部放进去。放进去之后,再打开github desktop,会看到有更新。

把代码放进刚才的文件夹

步骤五,看到github desktop上有更新。在4的区域填入此次更新的内容,随便填什么都可以。然后在点击5的位置commit,然后点击6的位置push。push完成后,你的代码就传到github上啦。

commit和push

步骤六,在浏览器里输入 [你的github账号名].github.io ,你的网站就出来了。移动端网页也可以访问哟。

以上步骤视频版可以在此查看。https://baoling.top/#case3

传代码方法二. CMD(windows)或Terminal(mac)写代码来传网站代码。

这个比较复杂,给大家附一个链接,有兴趣的可以看看。https://www.jianshu.com/p/e7501b968256

Part3. 不喜欢github的域名怎么办(要免费的不用看这步)

如果你不喜欢github生成的域名,那就需要花钱购买自己的域名了。购买后,用自己的域名绑定github的域名就可以了。

步骤一,购买域名的地方:阿里云官网,或godaddy

步骤二,购买域名后,根据各自网站的提示,解析域名,将域名解析地址填为 [你的github账号名].github.io。

步骤三,在github你的repository下,点击settings,滚到下方,github pages模块,找到custom domain,输入你购买的域名,save,完成了,你可以用你购买好的域名来访问了。

设置自定义


Part4. 怎么写网站代码

步骤一,学习HTML、CSS、JQuery、JavaScript,可以去http://www.w3school.com.cn/, 或者https://www.w3schools.com/自学。

步骤二,学习Bootstrap,学会自适应设计。可以去http://getbootstrap.com/自学。

以上步骤,如果希望跟老师一起学的,可以报名参加我的付费课程,用28次课程,每次浓缩5-8min的视频教学,让你在一个月内开发出自己的作品集网站。课程内容如下图所示。也可访问我的网站 https://baoling.top/查看。

我的课程内容
上一篇下一篇

猜你喜欢

热点阅读