Blog

从用户的个人资料图片到其他媒体资产，通过文件上传进行数据收集和存储到云服务已成为大多数现代应用程序的基本功能。在本文中，您将了解如何在 GraphQL 应用程序中实现文件上传。 通过利用React-Apollo，本文重点介绍如何将文件上传功能添加到由 GraphQL API 提供支持的新的或现有的前端应用程序中。为了实现这一目标，我们将构建这个演示应用程序，允许用户在创建帐户时上传个人资料图片以及他们的首选用户名。当我们这样做时，我们将逐步完成以下过程： 创建一个 Node GraphQL 后端应用程序，能够接受上传的文件并将其发送到 Google Cloud 中的存储桶。 设置与 Google 云存储的连接。 收集 React 应用程序中的文件输入，并使用 React Apollo 将它们发送到 GraphQL 后端应用程序。 注意：虽然所有代码片段都已解释 但要完全理解它们，您应该了解JavaScript 的 es6 语法、 GraphQL和React.js。 本文对于有兴趣或考虑在 React 和 Nodejs GraphQL 应用程序中使用 Google Cloud Storage 进行文件上传的开发人员来说将是有益的。虽然 新西兰手机号码列表 本文不是GraphQL 的介绍，但本文中使用的每个 GraphQL 概念都进行了解释和引用，以便更好地理解。 设置节点 GraphQL API # 我们将构建一个 […]

在本文中，我们将介绍如何结合机器学习、可变字体和 CSS 网格来创建响应用户脸部的接近度、倾斜度和数量的布局。 网页设计师一直在寻找新的方法来改进页面内容的呈现。有时，这可以带来巧妙的解决方案或与通常远离设计领域的技术进行交互。在本文中，我们将把排版与人工智能结合起来，利用机器学习来检测用户脸部的接近程度等，以提高文本的易读性。 我们将实验如何使用Tensorflow进行人脸识别，以便从摄像头提取一些信息，例如屏幕与用户脸部之间的距离或阅读页面的人数。然后，我们将这些数据传递给 CSS，以适应排版并调整页面布局。 什么是张量流？  是 的一个用于机器学习的开源平台。机器学习是计算机科学的一个领域，研究算法，学习如何识别图像、音轨、时间序列、自然文本和一般数据中的复杂关系和重复模式。 这些算法生成数学模型 也称为训练模型），这是一种可用于根据输入数据做出决策的模式。如果您想探讨这个主题，Charlie Gerard在 Smashing Mag 上撰写了有关前端 秘鲁手机号码列表  开发人员的 ML 的文章。 Tensorflow 为 AI 开发人员、数 秘鲁手机号码列  据科学家、数学家提供了大量工具，但如果数据分析不是您的日常面包，请不要惊慌！好消息是，您不必成为专家就可以使用它，只要您使用预先构建的模型即可，就像我们将要做的那样。 Tensorflow 模型可通过其JavaScript SDK在 Web 上使用。 设置 # 为了开始使用人脸识别算法，我们需要遵循以下几个步骤： 加载 Tensorflow SDK。 加载包含数学模型的 Facemesh 库。 访问用户的摄像头并将其流式传输到 HTML 视频元素。Facemesh 将分析视频标签中的帧以检测面部的存在。 在此项目中，我们将通过 CDN 使用 Tensorflow，但如果您更喜欢捆绑器方式，也可以在 NPM 上使用它：我们使用智能手机到处浏览网络。不久前，我们曾经乘坐拥挤的火车或公共汽车，因为没有空间，所以我们把智能手机放在离眼睛很近的地方 所以我们把智能手机放在离眼睛很近的地方 在此项目中，我们将通过 CDN […]

