首页
学习
活动
专区
圈层
工具
发布

gitee搭建个人网站

使用 ​​Gitee(码云)搭建个人网站​​ 是一种 ​​简单、免费、高效​​ 的方式,特别适合展示个人简历、博客、项目作品集等静态内容。Gitee 提供了 ​​Gitee Pages​​ 服务,类似于 GitHub Pages,可以自动将你的静态网站项目发布成一个在线网站。


✅ 一、Gitee Pages 是什么?

​Gitee Pages​​ 是 Gitee 提供的 ​​免费静态网站托管服务​​,它可以将你存放在 Gitee 仓库中的 ​​静态网页文件(如 HTML、CSS、JS、图片等)自动部署并发布成一个网站​​,访问形式通常是:

代码语言:javascript
复制
https://<你的用户名>.gitee.io/<仓库名>

或者,如果你使用的是 ​​User/Organization Pages​​(用户主页),通常是:

代码语言:javascript
复制
https://<你的用户名>.gitee.io/

✅ 二、使用 Gitee 搭建个人网站的基本步骤

✅ 前提条件:

  • 拥有一个 ​​Gitee 账号​
  • 准备好你的 ​​静态网站文件​​(比如 HTML/CSS/JS,或用静态网站生成器如 ​​Hugo、Hexo、VuePress、Jekyll 等生成的网站​​)

✅ 三、搭建步骤详解

步骤 1:在 Gitee 上创建一个新仓库

  1. 登录 Gitee。
  2. 点击页面右上角 ​​“+” → “新建仓库”​​。
  3. 填写信息:
    • ​仓库名称​​:比如 my-websitepersonal-site或者直接用 username.gitee.io(推荐用于用户主页)
    • ​路径​​:会自动生成
    • ​描述​​:可选,比如“我的个人主页”
    • ​公开/私有​​:​​建议选择 公开(Public)​​,因为 Gitee Pages ​​只支持公开仓库自动部署​
    • 勾选 ​​“初始化仓库”​​(可选),你可以选 README.md或直接不选
  4. 点击 ​​“创建”​

🎯 如果你想搭建 ​​个人主页(类似 xxx.gitee.io)​​,推荐仓库名设置为: ​<你的用户名>.gitee.io​,比如我的用户名是 yourname,那仓库名就是 yourname.gitee.io


步骤 2:上传你的网站文件到该仓库

你的网站可以是:

  • ​纯静态页面​​:比如一个 index.html+ CSS/JS 文件
  • ​静态网站生成器生成的网站​​:如 Hexo、Hugo、VuePress、Jekyll 等构建出来的 dist/public/文件夹内容

方法 1:直接在网页端上传(适合少量文件)

  1. 进入你刚创建的仓库
  2. 点击 ​​“+” → “上传文件”​
  3. 拖入你的 index.html、CSS、JS 等文件
  4. 提交(Commit)

方法 2:使用 Git 命令行推送(推荐,适合本地开发)

  1. ​克隆仓库到本地​​ git clone https://gitee.com/你的用户名/仓库名.git cd 仓库名
  2. ​将你的网站文件复制到该目录中​​(比如 index.html等)
  3. ​提交并推送​​ git add . git commit -m "添加个人网站首页" git push origin main 注意:Gitee 默认分支可能是 mainmaster,根据你的仓库而定。

步骤 3:开启 Gitee Pages 服务

  1. 进入你刚刚创建的仓库页面
  2. 点击顶部菜单栏的 ​​“服务” → “Gitee Pages”​
  3. 在打开的页面中:
    • ​源码分支​​:选择你要部署的分支,通常是 mainmaster
    • ​文件夹​​:一般填写 /(表示根目录)或者你网站的构建输出目录,比如 /dist(如果你用了静态网站生成器)
    • 然后点击 ​​“确定” 或 “启动”​

⏳ 稍等几分钟(通常 1~3 分钟),Gitee 就会自动构建并发布你的网站!


步骤 4:访问你的个人网站

访问地址格式如下:

网站类型

访问 URL 示例

​​普通项目网站​​

https://<你的用户名>.gitee.io/<仓库名>例如:https://yourname.gitee.io/my-website

​​用户主页(推荐)​​

https://<你的用户名>.gitee.io/例如:https://yourname.gitee.io/👉 要实现这个,你的仓库名必须是 <你的用户名>.gitee.io

🎉 恭喜!你的个人网站已经上线了!


✅ 四、推荐:使用静态网站生成器(可选)

