Skip to content

搞英语 → 看世界

翻译英文优质信息和名人推特

Menu
  • 首页
  • 作者列表
  • 独立博客
  • 专业媒体
  • 名人推特
  • 邮件列表
  • 关于本站
Menu

应该有人为 Web 构建 X”——为什么不是你呢?您只需要一个 GitHub 帐户

Posted on 2022-05-10

上周,Šime Vidas 在 Twitter 上抱怨说,很难在移动设备上粘贴一段文本。我建议使用 pastebin.com,但在粘贴之前需要多次点击。 Šime 然后继续开玩笑说我们应该创建 pastebinzero.com,它所需要的只是全屏。



所以我实际上花了一分钟来构建它。在我的浏览器中,只有 GitHub 登录。从设置到支持自动完成的编码再到托管。您可以在https://codepo8.github.io/pastebinzero看到它的全部荣耀,并在https://github.com/codepo8/pastebinzero查看代码。

你也可以这样做。这里是如何。

如果您想将其视为视频,请查看以下约 2 分钟的演练。

否则,这里是在 GitHub 上启动、构建和托管任何基于HTML /CSS/JavaScript 的项目的步骤。

  • 转到您的 GitHub 个人资料,单击“存储库”,然后按“新建”按钮在 GitHub 中创建新仓库的动画
  • 您需要命名存储库,因为稍后这也将成为URL的一部分。 GitHub 会自动告诉您 repo 名称是否仍然可用。确保您的存储库是公开的并点击“创建存储库”。如果您不想显示源代码而只想让人们看到结果,您也可以将其保密。生成的 GitHub 页面始终是公开的。 命名和创建新存储库的动画
  • 这创建了存储库,您可以获得接下来要做什么的各种信息。现在,单击“创建新文件”链接。 在 GitHub 存储库中创建新文件的动画
  • 将文件命名为 `index.html` 并输入任何内容作为内容。现在这并不重要,因为这里的编辑器可以进行一些快速修复,但不会削减芥末。按“提交新文件”按钮,您将获得一个新文件。 在存储库中创建索引文件的动画
  • 转到“设置”选项卡并选择“页面”菜单项。确保从下拉菜单中选择“主”分支并点击“保存”。这使您正在处理的内容可作为 Web 上的URL 在 GitHub 上发布页面的动画
  • 返回到存储库的“代码”部分,然后按“。”按钮。这会在此项目打开的情况下在浏览器中加载 Visual Studio Code。您现在可以使用VS Code 的全部功能编写您的项目,包括自动完成和 IntelliSense。 在存储库中打开 VS 代码并编辑文件的动画
  • 完成后,转到 VS 代码中的“源代码管理”选项,输入提交消息并单击复选标记。这会将更改提交到存储库。 添加提交消息并提交文件的动画
  • 您可以在存储库的“操作”选项卡上查看您的产品何时在线可用。检查“页面构建和部署”工作流程。在页面准备好之前,它会显示一个黄色微调器。当它变成绿色复选标记时,您的页面就准备好了。 GitHub 的 Actions 选项卡中显示的构建过程动画

对于视频演示,代码可在https://github.com/codepo8/greencircle获得,浏览器内版本可在https://codepo8.github.io/greencircle看到,其中 `codepo8` 是我的 GitHub 用户name 和 `greencircle` 存储库的名称

为什么不用 codepen、jsbin、codesandbox、jsfiddle……?

有许多地方可以在线托管和编辑项目,它们都有其优点和问题。我真的很喜欢这种方式,因为它为我提供了 Visual Studio Code 的全部功能,而且我的项目处于版本控制中。我拥有所有代码,可以随时下载。我也可以允许其他人分叉和改变它。

许多这些功能在其他平台上也可用,我真的很喜欢你可以在编码时立即看到项目的结果。但这感觉像是一个很棒的端到端解决方案,无论如何我的大部分工作只需要一次登录。顺便说一句,如果您想在浏览器中立即显示您的项目在VS Code 中,您还可以安装“Codeswing”:https://ift.tt/TRh5XqO 扩展。

原文: https://christianheilmann.com/2022/05/09/someone-should-build-x-for-the-web-why-not-you-all-you-need-is-a-github-account/

本站文章系自动翻译,站长会周期检查,如果有不当内容,请点此留言,非常感谢。
  • Abhinav
  • Abigail Pain
  • Adam Fortuna
  • Alberto Gallego
  • Alex Wlchan
  • Answer.AI
  • Arne Bahlo
  • Ben Carlson
  • Ben Kuhn
  • Bert Hubert
  • Bits about Money
  • Brian Krebs
  • ByteByteGo
  • Chip Huyen
  • Chips and Cheese
  • Christopher Butler
  • Colin Percival
  • Cool Infographics
  • Dan Sinker
  • David Walsh
  • Dmitry Dolzhenko
  • Dustin Curtis
  • eighty twenty
  • Elad Gil
  • Ellie Huxtable
  • Ethan Dalool
  • Ethan Marcotte
  • Exponential View
  • FAIL Blog
  • Founder Weekly
  • Geoffrey Huntley
  • Geoffrey Litt
  • Greg Mankiw
  • Henrique Dias
  • Hypercritical
  • IEEE Spectrum
  • Investment Talk
  • Jaz
  • Jeff Geerling
  • Jonas Hietala
  • Josh Comeau
  • Lenny Rachitsky
  • Liz Danzico
  • Lou Plummer
  • Luke Wroblewski
  • Matt Baer
  • Matt Stoller
  • Matthias Endler
  • Mert Bulan
  • Mostly metrics
  • News Letter
  • NextDraft
  • Non_Interactive
  • Not Boring
  • One Useful Thing
  • Phil Eaton
  • Product Market Fit
  • Readwise
  • ReedyBear
  • Robert Heaton
  • Rohit Patel
  • Ruben Schade
  • Sage Economics
  • Sam Altman
  • Sam Rose
  • selfh.st
  • Shtetl-Optimized
  • Simon schreibt
  • Slashdot
  • Small Good Things
  • Steve Blank
  • Taylor Troesh
  • Telegram Blog
  • The Macro Compass
  • The Pomp Letter
  • thesephist
  • Thinking Deep & Wide
  • Tim Kellogg
  • Understanding AI
  • Wes Kao
  • 英文媒体
  • 英文推特
  • 英文独立博客
©2025 搞英语 → 看世界 | Design: Newspaperly WordPress Theme