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

使用Hexo+Github+腾讯云+Netlify搭建个人博客

true header: true 更改后的效果: 图片 现在用浏览器访问http://localhost:4001就可以看到初始的博客了。...}} categories: tags: description: photos: - --- title: 文章标题 date: 文章的生成时间 categories: 文章分类,这个分类会在网站上统计...图片 然后修改_config.yaml中的配置,加上目标仓库的地址。 图片 运行hexo d后其中的publish目录中的内容将被推送到设定的远程仓库中。 注意,每次推送都是完全覆盖。...在netlify网站上添加自定义域名 图片 修改**DNS**,设置域名重定向 因为是在腾讯云上购买的域名,所以登录https://www.dnspod.cn/后,在我的域名栏就可以看到已经购买的域名了...https://www.sousuoyinqingtijiao.com/ 在该网站提交自己的网站给各个搜索引擎。

98600

Netlify静态资源托管之部署自动化

Netlify 是一个提供静态资源网络托管的综合平台,一个直观的基于Git的工作流和强大的无服务器平台,用于构建、部署和协作web应用程序,即能够将托管 GitHub,GitLab 等网站上的 Jekyll...Markus Schork, CTO Hair Digital, Unilever: Netlify使CI/CD、部署和可扩展托管成为一种商品,并帮助企业专注于在Jamstack世界中创造出色的动态消费者体验...:Netlify 检测到要推送到git的更改并触发自动部署。...授权后,就会自动读取你 GitHub 的仓库,如果没有看到你需要仓库则需在GitHub上配置Netlify应用程序访问权限。...Step 5.从主服务器部署将自动发布, 在稍等一段时间就可以看到你的博客已经部署成功,并且给你分配了一个二级域名 :https://cranky-leakey-9306bd.netlify.app