刚开始使用 Vue 的开发人员或有时具有 Vue 构建经验的开发人员有时不知道有一些工具可以使 Vue 中的开发变得更加容易。在本文中，我们将了解其中一些库、它们的用途以及如何在开发过程中使用它们。 在开发新项目时，根据应用程序的使用方式，某些功能是必需的。例如，如果您要存储特定于用户的数据，则需要处理身份验证，这将需要设置需要验证的表单。诸如身份验证和表单验证之类的事情很常见；有些解决方案可能适合您的用例。 为了正确利用您的开发时间，最好使用可用的时间，而不是发明自己的时间。 作为一名新开发人员，您可能不会了解 Vue 生态系统为您提供的所有内容。本文将对此有所帮助；它将涵盖某些有用的工具，帮助您构建更好的 Vue 应用程序。 注意：这些库还有其他选择，本文绝不会将这几个库放在其他库之上。 他们只是和我起工作过的人  本教程针对刚刚开始学习 Vue 或已经具备 Vue 基础知识的初学者。本教程中使用的所有代码 巴拉圭手机号码列表 片段都可以在我的 GitHub上找到。 Vue-通知 # 在用户交互过程中，经常需要向用户显示成功消息、错误消息或随机信息。在本节中，我们将了解如何使用 向用户显示消息和警告vue-notification。该包提供了一个带有漂亮动画/过渡的界面，用于在应用程序中向用户显示错误、一般信息和成功消息，并且不需要大量配置即可启动和运行。我们还需要验证密码字段并确保它包含所需的格式，但 Vuelidate 没有可以用来实现此目的的内置验证器。我们可以编写自己的自定义验证器，使用RegEx来执行此操作。这个自定义验证器看起来像这样；这对用户体验不利，因为用户尚未与表单交互，因此至少在用户尝试提交表单之前错误文本不应该可见。 为了解决这个问题，我们将添加 显示错误文本所需的条件，并在用户单击提交按钮时切换submittedto的值。在开发过程中，有时您会在 Vuex 存储中存储用户信息和令牌等数据。但是，如果您的用户尝试从浏览器刷新您的应用程序或从浏览器的 URL 选项卡输入新路径，并且应用程序的当前状态随之丢失，您的 Vuex 存储数据将不会保留。如果路线受到导航防护的 AERO 领先  保护，这会导致用户被重定向到登录页面，这对您的应用程序来说是异常行为。这可以用 修复vuex-persistedstate，让我们看看如何修复。在这里，我们检查以确保表格已完整填写且填写正确。如果它返回false，则意味着表单是有效的，我们可以处理表单中的数据，但如果是true，则意味着表单仍然无效，用户仍然需要注意表单中的一些错误。我们还可以根据您的喜好使用此属性来禁用提交按钮或设置提交按钮的样式。

这是。我认为我们在 2018 年首次宣布了第三版。我认为它是在春季宣布的，真正的工作开始于，我的意思是想法是在春季，真正的工作开始于 2018 年秋季。我认为它是在 2018 年 10 月举行的伦敦会议上正式宣布的。积极的工作花了两年时间。如果你想一想，这已经很多了，之前的版本是在 2016 年发布的。所以这四年的一半时间也致力于 Vue 3 工作。 德鲁：决定需要新的主要版本的动机因素是什么？这是一种有意识的决定，好吧，我们要开发一个主要版本，我们要开发 Vue 3，还是只是需要版本升级的变化累积？ 娜塔莉亚：不，我认为创建新版本的想法是由于一些非常重要的事情。所以首先，有改变反应性的动机。前一个是基于  构建的。它有一些警告，它们都已记录在案，但仍然如此。你知道，即使你记录了人们不应该做的事情，他们无论如何都会做。您需要向他们指出文档。顺便说一句，没有人阅读文档。由于某种原因，它就这样发生了。 直到你指出人们指出它并不存在于文档中 但好吧。无论如何我们都会教你。所以反应性是其中之一。 娜塔莉亚：接下来是性能。Vue 2 仍然具有并且还没有最差的性能，但我们有一些关于如何使 Vue 更快的想法。对于我们的某一部分（比如说观众，即使用 Vue 的人）来说，也存在一个痛点。这是 TypeScript。Vue 2 内部是用 Flow 编写的，Flow 仍然是强类型的，但使用 TypeScript 打字确实是一场噩梦，尤其是当您使用我们的状态管理 Vuex 时。这又是一个重要的部分。最后一个是，我们有点错过了抽象逻辑的功能，不是组件而是可组合的逻辑部分。类似于函数助  巴拿马手机号码列表 手等，但它们也应该能够包含查看者活动。React Hooks 就是一个很好的例子，它们允许你抽象部分功能，而这在 Vue 中显然是缺失的。我知道现在听起来就像是“你偷了 React 的功能”。事实上并非如此。我相信想法的交叉授粉是我们生态系统中一个重要而美好的部分，它也可以帮助开发人员在最喜欢的之间切换，对吗？ 娜塔莉亚：因此，我们正在研究这些主要功能，以创建 Vue 3 作为主要版本。 德鲁：现在我认为开源生态系统中存在的伟大之处之一是，有来自各种不同项目的丰富的想法和经验，并且能够借用这些想法并从其他项目中借用经验确实有益并且让一切变得更强大，不是吗？ […]