普通视图

发现新文章,点击刷新页面。
昨天以前首页

时代不同, 我儿子10岁就能通过github pages做一个静态网站

2025年1月24日 06:17

今天,我二娃搞了一个网页/网站,他通过 GitHub Pages 完成的,其实不难。几天前,他注册了一个 GitHub 账户(被戏称为全世界最大的“同志网站”——gayhub),取了个 ID,叫做 faceless15748。他说 faceless15 已经被人注册了。

他还自学了 HTML 和 Markdown,并且稍微懂一些 JavaScript 和 CSS。比我十岁时强多了。我十岁的时候,记得的只有在院子里玩泥巴。

我娃自己查文档、搜索,还会用 Copilot,他说以后想和我一样成为软件工程师。我竟然有点小小的感动。

在这个信息化的时代,技术的门槛越来越低。回想起我小时候,接触计算机和编程的机会并不多,学习的资源也十分有限。然而,今天的孩子们拥有无数的学习机会和工具,他们可以通过网络和开源项目实现几乎任何想法。

ryan-first-website-github-pages-scaled 时代不同, 我儿子10岁就能通过github pages做一个静态网站 学习笔记 折腾 教娃 教育 生活 程序员 编程 网站信息与统计 育儿

我儿子的第一个网站是架在Github上的静态网页。

my-son-ryan-first-website-version-2 时代不同, 我儿子10岁就能通过github pages做一个静态网站 学习笔记 折腾 教娃 教育 生活 程序员 编程 网站信息与统计 育儿

第二个版本,加了个图片,家里的猫Pyro

什么是 GitHub Pages?

GitHub Pages 是一个免费的静态网站托管服务,用户可以通过 GitHub 仓库将 HTML、CSS 和 JavaScript 文件上传,并托管成一个网站。这个服务特别适合个人、项目或组织展示,甚至可以直接用来做博客或者作品集。

如何轻松创建并托管你的 GitHub Pages 站点 (无服务器静态应用)

GitHub Pages 的最大优势之一就是无需服务器支持。所有的文件都会被托管在 GitHub 提供的全球 CDN(内容分发网络)上,加载速度非常快,且完全免费。更重要的是,GitHub Pages 完全支持自定义域名,允许你轻松地展示个人创作。

本文一共 550 个汉字, 你数一下对不对.
时代不同, 我儿子10岁就能通过github pages做一个静态网站. (AMP 移动加速版本)

扫描二维码,分享本文到微信朋友圈
75a5a60b9cac61e5c8c71a96e17f2d9c 时代不同, 我儿子10岁就能通过github pages做一个静态网站 学习笔记 折腾 教娃 教育 生活 程序员 编程 网站信息与统计 育儿
The post 时代不同, 我儿子10岁就能通过github pages做一个静态网站 first appeared on 小赖子的英国生活和资讯.

