Gitee如何免费部署静态网站?

news/2024/5/20 1:32:47/文章来源:https://blog.csdn.net/weixin_44541136/article/details/121328966

1、网页只能本地浏览,想挂在云端进行访问浏览的

2、想入手云服务器,但服务器太贵了,觉得花钱不值得

3、不知道服务器如何使用和搭建的,对于新手小白不太友好

4、想快速部署网页的,简单配置就可以得到想要的

谁说程序员不懂浪漫,逢年过节的时候,制作一些浪漫唯美的网页,然后发给自己喜欢的人,这不就拿捏得妥妥的。

下面就给大家简单介绍一下,如何在码云Gitee  官网-Gitee.com 中部署个人静态网站?使用git提交网站。免费部署的同时,还可以创建多个仓库来部署多个网页

一、预览效果

点击浏览我发布的演示网页效果:  生日快乐 (gitee.io)http://q20000103.gitee.io/small-ash/

点击爱心出现动态祝福动画效果


二、准备资源

1.首先准备你想要发布的网站资源文件夹,里面必须要有命名为index.html的页面,部署前在本地运行测试

2.在码云上面创建一个仓库,如果没有账号需要先自行注册

码云是基于Git的代码托管和研发协作平台,码云和github都是代码托管·协作开发的平台,码云是国内的网站,GitHub是国外的网站,使用国内的访问速度会快很多,同时对于小白来说中文网站的使用,会更加方便上手操作

点击右上角加号创建一个新仓库

填写仓库名称,其它均可默认,也可以根据需求自行配置,然后点击创建按钮

私有:别人无法查看你创建的私有仓库

公开:所有人都能够查看你创建的仓库并且能够下载源码

下面是创建成功后的提示页面,保存下面的仓库地址已便后面使用

三、安装Git

Git 官网下载下载地址 git-scm.com或者gitforwindows.org

根据自己的系统下载对应的版本,需要详细安装教程的可以参考一些Git安装的文章

安装完成之后,找到Git软件点击鼠标右键、单击 Git Base Here 、打开Git控制台在命令行输入下列命令

 # name可以随意命名(可以中文),邮箱建议使用自己QQ邮箱git config --global user.name ""git config --global user.email ""  

Gitee 提供了基于SSH协议的Git服务,在使用SSH协议访问仓库之前,需要先配置好账户/仓库的SSH公钥。

按如下命令按照提示完成三次回车,即可生成 ssh key。输入cat ~/.ssh/id_rsa.pub 查看你的 public key(公钥)

 //建议邮箱同上面注册的邮箱,注意:这里的 xxxxx@xxxxx.com 只是生成的 sshkey 的名称,并不约束或要求具体命名为某个邮箱。ssh-keygen -t rsa -C "xxx@xxx.com"  //查看公钥文件cat ~/.ssh/id_rsa.pub 

复制生成后的 ssh key,通过仓库主页 「管理」->「部署公钥管理」->「添加部署公钥」 ,添加生成的 public key 添加到仓库中。 

 最后一步就是测试是否配置成功,首先进入ssh目录,输入ssh -T git@gitee.com,如果看到以下如图Hello,your name!You 've successfuly authenticated ……即为配置成功

四、部署网页到gitee

首先在网站根目录下空白处,右击选择 --> Git Bash Here

 然后继续执行以下命令//1、初始化仓库    $ git init//2、把本地文件放入暂存区$ git add .//3、把 暂存区文件放入本地仓库git commit -m "个人主页"//4、git remote add origin 你的仓库地址git remote add origin https://gitee.com/.......//5.把本地仓库的网站推送到码云远程仓库git push -u origin master

输入git命令的过程中可能会提示输入gitee账号和密码,需要填写相应账号和密码、以及按照命令提示输入gitee账户以及用户名即可

按照上面操作,我们所有的文件便都上传到了gitee仓库中,刷新当前页面,点击 "服务"按钮,选择 "Gitee Pages"进行开通,按照现在的安全管理规定,开通服务可能需要拍摄身份证上传,按照操作进行开通即可

