Category : 教程系列

该系列的一部分: 如何使用 HTML 构建网站 本教程系列将指导您使用 HTML(用于在 Web 浏览器中显示文档的标准标记语言)创建和进一步自定义该网站。不需要有任何编码经验,但如果您想重新创建演示网站,我们建议您从本系列的开头开始。 在本系列结束时,您应该有一个准备好部署到云的网站,并且基本熟悉 HTML。了解如何编写 HTML 将为学习其他前端 Web 开发技能(例如 CSS 和 JavaScript)奠定坚实的基础。 HTML Content Division 元素 ( <div>) 充当容器,将网页结构化为单独的组件以进行单独的样式设置。本教程将教您如何<div>在网页上创建容器并为其设置样式。 就其本身而言,该<div>元件在页面的布局影响不大,通常给出的属性来调整其大小,颜色,位置,或其他特征。通常,开发人员<div>使用 CSS 为元素设置样式,但本教程将<div>通过直接在 HTML 文档中设置样式来让您了解元素的工作原理。 该<div>元素使用 HTMLstyle属性设置样式。如下例所示,一个<div>元素可以包含多个样式属性: <div style=”property: value; property: value;”></div> 请注意,该<div>元素具有开始和结束标记,但不需要任何内容​​。要了解该<div>元素在实践中的工作原理,请清除您的index.html文件并将以下代码粘贴到其中。(如果您还没有关注教程系列,您可以index.html在我们的教程设置您的 HTML 项目 中查看设置文件的说明。 <div style=”width:300px;height:200px; background-color:red;”> </div> 保存文件并在浏览器中重新加载它。(有关在浏览器中加载文件的说明,请在此处查看我们的教程。)您应该会收到一个宽度为 300 像素、高度为 200 像素的红色框,如下所示: 您还可以<div>通过在开始和结束<div>标记之间添加内容来向元素添加内容。尝试在<div>标签之间添加文本,如下所示: <div style=”width:300px;height:300px; background-color:red;”> This is ..

Read more

作为Write for DOnations计划的一部分,作者选择了免费和开源基金来接受捐赠。 介绍 WebDAV是 HTTP 协议的扩展,允许用户管理远程服务器上的文件。有多种使用 WebDAV 服务器的方法,例如,您可以通过将 Word 或 Excel 文档上传到您的 WebDAV 服务器与同事共享它们。您还可以通过简单地给他们一个 URL 与您的家人和朋友分享您的音乐收藏。所有这一切都可以在他们不安装任何额外软件的情况下实现,因为一切都内置在他们的操作系统中。 在本文中,您将配置一个 Apache Web 服务器,以通过 SSL 和密码身份验证从 Windows、Mac 和 Linux 启用 WebDAV 访问。 先决条件 在开始本指南之前,您需要具备以下条件: 一个 Ubuntu 20.04 服务器。按照Ubuntu 20.04的初始服务器设置创建一个启用 sudo 的非 root 用户。 解析为您服务器的公共 IP 地址的域名。该域名和DNS介绍如何设置此。 配置为为您的域提供服务的 Apache Web 服务器,您可以完成如何在 Ubuntu 20.04 上安装 Apache Web 服务器教程来进行设置——确保按照步骤5——设置虚拟主机作为此先决条件的一部分。 您的域名的 SSL ..

Read more

介绍 表是按行和列组织的一组数据。表格可用于显示数据类型之间的联系,例如产品及其成本、就业和就业日期,或航班和出发时间。在本教程中,您将使用 HTML 创建一个表格,通过添加所需数量的行和列对其进行自定义,并添加行和列标题以使您的表格更易于阅读。 先决条件 熟悉HTML。如果您不熟悉 HTML 或需要复习,您可以查看我们如何使用 HTML教程系列的前三个教程。 index.html练习创建 HTML 表格的文件。如果您不知道如何创建index.html文件,请按照我们的简短教程如何设置您的 HTML 项目中的说明进行操作。 HTML 表格的基础 一个 HTML 表格是用一个开始<table>标签和一个结束</table>标签创建的。在这些标签内,通过使用打开和关闭表行<tr>标签以及打开和关闭表数据<td>标签将数据组织成行和列。 表格行<tr>标签用于创建一行数据。在开闭表<tr>标签内部,开闭表数据<td>标签用于按列组织数据。 例如,这是一个有两行三列的表: <table> <tr> <td>Column 1</td> <td>Column 2</td> <td>Column 3</td> </tr> <tr> <td>Column 1</td> <td>Column 2</td> <td>Column 3</td> </tr> </table> 要探索 HTML 表格在实践中的工作原理,请将上面的代码片段粘贴到index.html您在本教程中使用的文件或其他 html 文件中。 在浏览器中保存并重新加载文件以检查结果。(有关在浏览器中加载文件的说明,请访问我们的 HTML 元素教程的这一步。) 您的网页现在应该有一个包含三列两行的表格: 要添加额外的行,请将突出显示的<tr>元素添加到表格底部: <table> <tr> <td>Column 1</td> <td>Column 2</td> ..

Read more

本教程的先前版本由Melissa Anderson编写。 介绍 R 是一种开源编程语言,专门用于统计计算和图形。在 R 统计计算基金会的支持下,它被广泛用于开发统计软件和执行数据分析。R 是一种日益流行且可扩展的语言,社区活跃,为特定研究领域提供了许多用户生成的包,这使其适用于许多领域。 在本教程中,我们将安装 R 并展示如何从官方综合 R 存档网络 (CRAN)添加包。 先决条件 要学习本教程,您需要一个 Ubuntu 18.04 服务器,其中包含: 至少1GB 的内存 具有sudo特权的非 root 用户 要了解如何实现此设置,请遵循我们的手动初始服务器设置指南或运行我们的自动化脚本。 一旦这些先决条件到位,您就可以开始了。 第 1 步 – 安装 R 由于 R 是一个快速发展的项目,因此 Ubuntu 的存储库并不总是提供最新的稳定版本,因此我们将从添加 CRAN 维护的外部存储库开始。 注意: CRAN 在其网络内维护存储库,但并非所有外部存储库都是可靠的。确保仅从受信任的来源安装。 让我们先添加相关的 GPG 密钥。 sudo apt-key adv –keyserver keyserver.ubuntu.com –recv-keys E298A3A825C0D65DFD57CBB651716619E084DAB9 当我们运行命令时,我们将收到以下输出: OutputExecuting: /tmp/apt-key-gpghome.4BZzh1TALq/gpg.1.sh ..

Read more

作者选择了COVID-19 救济基金来接受捐赠,作为Write for DOnations计划的一部分。 介绍 ECMAScript 规范 (ES6)的2015 版向 JavaScript 语言添加了模板文字。模板字面量是在 JavaScript中创建字符串的一种新形式,它添加了许多强大的新功能,例如更轻松地创建多行字符串以及使用占位符将表达式嵌入到字符串中。此外,称为标记模板文字的高级功能允许您对字符串中的表达式执行操作。所有这些功能都增加了作为开发人员的字符串操作选项,让您可以生成可用于URL或自定义HTML 元素的函数的动态字符串。 在本文中,您将回顾单/双引号字符串和模板文字之间的区别,通过各种方式来声明不同形状的字符串,包括多行字符串和根据变量值而变化的动态字符串或表达。然后,您将了解标记模板并查看使用它们的一些实际项目示例。 声明字符串 本节将回顾如何使用单引号和双引号声明字符串,然后将向您展示如何对模板文字执行相同的操作。 在 JavaScript 中,字符串可以用单引号 ( ‘ ‘)编写: const single = ‘Every day is a good day when you paint.’ 字符串也可以用双引号 ( ” “)编写: const double = “Be so very light. Be a gentle whisper.” JavaScript 在单引号或双引号字符串之间没有重大区别,这与其他语言可能允许在一种类型的字符串中而不是另一种类型中进行插值不同。在这种情况下,插值是指将占位符评估为字符串的动态部分。 单引号或双引号字符串的使用主要取决于个人喜好和约定,但结合使用时,每种类型的字符串只需要转义其自己的引号类型: // Escaping a ..

Read more

介绍 通用唯一标识符 (UUID) 是 128 位数字,它们在创建它们的本地系统上以及过去和未来在其他系统上创建的 UUID 中被认为是唯一的。由于它们的独特性,它们在自动递增的主键可能不足的情况下派上用场。 由于其独特性,UUID 非常适合生成测试数据。需要随机字符串吗?UUID 没问题。电子邮件呢?[email protected]是很棒的。需要一堆随机字符串?UUID 将是独一无二的,使它们在系统中移动时易于追踪。 要从命令行界面生成通用唯一标识符,您可以使用该uuidgen实用程序, 在本教程中,您将使用uuidgen和一些 shell 脚本来生成 UUID 和一些示例数据。 启动互动终端! 生成 UUID 该uuidgen命令通常已经安装在类 Unix 操作系统上,例如 Linux 和 macOS。如果不是,您可以通过包管理器安装它。在 Ubuntu 和 Debian 系统上,安装该uuid-runtime软件包。 首先,使用以下apt update命令更新系统的可用软件包列表: sudo apt update 接下来uuid-runtime使用apt包管理器安装包: sudo apt install uuid-runtime 要生成单个 UUID,请运行uuidgen不带任何参数的命令。开箱即用,uuidgen每次运行时都会生成一个随机 UUID。 在终端中执行以下命令: uuidgen 您将看到类似于以下内容的输出,但您的 UUID 会有所不同: Outputa522f494-92ce-44e9-b1a3-f891baed8d60 注意:macOS 版本的uuidgen功能与 Linux 版本的功能略有不同,即返回所有大写字母的 UUID。 ..

Read more

在这个由三部分组成的教程中,我们将使用Flask(一个 Python 微框架)构建一个 CRUD(创建、读取、更新、删除)员工管理 Web 应用程序。我将应用程序命名为 Project Dream Team,它将具有以下功能: 用户将能够以员工身份注册和登录 管理员将能够创建、更新和删除部门和角色 管理员将能够将员工分配到部门并为其分配角色 管理员将能够查看所有员工及其详细信息 第一部分将涵盖: 数据库设置 楷模 移民 主页 验证 准备好?开始了! 先决条件 本教程建立在我的介绍性教程Flask 入门的基础上,从它停止的地方开始。它假设您首先安装了以下依赖项: 蟒蛇 2.7 烧瓶 virtualenv(和,可选,virtualenvwrapper) 您应该设置并激活了一个虚拟环境。您还应该具有以下文件和目录结构: ├── dream-team    ├── app    │   ├── __init__.py    │   ├── templates    │   ├── models.py   │   └── views.py    ├── config.py     ├── ..

Read more

介绍 Google Maps 是 Google 提供的地图服务,支持多种配置设置。将 Google 地图添加到您的应用程序可以为用户提供比街道地址或坐标集更多的上下文信息。 本教程旨在将 Google Maps API 集成到您的 React 组件中,并使您能够在您的网站上显示地图。 先决条件 要完成本教程,您需要: Node.js 安装在本地,您可以按照如何安装 Node.js 和创建本地开发环境来完成。 熟悉React JavaScript 框架。 一个Google Maps JavasScript API 密钥。 这将需要一个 Google 帐户,登录到 Google Cloud Platform Console,创建一个新项目,并为该项目启用 Google Maps JavasScript API。 注意:为避免在使用 Google Maps API 时出现“仅用于开发目的”消息,您需要提供有效的信用卡并与 Google Cloud 项目的结算帐户相关联,但本教程不需要这样做。 本教程已通过 Node v14.2.0、npmv6.14.5、reactv16.13.1 和google-maps-reactv.2.0.6 验证。 步骤 1 ..

Read more

介绍 的filter()阵列方法创建与下从现有的阵列的给定条件落入元素的数组: var numbers = [1, 3, 6, 8, 11]; var lucky = numbers.filter(function(number) { return number > 7; }); // [ 8, 11 ] 上面的示例采用numbers数组并返回一个新的过滤数组,其中仅包含大于 7 的值。 过滤器语法 var newArray = array.filter(function(item) { return condition; }); 的项目参数是作为过滤器()检查到当前元素的引用数组中它抵靠状态。在对象的情况下,这对于访问属性很有用。 如果当前项通过条件,则将其发送到新数组。 过滤对象数组 .filter() 的一个常见用例是通过对象的属性使用对象数组: var heroes = [ {name: “Batman”, franchise: “DC”}, {name: “Ironman”, franchise: “Marvel”}, {name: ..

Read more

介绍 服务器发送事件 (SSE) 是一种基于 HTTP 的技术。在客户端,它提供了一个名为EventSource(HTML5 标准的一部分)的 API ,允许我们连接到服务器并从它接收更新。 在决定使用服务器发送的事件之前,我们必须考虑两个非常重要的方面: 它只允许从服务器接收数据(单向) 事件仅限于 UTF-8(无二进制数据) 如果您的项目仅接收诸如股票价格或正在进行的某事的文本信息之类的信息,则可以使用 Server-Sent Events 而不是WebSockets之类的替代方案。 在本文中,您将为后端和前端构建一个完整的解决方案,以处理从服务器到客户端的实时信息流。服务器将负责向所有连接的客户端发送新的更新,Web 应用程序将连接到服务器,接收这些更新并显示它们。 先决条件 要完成本教程,您需要: Node.js 的本地开发环境。遵循如何安装 Node.js 并创建本地开发环境。 熟悉快递。 熟悉 React(和hooks)。 cURL用于验证端点。这可能已经在您的环境中可用,或者您可能需要安装它。熟悉使用命令行工具和选项也会有所帮助。 本教程已通过 cURL v7.64.1、Node v15.3.0、npmv7.4.0、expressv4.17.1、body-parserv1.19.0、corsv2.8.5 和reactv17.0.1 验证。 第 1 步 – 构建 SSE Express 后端 在本节中,您将创建一个新的项目目录。项目目录内部将是服务器的子目录。稍后,您还将为客户端创建一个子目录。 首先,打开你的终端并创建一个新的项目目录: mkdir node-sse-example 导航到新创建的项目目录: cd node-sse-example 接下来,创建一个新的服务器目录: mkdir sse-server 导航到新创建的服务器目录: cd ..

Read more