相关文章:

  1. 教娃编程有趣的瞬间 vlog视频集合 教娃700天:写在教娃编程700天, what’s next?。有很多有意思的瞬间记录一下,持续更新。 和孩子一起打闹,学习,成长。 教娃编程孩子有趣的瞬间 vlog(Day 641) 娃说我不够 Senior(Day 701) Bro.. I thought you’re like...
  2. 如何轻松创建并托管你的 GitHub Pages 站点 (无服务器静态应用) 创建一个 GitHub Pages 站点是一个简单的过程,可以免费为你的个人、项目或组织创建网站/博客。按照此指南开始。 步骤 1:创建 GitHub 仓库 登录你的 GitHub 账户。 点击“新建”来创建仓库。 对于个人站点,命名为 .github.io。 对于项目站点,使用任何有效的名称。...
  3. 按揭贷款(房贷,车贷) 每月还贷计算器 去年给银行借了17万英镑 买了20万7500英镑的房子, 25年还清. 前2年是定率 Fix Rate 的合同 (年利率2.49%). 每个月大概是还 700多英镑. 有很多种还贷的计算方式, 定率/每月固定 是比较常用的. 简单来说就是 每个月交的钱是...
  4. 智能手机 HTC One M9 使用测评 虽然我对手机要求不高, 远远没有像追求VPS服务器一样, 但是怎么算来两年内换了四个手机, 先是三星 S4 用了一年多, 然后 Nokia Lumia 635 Windows Phone, 后来又是 BLU, 半年多前换了...
  5. 最好的发财策略就是忘记它 在群里我和 @nationalpark 说到我用STEEM换了3000多个 YOYOW的时候我还有点沾沾自喜, 谁知道他一针见血: 听说你是steem换的我顿时心理平衡了 才突然想起来, 我半个月前是拿 500 个 STEEM 换了 将近3300个YOYOW. 今天 STEEM的价格8美元,...
  6. 面试刷题更像是一种服从性测试 在许多求职者看来,面试中的刷题环节似乎是对技术能力的直接考察。然而,从另一个角度来看,这一过程或许更像是一场服从性测试。 想象一下,当一个公司要求候选人解决复杂的算法问题或设计一个系统架构时,真正的目的并不仅仅是判断候选人是否能完成这项任务。许多时候,公司更关心的是你是否愿意花时间和精力去迎合他们的流程和标准。 为什么这样说呢?从实际工作中来看,绝大多数岗位并不需要员工每天都在解决高难度的算法问题或从零设计分布式系统。相反,工作中的任务更偏向于理解业务逻辑、维护现有系统以及团队协作。那么,为什么刷题依然是很多公司青睐的筛选方式? 答案或许在于,刷题能有效筛选出那些愿意投入大量时间准备,并在面试中展现高度配合精神的候选人。这种配合精神,是公司希望在未来的工作中看到的品质。一旦你通过了这些测试,公司就会认为你是一个值得信赖的员工,一个能遵从流程、适应规则并在需要时投入额外努力的人。 还有就是以前说的:面试刷力扣是大公司过滤的成本较低的方法之一:为啥有名的IT公司的程序员面试都这么难?,可以过滤掉大部分 False Positive,当然也有可能过滤掉人才(胜任工作的求职者)。不过对于大厂来说,招进来一个False Positive的损害要远远比错过一个False Negative大。 此外,随着AI技术的飞速发展,刷题的技术价值正在逐渐降低。像ChatGPT这样的AI工具,已经可以轻松解决LeetCode或Codeforces上的许多高难度问题,并给出清晰的解题过程。这表明,算法题不再是人类独有的技术优势,而是可以被高效地自动化处理的任务。这种变化进一步凸显了刷题在实际工作中的局限性,因为日常工作更多依赖于沟通、业务理解和对系统的长期维护,而不是短时间内解决某个抽象问题。 OpenAI推出o3大语言AI模型。 Codeforces 评分:2727——相当于全球人类程序员编码竞赛中,排名第 175 位。...
  7. 英国 NatWest 银行推出 Reward Current Account 用来交水电费等帐单可以省钱 英国 NatWest 银行推出 Reward Current Account 银行帐号, 每个月需要交会费 3 英镑, 一年则需要36英镑 并不便宜, 但是好处是 只要通过该帐号以 Direct...
  8. 科学上网 通过 CloudFlare Worker 搭建 Js Proxy代理 CloudFlare 的 Worker 就是 Serverless (无服务器, 所有程序跑在云端). 以前是付费的, 现在免费了. 免费帐号可以创建30个 Worker, 每个帐号每天可以有10万次免费请求. 超过了可以配置 Fail Open...

如何轻松创建并托管你的 GitHub Pages 站点 (无服务器静态应用)

2025年1月24日 05:10

创建一个 GitHub Pages 站点是一个简单的过程,可以免费为你的个人、项目或组织创建网站/博客。按照此指南开始。

步骤 1:创建 GitHub 仓库

  • 登录你的 GitHub 账户。
  • 点击“新建”来创建仓库。
  • 对于个人站点,命名为 .github.io。
  • 对于项目站点,使用任何有效的名称。

步骤 2:添加你的站点文件

使用以下命令克隆仓库到本地机器:

git clone https://github.com/<username>/<repository-name>.git

创建一个 index.html 文件,包含你想要的内容。这里是一个例子:

