AMP

附录

专家模式关闭

专家模式

使用专家模式隐藏为初学者准备的 Web 开发指南。

什么是 Glitch?

要完成这些课程中包含的代码示例,我们将使用 Glitch。Glitch 是一个在线代码编辑器,允许您创建和查看网站和服务器 API,而无需在计算机上安装任何内容。

Glitch 代码编辑器环境如下所示

Glitch 的在线编辑器

上面的红色框是在线编辑器,您将在其中输入 HTML 和 CSS。绿色框标记的是将带您进入您正在创建的页面的实时版本的按钮。黄色框是允许您创建此项目的副本并进行编辑的按钮。蓝色框表示您可用的文件。在 assets 文件夹中,您可以找到您的图像。

在这些课程中,您将需要各种图像来完成练习。您完成这些课程所需的所有图像都已添加到 Glitch 项目中。要查看项目中的图像,请单击 Glitch 编辑器左侧的文件列表中资产条目。要获取任何单个图像的链接,请从右侧的资产列表中选择图像,然后单击出现的弹出窗口中 URL 旁边的“复制”按钮。您可以在需要图像的任何地方使用该链接。

Glitch 中的资产视图

资产集合中图像的详细信息弹出窗口 - 包括 URL

打开 此项目。单击右上角的“Remix This”按钮。这将创建一个可以编辑的新项目。您可以继续使用相同的编辑器进行本次和未来的培训。未来的每个教程都将让您有机会从该点之前的解决方案参考版本开始。

没有必要使用 Glitch 来完成这些培训。但是,完成练习所需的一些代码在这些课程中没有讨论,而是包含在 Glitch 示例中。如果您想使用其他编辑器,您可能仍然需要进入 Glitch 示例以将 CSS 和服务器代码复制到您的本地解决方案中。

查看服务器响应

我们知道可以通过访问服务器返回的 JSON 对象的属性来呈现服务器响应。但是,您如何真正检查这些属性是什么?

如果您需要检查服务器响应,可以使用浏览器中的开发者工具进行检查。如果您打开 Chrome DevTools 并转到“网络”选项卡,您将在那里找到您的请求。它是“submit-form”请求。如果您单击它,您可以看到所有相关信息。

服务器响应