3K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    在input中回车后页面提交导致出现HTTP 错误 405.0 - Method Not Allowed

    前些时间在做一个搜索功能时发现一个比较有意思的现象,场景是这样的:在一个模态窗口中是一个订单列表,页面的顶部有若干个状态筛选框和一个搜索关键字输入框,当焦点在关键字输入框时按回车,本来是对input的keyup...事件做了监听,当发现是按了回车键时便自动提交搜索请求的,但输入关键字后按回车时页面竟然跳转了,并且出现“HTTP 错误 405.0 - Method Not Allowed无法显示您正在查找的页面,因为使用了无效方法...按照错误信息及现象(页面跳转了)来看,应该是因为触发了页面提交了,但事实上,当在keyup事件里面alert时,根本还没有执行到keyup事件里面去就已经跳转了。...于是搜索了一些资料来看,结果发现html规范的一种约定:如果一个form里只有一个input,那么无论有无submit按钮或绑定事件,只要在这个焦点在这个input里并且按下回车按钮时,都会执行自动提交表单的操作...自动提交的动作本身浏览器在默认事件中绑定的,按键盘的操作就是keyup和keydown,我原本的按键监听是在keyup事件里写的,所以把keydown事件重写,然后终止默认事件执行就OK了。

    2.8K10

    如何为你的 Github 博客添砖加瓦

    写完只是想打个草稿,都要用 git 提交以下更改,更像写代码了 不能随时随地的编辑,有时候我想用 ipad 修改点什么都不可以 由于以上几个痛点,每次写 Blog 感觉自己都需要费很大的力气,还不如自己写个笔记就过去了...虽然目前是利用 CI 部署在自己的服务器上方便国内的搜索引擎爬虫进行爬取,目的是优化 SEO,提高国内的访问速度。但是还是想要一个不需要自己部署后端的 CMS。...在 netlify 配置好你的仓库 在使用 Github 账号登录了 netlify 后,点击 「New site from Git」,如果搜索不到的话记得给你的 netlify 授权访问你的仓库。...文章保存后都会 commit 到这个分支上,等你需要发布的时候在提交 PR 到 master。...在文章中添加图片 肯定有读者注意到了在增加了 ![]() 的 Markdown 图片标签后,切换到 Rich Text 就可以选择上传图片了。

    94940

    个人免费博客花式搭建指南

    这个网站还有一个很神奇的附带功能——它与 Netlify 相连接,从网站上就可以看出 Netlify 支持部署的静态网站生成器。   说到这里,又有一个新的名词出现了——Netlify。...当然,Jekyll 完全支持用户在原有主题上进行更改,只要你了解文件是如何组织的、需要何种环境等等,你就可以做出自己的修改。...在实际的使用过程中,笔者根据自己的需求也在 H2O 主题上做出了一定的功能修改,并开源为 jekyll-them-H2O-ac。...; 英文与中文标点符号一起时,标点符号在英文或符号之前之后都无须空格; 在代码内容中,# 号与文字之间空一格,# 号与代码同行时距离不宜过长,如相邻几行都有注释对齐为佳;当代码注释内容超过一行时最好将注释放在代码的后一行...bundle exec jekyll serve --livereload # 浏览器访问 http://127.0.0.1:4000/ 即可 发布部署 # 使用以下命令将更新内容添加到 Git 跟踪并提交到

    2.6K40

    hexo+netlify+git+个人域名搭建博客

    npm install -g hexo-cli 2.初始化博客文件夹 hexo init blog #(blog可根据自己情况更改) 3.安装node_moudles cd blog npm install...#将所有文件添加到暂存区 git commit -m "first commit" #提交到本地仓库,双引号内是提交的备注信息 git remote add origin https://github.com...,这个命令中的 -f 是强制推送,因为远程仓库只有初始化的文件,所以强制推送上去就行了,不加-f 会报当前分支没有远程分支,强制推送可以覆盖master,这样就完成了第一次提交的步骤) 10.将hexo...内容部署到生产环境 hexo d -g 11.关联Netlify 登录Netlify建议使用github账号登录,会方便很多 12.关联git仓库和分支 登录之后点击醒目的绿色的New site fomr...Git按钮来新建站点并选取刚刚创建的仓库: 13.部署 点击完Deploy site之后,Netlify 会自动构建并发布你的网站内容,最重要的是Netlify支持分支部署和部署预览,这样可以提高开发效率

    1.3K10

    Hexo优化-使用Netlify实现博客部署

    20220919_Hexo优化-使用Netlify实现博客部署 我此前Hexo博客时托管在腾讯云上, 但是继腾讯云继上半年关闭了云开发环境的永久免费流量后, 9月份还更改了云开发的付费模式, 强制关闭了我的...关于Netlify Netlify是一个前端自动化部署工具, 它会从你的git平台仓库拉取代码, 使用你配置的命令进行部署....generate Publish directory: public/ 点击Deploy,等待部署完成, 如果有魔法可以进行预览 使用自定义域名 在成功部署并预览OK后, 可以选择通过Netlify..., 你要做的就是提交代码到git平台, 很快就能看到自己博客已经更新 总结 就Hexo博客部署而言, Netlify对于腾讯云是完全的碾压, 免费, 更符合操作习惯的部署方式, 更简单易懂的操作,还有毫不逊色的性能...搭建个人博客设置域名_野猿新一的博客-CSDN博客_netlify 域名 后记 Netlify博客时区Bug 博客文档发布时间在凌晨0到8点,会导致图片展示bug 问题 发布博客时发现页面图片未显示 #

    48510

    在向github提交代码后,我想将代码自动部署到一个开发板(没有公网IP)里

    背景 最近准备把一个开发板用起来,想着做一个开发环境,用来部署前端和后端服务。于是开始调研如何在一块没有公网IP的开发板上做持续部署。...技术方案 由于代码时存储在github上的,部署是在办公室的开发板,连上了wifi,但没有公网ip,办法像服务器那样直接使用ssh进入服务器进行部署。...在开发板上做CD,我们主要解决两个问题,一是在提交代码后,如何触发部署的事件,可以使用GitHub Action,还有一种方法是使用GitHub的 WebHook。...另外一个难题是,在公网里如何知道开发板的IP,这个问题可以使用nodejs的包 localtunnel来解决。...执行部署脚本 exec('.

    16700

    VuePress部署到gitlab,Theme Hope主题部署到gitlab,使用pnpm构建,再同步到netlify绑定腾讯云域名实现免费静态托管网站搭建

    配置好后就能访问了。 另外,如果觉的gitlab不好配置,或速度太慢,可以用下面的方式,直接用netlify部署。我就是直接用netlify部署的,速度很快。...等配置 然后每次提交到的gitlab代码,netlify都会自动构建,构建好后就可以访问了。...netlify有一个好处,可以创建多个二级域名,当然也可以换仓库。 netlify绑定域名 在 Netlify 仪表盘中,进入你的站点设置,点击“Domain settings”。...Netlify DNS Setting中 Name servers,要使用 Netlify DNS,请转到您的域名注册商并将您的域名服务器更改为分配给您的 DNS 区域的以下自定义主机名。...基本能看到了, 这是演示看的,实际为自己填写的域名 图片 启用 HTTPS: 在 Netlify 的域名设置中,启用 Let’s Encrypt 免费 SSL 证书。

    18910

    前端部署VuePress Theme Hope主题部署到gitlab,使用pnpm构建,再同步到netlify绑定腾讯云域名实现免费静态托管网站搭建

    配置好后就能访问了。另外,如果觉的gitlab不好配置,或速度太慢,可以用下面的方式,直接用netlify部署。我就是直接用netlify部署的,速度很快。...等配置然后每次提交到的gitlab代码,netlify都会自动构建,构建好后就可以访问了。...netlify有一个好处,可以创建多个二级域名,当然也可以换仓库。netlify绑定域名在 Netlify 仪表盘中,进入你的站点设置,点击“Domain settings”。...Netlify DNS Setting中 Name servers,要使用 Netlify DNS,请转到您的域名注册商并将您的域名服务器更改为分配给您的 DNS 区域的以下自定义主机名。...基本能看到了, 这是演示看的,实际为自己填写的域名图片启用 HTTPS: 在 Netlify 的域名设置中,启用 Let’s Encrypt 免费 SSL 证书。

    28110

    个人免费博客花式搭建指南 Netlify 篇

    通常一个静态网站生成器所需的编译时长可能不超过一分钟,因此只要不是一个月提交的变更次数超过 300 次编译时长完全足够。...部署 登录 Netlify   正常使用 Github 账号一键登录之后,在 Teams 主页面点击 New site from Git 按钮。...选择项目   在搜索框中搜索想要部署的项目,比如 zhonger/zhonger.github.io,并点击右侧箭头选中完成创建。...自定义域名   在创建好的项目的 Site settings 的 Domain management 中可以对已有的 *.netlify.app 域名进行修改,或添加自定义域名。...验证   浏览器访问 *.netlify.app 域名或者自定义域名或者编译的 Preview deploy 域名,查看上线后的效果。

    10.5K32

    免费创建个人静态网站最佳实践:hugo+github+netlify

    很早就萌发了自己建网站并分享知识的想法,但是又不想在简书这类的网站上写作。原谅我是个拖延控,有时间就写一点,很可能一篇文章写好久,也不喜欢在网上编辑。...但是用得不太顺手,原因有很多,比如:老是花时间在怎么改网页主题上,而不是专注在写作上;markdown(md)文件中的图片迁移很麻烦,网上的图片老是会丢失;github page 在国内打开很慢而且SEO...记得改一下Netlify自动分配给你的域名,不过只能更改前缀。要求不高也还好了。但是可一点也不cool啊,客官别急,请看下面进阶教程。...四、进阶 1、添加主题 首先我们可以到hugo主题库中找一个自己喜欢的主题。我比较喜欢的一个主题是academic,B站上还有人介绍Academic视频。...五、写作 1、图片管理 在md文档中插入的图片是一个麻烦事。一般来说有三种解决方案。如下所示 放置在static中 可以直接把图片放在static中,不过以后图片一多就麻烦了。

    4.9K10

    【ChatGPT快速搭建】手把手教你搭建一个可快速响应的ChatGPT网站,并通过DNS域名部署上线

    1.先看最终效果 在不使用魔法方法的情况下也可以达到快速响应,基本满足日常开发需求 2.vervel网站部署工具简介 这款工具网站可以帮助你快速部署网站上线,省去很多繁杂的配置步骤。...Vervel 是一款适用于静态网站的自动化部署工具,可将您的静态网站部署到 Amazon S3、Netlify 以及其他许多云服务中心。...通过 Vervel,您可以快速、轻松地将您的静态网站上传并分发给全球的用户。 Vervel 提供了一整套工具来帮助您加速和优化您的部署过程。...您可以使用 Vervel 自动更改您的 DNS 设置、自动生成 HTTPS 证书、定期备份您的网站以及获取有关您网站的流量和性能的实时数据。...-当上面的步骤完成后,此时你可以看到已经部署好的网站,并通过你自己的域名来进行访问使用

    1.9K50

    Netlify提供的静态网站渲染和缓存技术

    而且一个单独的HTML文件非常容易在Netlify上托管,通过连接Git存储库或通过Netlify Drop上传。这是我之前创建的一个。...- 在浏览器中键入Web地址- 提交请求- 该请求传输到固定位置的服务器,在那里服务器处理请求,实时构建Web页面,并将其作为HTML文档发送回浏览器。...随着 JavaScript 在 1990 年代末在浏览器中的主流采用,CSR 越来越受欢迎。...在Jamstack.org上查看大量静态站点生成器列表。SSG是最适合不经常更改的内容站点和页面的呈现方法。博客、作品集、文档站点和信息内容都是SSG的绝佳用例。...要更新内容,请触发站点的重新构建,新预生成的资产将在构建过程完成后准备好从CDN提供服务。

    1K30

    Netlify 谈他们遇到的六个现实问题

    在 Netlify,我们很自豪能提供全面的 Next.js 支持,确保开发人员在不牺牲功能的情况下选择部署方案。然而,保持对 Next.js 这种级别的支持是有代价的,并且会带来独特的工程挑战。...在我们的场景中,这就是 Netlify Framework API。...在 Netlify,我们会在 Next.js 构建后自动运行一个构建插件(OpenNext Netlify 适配器)。...通过匹配最新的“金丝雀”版本的测试,我们就能确保在新功能发布和普遍可用之前,逐步增加对新功能的支持,并处理即将到来的破坏性更改(对文档化和未文档化接口的更改)。...我们的目标不是针对性地解决 Next.js 的每个新功能,而是先确定底层平台原语,使该功能易于采用,它不仅局限在 Next.js 中,而是在任何框架中,甚至在没有框架的情况下。

    36510

    部署Netlify站点博客

    Netlify站点部署静态博客 今天尝试把站点部署在Netlify上,因为部署在GitHub Pages上,国内访问速度太慢了,所以就尝试一下别的站点,部署成功之后发现速度还是不太行,后边继续找找原因...Netlify 部署的地址在这里 下图展示GitHub Pages站点和Netlify站点的全国网速对比(数据来源站长工具) 总的来说,效果比GitHub Pages站点速度要快 问题记录 部署的时候...,有几个问题,记录一下: 部署时告警信息直接就阻塞了部署进程,导致部署失败,猜测是一些类似代码扫描工具使然,然后我只得先把造成告警的 hexo-lazyload 插件给剔除掉,然后就可以了(还不了解Netlify...的工作原理,只是临时处理方案) 以下是Netlify部署的部分日志信息 2:13:23 PM: $ hexo generate 2:13:23 PM: INFO Validating config 2...域名的)的昵称(CNAME)) 记录,记录值指向托管网站分配的域名(不带 http(s)/),添加完成之后,记得开启解析(需要等待一会,可以通过 ping 二级域名的方式检查是否解析成功) 托管网站上配置第一步添加的二级域名

    1.4K10

    netlify部署博客

    今天发现github的pages服务居然炸了,不知道谁干的,所以我将目光放到了netlify,以前就早有耳闻,好像速度会比github快,我也不知道是不是,我主要是为了双线部署,解决移动宽带不能访问我博客的原因...不管如何,本篇文章教你如何使用netlify部署你的博客。 登入Netlify Netlify官网 直接使用你的github账号就可以了,如果无法访问这个网站,那你可能需要挂梯。...部署博客 我使用的是hexo所以直接按照以往部署的方式即可 hexo g -d 你无需更改hexo的任何配置,只需要使用这个命令先部署到github。...先下载你的证书文件 解压后,可以看到如下文件 我们只需要Apache目录下的证书文件 image.png 在HTTPS这里,下面应该有两个按钮,因为我已经绑过域名了,所以和你们显示的不一样 我们选择...复制粘贴到下面的第一个框 把带有域名以key结尾的文件内容,复制粘贴到第二个框 把带有bundle的文件内容,复制粘贴到第三个框 最后选择install就可以了 image.png image.png 完成后如下图显示

    1.7K20
    领券