<!DOCTYPE html>  
<title>我的 GitHub 页面</title>
<h1>欢迎访问我的站点</h1>
<p>这是我的第一个 GitHub Pages 站点。</p>

或者,你可以使用 README.md(Markdown)作为首页。

## 我的 Github 页面
### 欢迎访问我的站点
THis is my first Github Pages site.

将你的更改提交并推送到 GitHub:

git add .
git commit -m "Initial commit"
git push origin main
how-to-setup-github-pages-static-apps 如何轻松创建并托管你的 GitHub Pages 站点 (无服务器静态应用) Github 学习笔记 小技巧 程序设计 网站信息与统计 计算机 计算机

Github 上启用 Github Pages 的步骤

步骤 3:启用 GitHub Pages

  • 转到你的仓库设置。
  • 在侧边栏点击“Pages”。
  • 在“源”下选择分支(例如,main)和文件夹(如果适用)。
  • 点击“保存”。

步骤 4:查看你的站点

  • 对于个人站点:访问 https://<username>.github.io/。
  • 对于项目站点:访问 https://<username>.github.io/<repository-name>/。

步骤 5:自定义你的站点

要添加主题,请转到 Pages 设置并选择“选择一个主题”。

你还可以上传额外的 HTML、CSS 和 JavaScript 文件以进行进一步的自定义。

为什么 GitHub Pages 是“无服务器静态应用” / Serverless Apps

GitHub Pages 作为无服务器静态应用运行,因为它们直接向用户提供预构建的静态 HTML、CSS 和 JavaScript 文件,而不依赖后端服务器或运行时动态内容生成。相反,这些文件托管在 GitHub 的全球内容分发网络(CDN)上,确保快速有效的交付。

优点:

  • GitHub 提供的免费托管。
  • 不需要服务器维护。
  • 由于 CDN 分布,加载速度快。
  • 简化了静态站点的部署和扩展。

缺点:

  • 仅限于静态内容;不支持像数据库这样的服务器端功能。
  • 高级工作流的自定义需要技术知识。
  • 依赖于 GitHub 的基础设施。

GitHub Pages 的总结

GitHub Pages 是一个令人赞叹的免费托管网站的工具。只需几步,你就可以为你的项目、作品集或个人使用创建一个站点。通过利用无服务器模型,你可以构建轻量、高效且维护最小的站点。

英文:How to Setup and Create GitHub Pages (Serverless Static Apps)

本文一共 587 个汉字, 你数一下对不对.
如何轻松创建并托管你的 GitHub Pages 站点 (无服务器静态应用). (AMP 移动加速版本)

扫描二维码,分享本文到微信朋友圈
75a5a60b9cac61e5c8c71a96e17f2d9c 如何轻松创建并托管你的 GitHub Pages 站点 (无服务器静态应用) Github 学习笔记 小技巧 程序设计 网站信息与统计 计算机 计算机
The post 如何轻松创建并托管你的 GitHub Pages 站点 (无服务器静态应用) first appeared on 小赖子的英国生活和资讯.