下面是开通之后的结果,开启Gitee Pages服务后,会出现一个别人可以访问的网站域名,点击即可访问你所部署的静态网页

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_801641.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

web前端-二级分类菜单(类似购物网站)

效果&#xff1a;鼠标移上去右边显示二级菜单。 效果图&#xff1a; 实现代码 <!DOCTYPE html> <html> <head lang"en"><meta charset"UTF-8"><title></title><style>*{margin:0;padding:0;}#nav{width:100%;h…

JAVA环境下JDK导入指定网站下载下来的证书

查了很多文章&#xff0c;都写的乱七八糟的&#xff0c;不是缺这就是缺那&#xff0c;反正不完善&#xff0c;经过各种试&#xff0c;会出现很多问题&#xff0c;比如keytool命令不能识别的问题&#xff0c;或者执行命令报错的问题&#xff0c;很多。 经过各种测试&#xff0c…

React实战入门课程:dva开发一个cnode网站(1)

dva开发一个cnode网站&#xff08;1&#xff09; dva 首先是一个基于 redux 和 redux-saga 的数据流方案&#xff0c;然后为了简化开发体验&#xff0c;dva 还额外内置了 react-router 和 fetch&#xff0c;所以也可以理解为一个轻量级的应用框架。 本教程是利用cnode的开放api…

React实战入门课程:dva开发一个cnode网站(2)

今天来学习第二节课程&#xff0c;完成列表数据的展示 效果&#xff1a; 1. 新建ListData组件 import React , { Component }from react; import { List, Avatar, Icon, Spin } from antd; import PropTypes from prop-types; import { connect } from dva;class ListData e…

React实战入门课程:dva开发一个cnode网站(3)

完成详情页渲染&#xff0c;用到了react-markdown来渲染 先看效果&#xff1a; 1 在components下新建Detail.js import React , { Component }from react; import { Card, Avatar, Spin, Icon,Comment, Tooltip, List} from antd; import PropTypes from prop-types; import …

React实战入门课程:dva开发一个cnode网站(4)

增加分类标签&#xff0c;效果如下&#xff1a; 1 修改ListData组件 完整代码&#xff1a; import React , { Component }from react; import { List, Avatar, Icon, Spin ,Tag } from antd; import PropTypes from prop-types; import { connect } from dva; import ./my.c…

Castle开发系列文章上了Castle的官方网站

最近有些忙&#xff0c;Blog更新的速度明显有些慢了&#xff0c;也是很久没有上Castle的官方网站了&#xff0c;今天Terry82&#xff08;跟我名字有点像&#xff09;的朋友告诉我Castle 开发系列文章在Castle官方网站上有链接&#xff0c;上去看了一下&#xff0c;还真是&#…

jitter 如何优化网络_网络营销专员浅析网络营销过程中如何做好网站权重流量的优化...

在搜索引擎中通过检索关键词后所展示出来的首页网站大多都有着不错的流量和权重&#xff0c;这对于企业网站来说是网站优化运营和网络营销推广专业水准的体现&#xff0c;这也是无数专业人士背后默默运营得出的结果。通常情况下&#xff0c;网站权重和流量越高&#xff0c;搜索…

如何bin部署sqlce4.0的ASP.NET mvc3网站

参考这里&#xff1a; How to Bin Deploy SQL Compact Edition 4.0 and Razor web projects With the release of VS2010 SP1 Beta1, Web Matrix, and Razor QFE, we can build web projects containing SQL Compact Edition 4.0 sdf file and ASP.NET Web Pages with Razor s…

sitemap-php生成网站地图

根据SEO需要生成站点地图有利于百度爬虫收录&#xff0c;后台需要生成sitemap.xml 文件&#xff0c;内容是站点链接&#xff0c;效果如图 开始后台管理模版&#xff0c;页面比较粗糙 下面开始代码部分&#xff1a; 我使用的是hyperf框架&#xff0c;所以把 Sitemap类&#xff…

