该系列的一部分： 如何编写 Ansible Playbooks Ansible 是一种现代配置管理工具，不需要在远程节点上使用代理软件，仅使用 SSH 和 Python 在托管服务器上进行通信和执行命令。本系列将带您了解可用于编写服务器自动化剧本的主要 Ansible 功能。最后，我们将看到一个实际示例，说明如何创建剧本以自动设置远程 Nginx Web 服务器并向其部署静态 HTML 网站。 就像您在终端上执行的常规命令一样，某些任务需要特殊权限才能让 Ansible 在您的远程节点上成功执行它们。 了解权限提升在 Ansible 中的工作原理很重要，这样您就可以使用适当的权限执行任务。默认情况下，任务将作为连接用户运行 – 这可能是root或任何对清单文件中的远程节点具有 SSH 访问权限的普通用户。 要运行具有扩展权限的命令，例如需要 的命令sudo，您需要在您的游戏中包含become设置为的指令yes。这既可以作为对该剧中所有任务有效的全局设置，也可以作为每个任务应用的单独指令来完成。根据您的sudo用户在远程节点中的设置方式，您可能还需要提供用户的sudo密码。以下示例更新apt缓存，这是一项需要root权限的任务。 playbook-07.yml在您的ansible-practice目录中创建一个名为的新文件： nano ~/ansible-practice/playbook-07.yml 然后将以下行添加到新的剧本文件中： ~/ansible-practice/playbook-07.yml — – hosts: all become: yes tasks: – name: Update apt cache apt: update_cache: yes 完成后保存并关闭文件。 要运行此剧本，您需要-K在ansible-playbook命令中包含该选项。这将使 Ansible 提示您sudo输入指定用户的密码。 ansible-playbook -i ..
Category : 教程系列
介绍 Composer是一个流行的 PHP 依赖管理工具，创建主要是为了方便项目依赖的安装和更新。它将检查特定项目依赖哪些其他包并为您安装它们，根据项目要求使用适当的版本。Composer 还常用于引导基于流行的 PHP 框架（例如Symfony和Laravel ）的新项目。 在本教程中，您将在 Ubuntu 20.04 系统上安装并开始使用 Composer。 先决条件 为了遵循本指南，您需要以非 rootsudo用户身份访问 Ubuntu 20.04 服务器，并在您的服务器上启用防火墙。要进行设置，您可以按照我们针对 Ubuntu 20.04 的初始服务器设置指南进行操作。 第 1 步 – 安装 PHP 和其他依赖项 除了应该已经包含在 Ubuntu 20.04 系统中的依赖项（例如git和 ）之外curl，Composer 还需要php-cli在命令行中执行 PHP 脚本并unzip提取压缩档案。我们现在将安装这些依赖项。 首先，通过运行更新包管理器缓存： sudo apt update 接下来，运行以下命令来安装所需的包： sudo apt install php-cli unzip 系统将提示您输入Y，然后输入确认安装ENTER。 安装先决条件后，您可以继续安装 Composer。 步骤 2 — 下载和安装 Composer ..
介绍 长期以来，仅使用 CSS 无法选择父元素，但是伪类:focus-within稍微改变了这个故事。它允许在元素具有焦点时对其进行样式设置，而且在其任何内部元素（后代）具有焦点时也可以进行样式设置。一个主要的例子是一个表单，当用户关注输入元素之一时，您希望容器元素以某种方式设置样式。 HTML 和 CSS 代码 这是在表单中使用:focus-within的示例。让我们从这个标记开始： <form tabindex=”0″ class=”myForm”> <h3>What’s your favorite color?</h3> <input type=”text”> </form> 我们的 CSS 规则如下： .myForm:focus-within { background: #f8f8f8 repeating-linear-gradient( 45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.5) 35px, rgba(255, 255, 255, 0.5) 70px ); } .myForm:focus-within::before { content: “I’m a happy selected form!”; color: rgb(239, 187, 53); ..
介绍 WordPress 是一个强大的内容管理平台，目前支持超过 36% 的网络。借助多站点功能，WordPress 管理员可以使用单个 WordPress 安装在其仪表板内在一台服务器上创建多个站点。 在本快速入门中，了解如何使用多站点功能设置存在于一台服务器或 WordPress Droplet 上的多个 WordPress 站点实例。如果您希望更深入地了解 WordPress 多站点设置，请参阅如何在 Ubuntu 20.04 上使用 Nginx 和 LEMP 设置WordPress 多站点。 先决条件 本教程中的步骤要求用户具有sudo权限。按照我们的Ubuntu 20.04 初始服务器设置创建一个具有sudo特权的管理系统用户。 在使用 WordPress 之前，您需要将其安装在您的虚拟专用服务器上。本快速入门使用安装了 LAMP 堆栈的 Ubuntu 20.04 Droplet，用户具有 root 权限。您可以按照本教程进行其他安装，但请记住，步骤可能因您的安装而异。 如果您选择以与本教程类似的方式安装 WordPress，请务必在第 5 步结束时停止以继续本教程的第 1 步。 第 1 步 – 配置您的 WordPress 安装 安装 WordPress 后，我们需要在各种配置文件中执行一系列步骤。 首先，让我们修改 ..
介绍 HTML5 引入了可以访问设备硬件的API ，包括MediaDevices API。此 API 提供对音频和视频等媒体输入设备的访问。 在此 API 的帮助下，开发人员可以访问音频和视频设备以在浏览器中流式传输和显示实时视频源。在本教程中，您将从用户的设备访问视频源，并使用getUserMedia方法将其显示在浏览器中。 该getUserMediaAPI使得使用介质的输入设备来产生MediaStream。此 MediaStream 包含请求的媒体类型，无论是音频还是视频。使用 API 返回的流，可以在浏览器上显示视频源，这对于浏览器上的实时通信很有用。 当与MediaStream Recording API一起使用时，您可以记录和存储在浏览器上捕获的媒体数据。此 API 仅适用于其他新引入的 API 一样的安全来源，但它也适用于localhost和文件 URL。 先决条件 JavaScript 的基本知识。如果您不熟悉 JavaScript，请尝试查看如何在 JavaScript 中编码系列。 本教程将首先解释概念并使用Codepen演示示例。在最后一步，您将为浏览器创建一个正常运行的视频源。 步骤 1 — 检查设备支持 首先，您将看到如何检查用户的浏览器是否支持该mediaDevicesAPI。此 API 存在于导航器界面中，包含用户代理的当前状态和身份。使用以下可以粘贴到 Codepen 中的代码执行检查： if (‘mediaDevices’ in navigator && ‘getUserMedia’ in navigator.mediaDevices) { console.log(“Let’s get this party started”) } 首先，如果这个检查mediaDevices的API中存在navigator，然后检查该getUserMediaAPI是内可用mediaDevices。如果返回true，您就可以开始了。 ..
介绍 假设您正在使用 API 端点来创建新用户。用户数据诸如firstname，lastname，age，和birthdate-将会需要被包括在请求中。age当您期望数字值时，用户错误地输入他们的姓名作为字段的值是不可取的。birthdate当您期望特定日期格式时，用户在该字段中输入他们的生日也是不可取的。您不希望不良数据通过您的应用程序。您可以使用数据验证来解决这个问题。 如果您在构建 Node 应用程序时使用过ORM（对象关系映射） ——例如 Sequelize、Knex、Mongoose（用于 MongoDB）——您就会知道可以为模型模式设置验证约束。这使得在将数据持久化到数据库之前，更容易在应用程序级别处理和验证数据。在构建 API 时，数据通常来自对某些端点的 HTTP 请求，并且可能很快就会出现能够在请求级别验证数据的需求。 在本教程中，您将了解我们如何使用Joi验证模块在请求级别验证数据。您可以通过查看API 参考了解有关如何使用 Joi 和支持的模式类型的更多信息。 在本教程结束时，您应该能够执行以下操作： 为请求数据参数创建验证架构 处理验证错误并提供适当的反馈 创建一个中间件来拦截和验证请求 先决条件 要完成本教程，您需要： Node.js 的本地开发环境。遵循如何安装 Node.js 并创建本地开发环境。 建议下载并安装Postman 之类的工具来测试 API 端点。 本教程已通过 Node v14.2.0、npmv6.14.5 和joiv13.0.2 验证。 步骤 1 — 设置项目 在本教程中，您将假设您正在构建一个学校门户并且想要创建 API 端点： /people: 添加新的学生和老师 /auth/edit: 为教师设置登录凭据 /fees/pay: 为学生支付费用 您将使用Express为本教程创建 REST API以测试您的 Joi 模式。 ..
介绍 WordPress是世界上使用最广泛的内容管理系统 (CMS)之一，占网络的 33% 以上，并为技术和非技术用户提供了一种构建和成长的方式。然而，随着 WordPress 站点的扩展，管理大量数据和资产有时会出现可能影响最终用户加载时间的延迟错误。 在本教程中，了解如何安装Spaces，这是一种与 S3 兼容的对象存储服务，可让您存储和提供大量数据，以优化 WordPress 站点的速度和性能。 先决条件 为了完成本教程，您需要一个DigitalOcean 帐户，最好在 Ubuntu 20.04 上安装 WordPress。您的 WordPress 安装有许多不同的起点，包括： 在 Ubuntu 20.04 上提供 WordPress的托管解决方案 在 Droplet 上手动安装 一个一键式应用解决方案在Ubuntu 20.04提供的WordPress 无论您选择哪种方式，本教程都将假设您拥有 DigitalOcean 帐户和 WordPress 安装，并在 Ubuntu 20.04 上使用管理用户进行配置。 创造空间 在您的 DigitalOcean 控制面板中，单击左侧边栏中的Spaces按钮： 如果您没有创建预先存在的空间，您将看到一个按钮，提示您创建空间。您可以单击该按钮并继续操作。如果您有现有的 Spaces 安装，您将看到现有 Spaces 的列表。在这种情况下，您可以使用Create屏幕右上角的按钮创建一个新空间并按照本教程的其余部分进行操作。 接下来，您将做出一系列选择来自定义您的空间。让我们回顾一下您的 WordPress 安装的每个选择。 选择数据中心区域 选择离您的客户一般位置最近的数据中心区域。 启用 CDN ..
介绍 角的@angular/forms包带有一个Validators类，支持有益的内置的验证喜欢required，minLength，maxLength，和pattern。但是，可能存在需要更复杂或自定义规则进行验证的表单字段。在这些情况下，您可以使用自定义验证器。 在 Angular 中使用响应式表单时，您可以使用函数定义自定义验证器。如果验证器不需要重复使用，它可以作为一个函数直接存在于组件文件中。否则，如果验证器需要在其他组件中重用，它可以存在于单独的文件中。 在本教程中，您将构建一个带有可重用自定义验证器的反应式表单，以检查 URL 是否满足特定条件。 先决条件 要完成本教程，您需要： Node.js 安装在本地，您可以按照如何安装 Node.js 和创建本地开发环境来完成。 对设置 Angular 项目有一定的了解。 本教程已通过 Node v15.2.1、npmv6.14.8、@angular/corev11.0.0 和@angular/formsv11.0.0 验证。 步骤 1 – 设置项目 出于本教程的目的，您将从使用@angular/cli. npx @angular/cli new angular-reactive-forms-custom-validtor-example –style=css –routing=false –skip-tests 这将配置一个新的 Angular 项目，其样式设置为“CSS”（与“Sass”、Less 或“Stylus”相反），没有路由，并跳过测试。 导航到新创建的项目目录： cd angular-reactive-forms-custom-validator-example 要使用反应式表单，您将使用ReactiveFormsModule代替FormsModule。 app.module.ts在您的代码编辑器中打开并添加ReactiveFormsModule： src/app/app.module.ts import { BrowserModule } from ‘@angular/platform-browser’; import { NgModule } from ..
该系列的一部分： 如何使用 CSS 构建网站 本教程是使用 CSS创建和自定义此网站的系列的一部分，CSS 是一种用于控制网站呈现的样式表语言。您可以按照整个系列重新创建演示网站并熟悉 CSS 或将此处描述的方法用于其他 CSS 网站项目。 在继续之前，我们建议您了解一些 HTML 知识，HTML 是用于在 Web 浏览器中显示文档的标准标记语言。如果您不熟悉 HTML，可以在开始本系列之前先阅读我们如何使用 HTML 构建网站系列的前十个教程。 介绍 在本教程中，您将使用 CSS 向您的网站添加特色引语，如演示网站的第六部分所示。您可以使用此部分来展示最喜欢的名言、关于您的工作的见证或给您的网站访问者的信息。如果您愿意，您也可以将此报价超链接到另一个网页。您在此处使用的方法可以应用于其他 CSS/HTML 网站项目。 先决条件 要遵循本教程，请确保您已按照本系列如何设置 CSS 和 HTML 练习项目中的上一个教程中的说明设置必要的文件和文件夹。 为特色报价部分创建样式规则 要创建特色引述部分，您将创建一个类来设置容器的样式和一个类来设置特色文本的样式。在您的styles.css文件中，添加以下代码片段： 样式文件 . . . /* Section 6: Featured Quote */ .column-quote { width: 90%; height: 475px; padding: 40px; padding-left:70px; padding-right: 70px; ..
该系列的一部分： 如何使用 CSS 构建网站 本教程是使用 CSS创建和自定义此网站的系列的一部分，CSS 是一种用于控制网站呈现的样式表语言。您可以按照整个系列重新创建演示网站并熟悉 CSS 或将此处描述的方法用于其他 CSS 网站项目。 在继续之前，我们建议您了解一些 HTML 知识，HTML 是用于在 Web 浏览器中显示文档的标准标记语言。如果您不熟悉 HTML，可以在开始本系列之前先阅读我们如何使用 HTML 构建网站系列的前十个教程。 介绍 在本教程中，您将学习如何理解和创建用于样式化和控制 HTML 内容布局的CSS 规则（也称为规则集）。<h1>在解释 CSS 规则的每个组件之前，本教程将从一个示例 CSS 规则开始，该规则将HTML 元素设为蓝色，以研究 CSS 规则的工作原理。 先决条件 要遵循本教程，请确保您已按照上一教程如何设置 CSS 和 HTML 练习项目 中的说明设置必要的文件和文件夹。 探索示例 CSS 规则 下面是一个 CSS 规则的例子。将以下规则写入您的styles.css文件： 样式文件 h1 { color: blue; } 保存您的styles.css文件。请注意，您已color: blue向右缩进两个空格。这种缩进是编写 CSS 样式规则的推荐最佳实践，因为它使开发人员更容易阅读代码。 ..