相关文章:

  1. 英国房子的EPC节能报告(Energe/Efficiency Performance Certificate) EPC (Energe/Efficiency Performance Certificate) 是英国房子的节能报告, 法律上规定, 每个房子都必须要有一个EPC报告, 报告的有效期为十年. 房东在把房子出租或者想卖房的时候, 这个EPC就必须有效, 在一些情况下 比如出租房子的时候, 这个EPC报告还必须符合一些最低标准, 比如房子必须满足 F档(类似及格线)...
  2. 按揭贷款(房贷,车贷) 每月还贷计算器 去年给银行借了17万英镑 买了20万7500英镑的房子, 25年还清. 前2年是定率 Fix Rate 的合同 (年利率2.49%). 每个月大概是还 700多英镑. 有很多种还贷的计算方式, 定率/每月固定 是比较常用的. 简单来说就是 每个月交的钱是...
  3. 最好的发财策略就是忘记它 在群里我和 @nationalpark 说到我用STEEM换了3000多个 YOYOW的时候我还有点沾沾自喜, 谁知道他一针见血: 听说你是steem换的我顿时心理平衡了 才突然想起来, 我半个月前是拿 500 个 STEEM 换了 将近3300个YOYOW. 今天 STEEM的价格8美元,...
  4. 智能手机 HTC One M9 使用测评 虽然我对手机要求不高, 远远没有像追求VPS服务器一样, 但是怎么算来两年内换了四个手机, 先是三星 S4 用了一年多, 然后 Nokia Lumia 635 Windows Phone, 后来又是 BLU, 半年多前换了...
  5. 英国TESCO超市有偿回收瓶子 前不久, 英国剑桥 Bar Hill 的的 TESCO乐购超市推出了一个回收瓶子的机器, 这机器就在超市入入口出. 只需要把瓶子放进去, 机器自动识别, 然后每个瓶子10P也就是相当于1块人民币. 完成后会给个小票, 买东西可以拿来当折扣用. 如果嫌麻烦, 在回收完成还可以选择捐给慈善机构. 机器非常人性化,...
  6. 面试刷题更像是一种服从性测试 在许多求职者看来,面试中的刷题环节似乎是对技术能力的直接考察。然而,从另一个角度来看,这一过程或许更像是一场服从性测试。 想象一下,当一个公司要求候选人解决复杂的算法问题或设计一个系统架构时,真正的目的并不仅仅是判断候选人是否能完成这项任务。许多时候,公司更关心的是你是否愿意花时间和精力去迎合他们的流程和标准。 为什么这样说呢?从实际工作中来看,绝大多数岗位并不需要员工每天都在解决高难度的算法问题或从零设计分布式系统。相反,工作中的任务更偏向于理解业务逻辑、维护现有系统以及团队协作。那么,为什么刷题依然是很多公司青睐的筛选方式? 答案或许在于,刷题能有效筛选出那些愿意投入大量时间准备,并在面试中展现高度配合精神的候选人。这种配合精神,是公司希望在未来的工作中看到的品质。一旦你通过了这些测试,公司就会认为你是一个值得信赖的员工,一个能遵从流程、适应规则并在需要时投入额外努力的人。 还有就是以前说的:面试刷力扣是大公司过滤的成本较低的方法之一:为啥有名的IT公司的程序员面试都这么难?,可以过滤掉大部分 False Positive,当然也有可能过滤掉人才(胜任工作的求职者)。不过对于大厂来说,招进来一个False Positive的损害要远远比错过一个False Negative大。 此外,随着AI技术的飞速发展,刷题的技术价值正在逐渐降低。像ChatGPT这样的AI工具,已经可以轻松解决LeetCode或Codeforces上的许多高难度问题,并给出清晰的解题过程。这表明,算法题不再是人类独有的技术优势,而是可以被高效地自动化处理的任务。这种变化进一步凸显了刷题在实际工作中的局限性,因为日常工作更多依赖于沟通、业务理解和对系统的长期维护,而不是短时间内解决某个抽象问题。 OpenAI推出o3大语言AI模型。 Codeforces 评分:2727——相当于全球人类程序员编码竞赛中,排名第 175 位。...
  7. 英国 NatWest 银行推出 Reward Current Account 用来交水电费等帐单可以省钱 英国 NatWest 银行推出 Reward Current Account 银行帐号, 每个月需要交会费 3 英镑, 一年则需要36英镑 并不便宜, 但是好处是 只要通过该帐号以 Direct...
  8. 离开 NPower – 在英国选择便宜的电气公司 extraenergy 在彻底离开 谢菲尔得的那一天 和房东一起读了 电表, 公寓里只用电 没有媒气 所以做饭也用电 特别贵. 虽然在 13年底装了 两个电表. 白天一个 晚上 12点到早上7点另一个表, 所以两个计费....

记一次网站故障及 CloudFlare Pages 的两种典型配置

2024年4月17日 09:40

基本概念

在尝试 Astro 的发布时,官方推荐的是 Netlify,但在个人经验上,国内环境 Netlify 服务可用性不如 Cloudflare。

毕竟 Cloudflare 是 今日市值 307.40 亿美元的公司,股价 91.04 美元,员工 3000 多人,而 Netlify 还在 C 轮,员工数量没有明确公开数据,约 244 人。