php 生成网站地图txt

根据SEO需要生成站点地图有利于百度爬虫收录&#xff0c;后台需要生成sitemap.txt 文件&#xff0c;内容是站点链接&#xff0c;效果如图 开始后台管理模版&#xff0c;页面比较粗糙 下面开始代码部分&#xff1a; public function sitemaptxt() {$host request()->input(…

网站上做企业微信扫码授权登录怎么做?(超详细教程)

企业微信已经搞了这一套完整的教程&#xff01; https://developer.work.weixin.qq.com/tutorial/detail/56 第1步&#xff1a;企业微信自建应用 第2步&#xff1a;浏览企业微信开发文档 企业微信的开发文档&#xff1a; 企业微信API 第3步&#xff1a;企业微信自建应用设置授…

三、自定义网站(一) Previewing and applying a theme

Orchard提供了功能强大并且简单易用的主题系统。Orchard默认包含了一个主题。 Managing Themes 在控制面板中点击 Themes进入主题管理. 转载于:https://www.cnblogs.com/ibrady/archive/2012/03/20/2407433.html

head first python 支持网站(可下载所有的代码和示例)

http://examples.oreilly.com/0636920003434/ 转载于:https://www.cnblogs.com/apple2016/p/5298907.html

5个功能强大的工具网站,实用性超强,收藏起来吧!

1.音乐搜索器 一个汇集了许多音乐的网站。支持用户下载网易云&#xff0c;QQ 音乐&#xff0c;酷狗等各大主流网站的音乐&#xff0c;只需要输入歌名、音乐ID或者复制链接&#xff0c;就可以一键下载。 2.最美应用 一个推荐一些实用、创新应用的网站&#xff0c;各种类型都…

10个资源满满的网站,偷偷收藏起来吧!

大家一般找资源肯定会先想到百度搜索&#xff0c;可是有时候度娘资源也是有限的。想要的资源找不到怎么办&#xff1f;别担心&#xff0c;今天给大家分享10个资源超级丰富的网站&#xff0c;赶快来看看吧&#xff01; 1.有妖气 中国唯一且最大的纯原创漫画网站&#xff0c;数…

推荐6个鲜为人知的强力网站,每一个都让你大开眼界

1&#xff1a;全国电视直播 http://bddn.cn/zb.htm 全国电视直播是最近发现的一个非常良心的电视直播网站&#xff1b;它支持几百个电视直播的网站&#xff0c;包括&#xff1a;港澳台卫视&#xff1b;网站界面简洁&#xff0c;没有任何广告&#xff0c;并且播放速度和加载速…

10个免费高清图片网站,良心推荐,收藏就是学会了

我来分享一波无版权的高清素材库。 1、Pixabay 一个拥有160万个可在任何地方使用的免费无版权图片&#xff0c;有需要的小伙伴都可以下载。 2、Pexels 网站上提供大量的高清图片&#xff0c;上面的所有图片都可以免费商用。 3、Unsplash 这个网站上主打风景摄影图&#xff0…

交互设计必备的10个网站|每一个都是精挑细选,请低调使用

我来啦&#xff0c;给大家分享一些个人觉得比较好的设计网站&#xff1a; 为了帮助你快速的获得设计灵感&#xff0c;我准备了一份设计师必备素材库大礼包&#xff0c;包含多个APP设计、电商设计、HTML5、插画、logo设计、ICON等行业优秀作品案例&#xff0c;私信即可获取。 1…

给你5分钟白漂:这些都是我的常用在线工具网站

小伙伴们大家好&#xff0c;本期再托一次家底&#xff0c;和大家分享十几个自己日常工作学习过程中的常用在线工具和网站&#xff0c;希望能有帮助。 也欢迎小伙伴们分享和安利出你们觉得有用的工具&#xff0c;不要停啊。 在线绘图神器 很多小伙伴咨询说博客文章里的技术图怎…