如果你想做一个更漂亮、功能更强的个人网站,推荐使用以下工具生成静态网站,然后部署到 Gitee Pages:

工具

说明

适合场景

​​Hugo​​

Go 编写,速度快,主题丰富

技术博客、个人主页

​​Hexo​​

Node.js 编写,易用,插件多

博客、作品集

​​VuePress​​

基于 Vue,适合文档、技术站点

文档站、个人博客

​​Jekyll​​

Ruby 编写,GitHub Pages 原生支持

兼容性好,但 Gitee 也支持

​​纯 HTML/CSS/JS​​

手动编写,最简单直接

简单展示页

🔧 你可以在本地用这些工具生成网站文件(通常是 dist/public/文件夹),然后上传到 Gitee 仓库,再通过 Gitee Pages 发布。


✅ 五、常见问题与注意事项

❓ Gitee Pages 不生效 / 访问 404?

  • 确保仓库是 ​​公开​​ 的(私有仓库不支持 Pages)
  • 确保你已开启 ​​Gitee Pages 服务​​,并选择了正确的分支和目录
  • 确保你的网站有 index.html或正确入口文件
  • 稍等几分钟,Gitee 部署可能需要时间

❓ 能否绑定自定义域名?

✅ ​​可以!​

  • 在 Gitee Pages 设置中,可以绑定你自己的域名(如 www.yourdomain.com
  • 需要在域名服务商处设置 CNAME 或 A 记录指向 Gitee 的 Pages 服务器

❓ 是否支持动态网站(如 PHP、数据库)?

❌ ​​不支持​​。Gitee Pages 只支持 ​​静态网站​​(HTML/CSS/JS/图片等),不支持后端语言、数据库、PHP 等。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

使用 Gitee + Hexo 免费搭建个人网站

想拥有自己的个人博客网站你需要购买服务器、域名、然后还需要会亿点点代码知识,这对于不少新手用户来说是一个门槛。那么如何免费快速搭建属于自己的个人博客网站呢?...在之前锋哥给大家分享过利用微软的代码托管服务 GitHub 免费搭建个人博客网站,不过因为 GitHub 时不时的会抽风导致访问不了,体验并不太好。...在昨天有粉丝留言推荐了 Gitee 来搭建,同样 Gitee 也是代码托管平台,因为平台在国内,所以访问速度比较不错。下面给大家分享利用 Gitee + Hexo 博客框架来搭建自己的个人博客网站。...上传到Gitee托管 首先在 Gitee 网站注册一个账号,然后再创建一个自己仓库,输入仓库名称 - 创建。...另外更多 hexo 的教程等以后有时间了再发一发了,或者可以自己去官方网站研究下。

6.3K41

基于 Gitee 搭建个人网站-入门教程

前言 这是一篇基于Gitee搭建个人网站的保姆级教程。从零到一。如果你想基于云服务器搭建,我以前写过一篇菜鸟篇。...适合人群:入门级别教程,如果你想拥有一个自己的网站,又苦于没有云服务器,这个是你的不二选择。 本篇是基于 docsify 搭建,docsify 是一个文档类博客模板,简介且方便使用。...后面一一解释 本地预览网站:docsify serve ./ 然后访问:http://localhost:3000/ [在这里插入图片描述] 初始化后效果图 [在这里插入图片描述] 工程&配置介绍 下面是我们需要的一些基础配置...$docsify = { name: 'rodert', repo: 'https://gitee.com/rodert/rodert', maxLevel: 5,/...、访问速度 现在Github网络非常不稳定,在码云部署一份 导入 Github 项目 选择 -> 服务 -> Gitee Pages 庆祝一下,不妨给 JavaPub 留个言,分享一下喜悦。

2.9K30
  • Gitee 和 GitHub 搭建个人网站博客的方法

    方法备忘,个人自用,仅此而已。 gitee.com(码云) 和 github.com ,分别是国内外的代码交流社区,就是把自己写的代码开源给别人,让别人站在巨人(开源者)的肩膀上继续发展。...既然是服务器就可以干两三件事:搭建纯网页、搭建博客、搭建图床。 搭建纯网页 什么是纯网页?就是所有内容都在一个页面上,比如网址导航网站。...Gitee 效果:https://rzfyu.gitee.io 第一步:注册账号时,「个人空间地址」填短一点的纯字母,例如 rzfyu,它直接体现在效果里。当然在设置里可以更改这个字母。...第六步:服务 - Gitee Pages,勾上「强制 https」,最后点「启动」就会出现「已开启 Gitee Pages 服务,网站地址: https://rzfyu.gitee.io/xxx 」 第七步...由于 GitHub 可以自定义域名,所以如果你对个人博客感兴趣,可以先买一个域名一年就几十块钱,利用 Hexo 搭建一个博客写写东西。

    2.4K10

    搭建个人网站

    以下内容已按搭建网站的过程排序 方法一: 服务器 + 自我配置 购买服务器与域名: 具体购买请参照个人需求自行选择 可以前往腾讯云购买完成后根据相关指导进行备案 进行域名的备案与解析: 域名的备案可参考各服务平台的文件...配置个人网站: 如果想省事,也可以直接花money,借助wordpress / appnode直接一键式建站,则可自动跳过以下所有步骤,如果并不愿意采取这种方式,请您移目下方。...参考LNMP, LNMP指的是Linux系统下Nginx+MySQL+PHP这种网站服务器架构。...将解压好的文件通过scp -r 上传至网站的根目录。而后在浏览器上访问自己的网站,应该就可以开始typecho的配置啦!接着就一步一步跟着其指导往下做即可。...方法二:借助现有的平台,免费建站: 凡科建站等一键式建站,可在知乎中查找到许多类似的网站。

    8.5K10

    Hexo+Gitee pages搭建个人博客

    “ 没有搭建过个人博客然后放弃的程序员不是好送外卖的” ---- 01 — 前言 本文仅仅针对有程序开发基础或有决心毅力的人,如果想点点按钮就搭建成功,那还是算了。...搭建个人博客有很多方法,可以自己购买服务器、购买域名、自己动手开发(或利用开源项目,比如Halo等)、部署搭建个人博客,但对于个人来说,成本还是相对较高。...Hexo是一款基于Node.js的静态博客框架,依赖少易于安装使用,可以方便的生成静态页面托管在GitHub、Gitee等平台上,是搭建博客的首选框架。...电脑(以windows系统为例) 03 — 开始搭建 Gitee [码云平台地址](https://gitee.com) ?...比如我的码云用户名是daijiyong,创建了一个项目名为daijiyong,最终我的博客链接地址就是http://daijiyong.gitee.io 开发环境搭建 [NodeJs官网](http:/

    1.5K30

    github搭建个人网站

    2.1 验证邮箱 请打开你的邮箱,查看发送给你的确认邮件,你需要验证邮箱后,后面生成的个人主页才会被接受和发布. 3....Server:GitHub.com  这样就很明白了,访问此站点时,如果域名不是 blog.cncounter.com ,那么就会跳转到 http://blog.cncounter.com/,个人恶意推测...仓库的页面 创建好个人或组织的Github首页之后,就拥有了一个固定的二级域名。 那么,每个项目都可以使用页面生成器生成一个项目的页面(page)。...下面是参考的一部分: 您可以通过GitHub的页面自动生成器快速为 项目,用户(User,比如你的账号),或组织(Organization, 比如 alibaba) 创建一个网站(其实就是技术博客啦)...警告: GitHub页面网站在互联网上是公开,即使其所属的仓库是私有的。 如果你有敏感数据在页面仓库中,您可能需要在发布之前删除他们。

    6.1K80

    基于Halo搭建个人网站

    环境搭建 Halo[2]是一款现代化的开源博客/CMS系统,官网[3]列举了详细的环境搭建教程[4],按着官网给出的教程一步步往下走,即可完成安装,过程很顺利,此处不做过多赘述。...对我改造好的网站比较感兴趣的开发者,请移步:在线地址[5] 自定义数据库 如果你有一定的Java/SpringBoot/Gradle基础,希望对搭建好的环境进行更深层次的定制,你可以继续阅读本章节,否则跳过即可...image-20220506004444333 改造后的网站 接下来,跟大家介绍下我的个人网站[13]中都有哪些内容。...image-20220506010006880 留言板 如果有想对我说的话,欢迎在此留言 image-20220506010200337 关于我 此处将展示一些我的个人介绍。...参考资料 [1] 我改造后的网站: https://www.kaisir.cn/ [2] Halo: https://halo.run/ [3] 官网: https://halo.run/ [4] 环境搭建教程

    4.1K30

    从零开始搭建个人网站

    [Spring Boot] 从零开始搭建个人网站 @TOC 手机用户请横屏获取最佳阅读体验,REFERENCES中是本文参考的链接,如需要链接和更多资源,可以关注其他博客发布地址。...平台 地址 CSDN https://blog.csdn.net/sinat_28690417 简书 https://www.jianshu.com/u/3032cc862300 个人博客 https:...//yiyuery.club 利用 Nginx 和 Spring Boot 微服务模块实现前后端分离式部署的个人网站搭建。...阅读前提 了解Docker 了解Nginx 了解NodeJS 了解Spring Boot 了解Vue或其他前端相关知识 准备工作 拥有一个云服务器(如阿里云 ECS 实例) 下载一个开源静态的后台管理网站...同理,配置修改后记得重启Nginx 如此一来,自己的网站就可以开始运行了。 总结 本文目的在于分享个人网站搭建的一个方案,适合有一定前后端开发基础的同学学习实践。

    5.4K41

    Hexo+Github个人网站搭建

    优质的内容 + 优质的输出平台 = 好的个人名片。 今天这篇文章就给各位介绍下如何利用Hexo+Github搭建属于自己的博客平台,从而让其成为自己的一张名片。...hexo server 现在小伙伴就可在本地访问你的网站了,来看看吧~ ?...展示一下搭建好的效果图: ? Github+Hexo搭出来的网站,访问速度比较慢,推荐大家去阿里云或者腾讯云等云服务提供商买个服务器,再买个域名,自己搭建一个博客或者网站。...网站日常内容更新 网站内容的更新一般由网站运营者通过编辑md文件,然后校对并在本地进行测试,确认无误之后,将其发布上线,下面将介绍如何发布一篇文章: 按照下图中路径地址打开文件夹,每次将写好的md文件保存至此...然后通过如下命令上线发布: hexo d 最后,小伙伴们可通过如下地址访问博客了: 地址:https://yzzhuozhuo.github.io/ 声明 更多内容请移步我的公众号平台hahaCoder或者个人网站

    1.3K20

    vitepress+gitee pages搭建自己的博客网站

    目前有很多的博客网站,比如CSDN,博客园,简书等,但为什么还要搭建自己的博客网站呢?...一方面,通过自己搭建博客网站是一个学习的过程,另一方面,将自己的博客进行统一管理,也可作为自己的一个作品,增加你的影响力或者求职时的通过率。...上面说了很多关于写博客和搭建自己博客的原因,那究竟如何搭建呢?本文就带你通过vitepress和gitee pages搭建一个属于自己的博客网站。 操作 1、搭建vitepress工程 1....不过gitee pages是需要上传个人信息认证的,认证过之后就不需要再认证了。 3....更新完成后可以看到访问地址,点击网站地址访问,大功告成。 本文的示例访问地址:https://lzugis15.gitee.io/lzugis-blogs

    1.8K10

    JERRY PicGo & Gitee 网站图床搭建说明

    JERRY-PicGo-Gitee 《JERRY PicGo & Gitee 网站图床搭建说明》 非原创内容,转载请注明出处! 一、前言 1.1 什么是网站图床?...减轻网站服务器存储压力,同时负担流量 CDN 服务提高图片加载速度,从而加快网站访问速度 CDN 服务提高图片加载速度,从而节省流量 利于后续网站迁移扩容 1.3 什么是 PicGo?...的设置 在个人主页点击 个人设置 选择安全设置里的 私人令牌 点击 生成新令牌 勾选 user_info 及 projects 进行密码验证 保存私人令牌 三、PicGo 的配置 3.1 PicGo...PicGo & Gitee 图床搭配只适用于图片较少且单张图片较小的小型网站,主要特点在于免费快速。...对于大型网站和有大量图片需求的网站而言配置专业的服务器是必须的。

    63220

    VuePress搭建技术网站与个人博客

    定义 Vue 驱动的静态网站生成器 2. 亮点 ? 自己总结的vuepress优点 ? 3. 同类模块横向对比 ①....技术文档网站: vue全家桶官网:vue、vuex、vue-cli、vue-router以及vuepress本身 2....个人博客: 博客1(默认主题)、博客2(自定义主题) 三、开始搭建 coding之前,建议大家先了解markdown语法,为之后的文档撰写做铺垫:传送门 1....配置首页(可选): 一般的技术文档网站都需要一个首页作为该技术的简介,个人博客也需要这样的欢迎页。...即 Github 提供的、用于搭建个人网站的静态站点托管服务。很多人用它搭建个人博客。这种方式的好处是免费、方便,坏处是速度可能会有些慢、不能被国内的搜索引擎收录。

    1.9K10
    领券