无论服务取啥名,构建个人网站,这里用到的服务主要有两种:一种是指 CDN,另一种是 ADS。

  • CDN 即 Content Delivery Network,将内容分发到全球的多个网络节点中,这样用户访问内容时,会从离用户近的节点返回内容,属于空间换时间。
  • ADS 即 Automated Deployment Services / System,即自动化发布服务/系统,可以触发发布编译调度服务,以自动地从源码构建并进行发布。
零信任网络

Cloudflare 自夸在全球网络标准类别获得 Forrester 报告中所有 SSE 供应商中的最高分,而 Netlify 体量相对小,但服务也算是不错。

这里的 SSE,以及 SASE,都是相对较新的词,是一套适配现代企业架构的安全边缘计算服务和产品。

听起来陌生,倒不是因为它们出来晚,而是因为这套服务成本不低,阿里云也有类似服务,但头部还是这些

怎么理解?通俗讲,这套服务就是疫情下的远程办公需求催生的。

原先,员工到达办公地点,从公司内的终端接入公司网络,访问内容和资源,就是说,只要员工在物理场所内,就获得了公司内公开内容的信任,以前出差的员工多采用 VPN。

而远程办公需求下,员工从全球接入公司网络,VPN 存在很多不必要的成本,比如:

  1. 访问其它公司的在线服务,没有必要走公司网络流量。
  2. 原先 VPN 的接入可以给与一定地域和 IP 限制,而对于全球企业来说,随时可能就几百几千员工在出差,由专人管理访问规则成本会太高,不如公司内部网络和应用对接入者都进行严格验证和授权。
  3. 公司可以不用管员工从哪里以及如何使用公司资源,这些资源都被相对封闭在浏览器沙盒和员工设备中,从而获得了办公的灵活性,也有日志可以事后审计。

Gartner 称 SSE = SASE - SD-WAN,原先想推广的是 SASE(Secure Access Service Edge),如 Cloudflare One 服务,但公司要迁移到这样的环境,除非是新公司,否则会困难重重,因此又推出了 SSE 这种更容易落地的服务。

这些设施和服务,其实都是为了简化小公司与 IT 有关的工作,借助 SSE 可以缩短 IT 基础设施建设周期,更轻便灵活的起步开创全球化业务,但从长远来看,自建这些设施和服务是无可回避的。

所有成功构建护城河的现代公司,必然都是 IT 中厂,这也是现代公司面临的窘境,最终有一环你的成本永远都不会比互联网公司低,若互联网公司欲涉足你的领域,你会不具备此竞争优势。

关于故障

网站出现故障是因我将 GitHub Pages 服务迁移到 Cloudflare Pages 构建,而 kaffa.im 的构建模式依赖本地服务。

在此,我又想到了那句—— 所编写的每一行代码都是成本

这里要实现 kaffa.im 的自动构建,需要去掉本地数据依赖,方式有:

  1. 将依赖的数据先本地 fetch 好,作为数据库或 json 上传。
  2. 将系统部署到云端。

我想我可能会选择没有成本的方式 1。

关于本地构建和远程构建

本地构建适合本地依赖多的场景,远程构建的前提是依赖标准化组件和服务。远程构建确实更方便,但要考虑的是,这种免费构建服务的生命周期有多长,犹其是内容价值非常高且服务中断成本非常高时。

本地构建的配置

  1. 将 DNS 指向 Cloudflare 的 DNS,这一步非必须的,按这样做可以简化后续设置域名。
  2. Pages 服务中,在 Settings 标签的 Builds & deployments 节下,如果你的静态内容是在目录下,则需要将:
    • Build output directory 设置为这个目录,比如 /disc 或 /docs 等。
    • Root directory Pages 的发布目录,默认为 / 即可。

远程构建的配置

可以使用 Cloudflare 的 Connect to Git 功能,也可以使用 Common Worker examples 开始。远程构建的优势是,你只管写内容和提交,其余的交给 Cloudflare,它会先从 Git 拉源码,再构建,再发布,勤勤恳恳的免费打工人。

❌
❌