文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

我的妻子总问我她今天该穿什么，于是我用AI做了这样一款时尚应用

现在有很多方法来构建移动应用程序，比如使用像 PhoneGap 这样的 html5 框架，像 Ionic 和 Xamarin 这样的交叉开发框架，或者直接使用 Xcode。...不过，由于过去我是一个 iOS 开发人员，因此显然我的选择是 Xcode。 为了提供对 Postgres 衣服日记的访问，我使用 lambda 函数构建了一个公共 REST API。...faAi 架构图 我设法在一天内完成了应用程序和 REST API，包括设计应用程序启动屏幕和图标。...如下图所示，应用程序的界面非常直观：一个可滚动的垂直列表，显示按日期分组的 Yumi 的图像、天气（下雨，多云或晴天）图标、一天的温度等。我现在可以说系统已经开发完成了！...我拍到了尤米进出房子的照片，没有一个假阳性！我还在她的手机上安装了这个应用程序，这样她就可以开始使用它并给我反馈。 尽管取得了很好的成绩，但在下一阶段我还需要改进和补充一些东西。

83530
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    使用 Vanilla JavaScript 框架创建一个简单的天气应用

    本篇文章，我将和大家一起使用原生 JavaScript 创建一个简单的天气查询应用。...项目前的准备工作 1、申请天气查询API首先我们需要寻找一个天气查询的API，方便我们集成。...2、下载天气图标这个项目中，我们需要用天气图标直观的展示天气情况，这里我建议用SVG格式的图标，主要原因是矢量的形式，不失真，还有一个原因就是我们能根据自己的需要很方便的改变颜色。...下图是我在网络上找到的图标，喜欢的可以去这里下载：链接:https://pan.baidu.com/s/1XS5Ua5c5SgUPiTqK_iXw7w密码:041m 四、创建HTML结构 基本工作准备完后...第二个 section 区域用来展示已查询过的城市列表，默认的情况，这个区域是没有查询信息的，只有输入城市信息，成功调用天气API接口时，才能显示相关信息。

    2.3K30

    使用 Vanilla JavaScript 框架创建一个简单的天气应用

    本篇文章，我将和大家一起使用原生 JavaScript 创建一个简单的天气查询应用。...项目前的准备工作 1、申请天气查询API首先我们需要寻找一个天气查询的API，方便我们集成。...2、下载天气图标这个项目中，我们需要用天气图标直观的展示天气情况，这里我建议用SVG格式的图标，主要原因是矢量的形式，不失真，还有一个原因就是我们能根据自己的需要很方便的改变颜色。...下图是我在网络上找到的图标，喜欢的可以去这里下载：https://pan.baidu.com/s/1XS5Ua5c5SgUPiTqK_iXw7w 密码:041m ?...第二个 section 区域用来展示已查询过的城市列表，默认的情况，这个区域是没有查询信息的，只有输入城市信息，成功调用天气API接口时，才能显示相关信息。

    2.3K20

    超硬核 Web 前端学霸笔记，学完就去找工作！

    我可以使用 - 最新的浏览器支持表，用于支持台式机和移动 Web 浏览器上的前端 Web 技术。 HTML Dog - 简单明了。...关键帧 - 使用可视时间线编辑器创建基本或复杂的 CSS @keyframe 动画。 Animista - 玩准备好使用 CSS 动画的集合。 难以上网 - 面向完整初学者的友好 Web 开发教程。...Redux 构建 React 应用程序 - 高级 捆绑包 Webpack Webpack 入门 建立东西 几个项目构想 React-TodoMVC 引导 React 项目 建立天气应用 React +...OpenWeather - 来自 OpenWeatherMap 的简单，快速，免费的天气 API，您可以访问当前的天气数据，每小时，5 天和 16 天的天气预报。...NodeJS 实现《你画我猜》小游戏 使用 PHP 的 CodeIgnitier 框架编写新闻客户端 极大提高国人开发效率超实用的 VSCode 插件 我如何用前端技术得到 XXOO 网站的 VIP 我如何用最简单的前端技术揭示那些灰色产业背后的原理

    2.4K20

    用Click编写Python命令行工具

    你可能正在看上面的代码示例，在想“这些东西是什么意思？”这正是我在使用argparse遇到的一个问题：它不直观，很难阅读。...这就是为什么我爱上了click click正在解决与optparse和argparse相同的问题，但使用方法稍微不同。它使用装饰器的概念。这需要命令是可以使用装饰器包装的函数。...它提供当前天气以及特定位置的五天预报。 我们将从他们的API示例返回当前天气的位置。 在开始编写代码之前，我喜欢尝试使用API来更好地理解它是如何工作的。...我想你应该知道的一个工具是HTTPie，我们可以使用它来调用示例API并查看返回的结果。 你甚至可以尝试他们的在线终端来运行它，无需安装。...这使我们可以使用Python和Requests库创建一个简单的实现（为简单起见，我们将忽略错误处理和失败请求）。 ? 这个函数使用两个查询参数向天气API发出一个简单的请求。

    4K10

    必读~苹果iOS小组件Widget设计终极完全指南

    您可以从应用程序的设计及其图标中套用设计风格。使用熟悉的颜色和字体来帮助用户进行交互操作。丰富的图像，简单的外观或淡淡的颜色是增加个性的一些方法。...大小增加时，日历小部件会添加新元素 天气小部件会随着大小的增加而增加其显示的信息 随着大小的增加，天气小部件会通过添加更多内容来扩展。小部件背后的想法保持不变。...我认为使用内容样式会不错，效果图如下。 在这个组件中，我为它添加了一个新的“趋势”部分。就像我之前说的那样，这不是唯一的选择。有无数种方法，您应该选择最适合您的应用程序的设计。...一个中等的小部件显示了我当前正在学习的语言，可以点击其中任何一个圆环，直接进入挑战屏幕。 Duolingo小部件 请注意小部件中的“ 18h 20m ago”字样。...这是一个例子： 其实占位符设计非常方便，程序员使用Swift UI即可搞定，不需特别设计。 可以自定义的小部件 小部件还使用户对小部件显示的内容有一些偏好。例如，您可以在“天气”小部件中编辑位置。

    8.8K30

    【愚公系列】《循序渐进Vue.js 3.x前端开发实践》054-案例：天气预报应用

    app.component(key, component)：将每个图标组件注册为全局组件，这样在项目中的任何地方都可以使用这些图标，避免每次使用时都要单独导入。...1.7 总结 这段代码完成了以下几个任务： 创建了 Vue 应用实例。 注册了 Element Plus 的图标组件，让它们可以在整个应用中全局使用。...weatherData：保存从 API 获取的完整天气数据。 todayData：保存当天的天气数据。 plc：如果数据缺失时显示的默认文本（“暂无数据”）。...它利用了 Vue 3 的 Composition API 来组织组件的逻辑，并使用 Element Plus 组件库来构建 UI。关键功能包括： 获取天气数据并展示当天、实时和未来几天的天气。...使用 watch 监听城市变化，自动更新天气数据。 使用 axios 发送 API 请求并处理返回的数据。

    38700

    Flutter 开发多端天气预报App：一场奇妙的编程之旅

    在本篇博客中，我将带你踏上一场奇妙的编程之旅，使用Flutter框架开发一款支持多端的天气预报App。前言作为一名小白，你可能对Flutter框架还不够了解，那么让我简单地为你解释一下。...UI 设计对于第一版的 weather_app，浅浅的画了一个草图，把界面简单分成两个部分，上半部分是今日天气的一些信息，比如天气的logo（是晴天就显示太阳，多云就显示云朵，下雨就显示下雨的图标），温度...获取天气数据获取 API 及请求内容简易分析为了获取天气信息，我们可以使用一些开放的天气API。在这里，我们选择使用和风天气提供的免费API。...首先，你需要在其官网上注册一个账号，然后创建一个项目，便可以获得我们的免费 API。...有了API密钥后，我们查看一下文档，和风天气的 API 的请求使用如下：https://api.qweather.com/v7/weather/now?

    95411

    云原生之使用Docker部署homarr个人导航页

    1.2 homarr特点 ️ 通过广泛的拖放网格系统高度可定制 ✨与您喜爱的自托管应用程序无缝集成 简单快速的应用程序管理 - 不涉及 YAML 先进的机密管理系统，增强安全性 详细的文档和活跃的社区...立即搜索网络或支持的集成 使用内置状态系统监控您的应用程序 全面的内置图标选择器，包含 7000 多个图标 使用 Docker、unRAID 和 Synology 轻松部署 与任何主要的消费类硬件（...Docker Compose version v2.19.1 四、下载homarr镜像 在docker hub下载homarr镜像 ghcr.io/ajnart/homarr:latest 如果镜像拉取缓慢，可使用我仓库的...创建挂载目录 mkdir -p /data/homarr/configs && mkdir -p /data/homarr/icons 5.2 创建homarr容器 使用docker run快速创建homarr...ie=UTF-8&wd= 图片 7.4 修改天气 设置主页天气城市位置，选择北京，保存即可。 图片 我正在参与2023腾讯技术创作特训营第二期有奖征文，瓜分万元奖池和键盘手表

    2.8K63

    快速学习网络编程-了解Windows机制

    Windows 下的应用程序不断地重复这一过程，直至用户终止程序，用代码来描述实际上也就是一个消息处理过程的while循环语句。 1.3 基本概念： 1.3.1 窗口 这是我要说的第一个概念。...从用户的角度看，窗口就是显示在屏幕上的一个矩形区域，其外观独立于应用程序，事实上它就是生成该窗口的应用程序与用户间的直观接口；从应用程序的角度看，窗口是受其控制的一部分矩形屏幕区。...应用程序生成并控制与窗口有关的一切内容，包括窗口的大小、风格、位置以及窗口内显示的内容等。用户打开一个应用程序后，程序将创建一个窗口，并在那里默默地等待用户的要求。...一旦双击了exe文件图标运行程序，那个“正在运行着的瑞星杀毒”便称为进程，它在双击的那一刻被系统创建，当你关机或者在任务栏的图标上单击鼠标右键选“退出”时，进程便消亡，彻底结束了生命。...从结构上看，句柄的确是一个指针，尽管它没有指向用于存储某个对象的内存位置，在编程时，只要抓住了对象的句柄就可以对该对象进行操作了. 1.3.8 API与SDK API是英文 Application Programming

    65630

    老婆问「我今天穿什么合适」？让AI来帮你想答案吧

    使用 AWS Rekognition 的人脸识别很简单直接。只需要创建一个我想要系统识别的人脸的集合即可。对于每张人脸（我和 Yumi 的），我需要调用 IndexFace 以将它们添加到该集合中。...这个过程非常简单，我都惊呆了。传统上，你需要花费大部分开发时间来处理基础设施和部署，比如编写 REST 应用程序框架、URL 路由、部署脚本等等，而不是写真正的 API 代码。...faAi 架构示意图 我成功在一天之内完成了应用和 REST API 的开发，包括设计应用程序启动屏幕和图标。这个应用的界面如下所示，很直观。...另外还有一个天气图标（雨、阴或晴），再点一下则会显示当天的温度。现在我可以说这个系统已经开发完成！作为一名见过世面的软件开发者，我知道下一步是 QA（质量保证）。 ? ?...faAi 应用程序 QA 我运行了这个系统一周时间，看起来能够正确工作。我拍到了 Yumi 进出门时的照片，而且没有一张是假正例！我也在她的手机上安装了应用，这样她就可以开始使用它并为我提供反馈了。

    79340

    从0开始构建一个Oauth2Server服务 授权范围 Scope

    例如，如果您在“customer”组中有一个用户，并且应用程序正在请求“admin”范围，则 OAuth 服务器不会创建具有“admin”范围的访问令牌，因为不允许该用户自己使用该范围。...如果响应在范围列表中不包含“人口统计”，端点将拒绝使用 HTTP 403 响应的请求。 用户界面 用户在授权应用程序时看到的界面需要清楚地显示应用程序正在请求的范围列表。...Flickr 授权界面显示了用户在我登录时授予应用程序的三件事，并清楚地显示了应用程序不会拥有的权限。显示这一点的好处是用户可以放心，他们授权的应用程序将无法执行潜在的破坏性操作。...每个请求的范围在页面上都有一个部分，其中包含名称、图标、突出显示这是只读还是读写的简短描述，以及用于查看更详细说明的下拉列表。...他们的授权界面在列表中显示每个范围，并包含一个“信息”图标，您可以单击该图标以获取有关特定范围的更多信息范围。 单击信息图标会显示一个叠加层，详细描述此范围允许的内容。

    1.1K30

    Jenkins教程

    下图显示了多个构建管道的外观。 image 希望你已经理解了理论概念。现在，让我们来体验一下动手的乐趣。 我将在 Jenkins 创建一个新作业，这是一个 自由式项目 。...使用 Jenkins 创建一个构建 第 1 步： 在 Jenkins 界面主页中，选择 New Item 。 image 第 2 步： 输入名称并选择 Freestyle project 。...您会很快发现，创建新项目时有许多可用设置。在这个配置页面上，您还可以选择添加构建步骤来执行额外的操作，例如运行脚本。我将执行一个 shell 脚本。...您可以使用脚本来运行各种任务，例如服务器维护、版本控制、读取系统设置等。我将使用它来运行简单的脚本。 image 第 4 步： 保存项目，您将进入项目概述页面。...image 生成状态通过两种方式表示，一种是天气图标，另一种是彩色球。 天气图标特别有用，因为它可以在一张图像中显示多个版本的记录。 如上图所示，太阳代表着我的所有建造都是成功的。

    2.1K20

    开发一个微信小程序(4)：查询天气-获取某个城市的实时天气

    从这一篇开始介绍如何实现一个查询天气小程序 准备工作： 1、申请和风天气开发者账号，并创建一个 Web API 类型的应用 (要调用和风天气 api 获取天气，关于如何使用和风天气api需要自行查阅文档...，传送门：和风天气开发平台 https://dev.qweather.com/ 2、下载和风天气图标 (查询到天气时，前端展示对应天气图标，传送门：和风天气图标 https://icons.qweather.com...本篇来实现一个基础功能：在输入框中输入城市，点击查询，显示实时天气，如下 拆解一下步骤： 1、前端写一个输入框、一个按钮； 2、按钮绑定一个事件，当点击按钮触发查询请求，把输入框输入的参数传给后端，后端调用实时天气查询接口...查询按钮 打开 pages/weather/weather.wxml 定义一个输入框和一个按钮： 其中输入框绑定了一个名为 getInputValue 的方法，这个方法的作用是获取输入框内输入的值 按钮我是用...我提前下载好了和风天气图标，把它放到项目中，如下 因为天气查询接口的返回内容中包含天气图标代码，只需要引用即可 <!

    4.6K20

    JavaScript异步编程、DOM操作与事件处理

    这些特性在现代Web开发中至关重要，掌握它们将帮助你创建更加动态和响应式的Web应用程序。 在2025年，随着Web应用程序变得越来越复杂，异步编程、DOM操作和事件处理的重要性也日益凸显。...5.1 项目概述 我们将创建一个动态天气应用，该应用可以： 获取用户的地理位置（需要用户授权） 根据用户的地理位置显示当前天气信息 允许用户搜索其他城市的天气信息 显示未来几天的天气预报 根据天气状况显示不同的背景和图标... © 2025 动态天气应用 | 使用OpenWeatherMap API ...应用会请求获取你的地理位置，授权后将显示你所在位置的天气信息。 你可以在搜索框中输入其他城市名称来查询该城市的天气信息。 应用会显示当前天气信息和未来几天的天气预报。...这些特性在现代Web开发中至关重要，掌握它们将帮助你创建更加动态和响应式的Web应用程序。 在2025年，随着Web应用程序变得越来越复杂，异步编程、DOM操作和事件处理的重要性也日益凸显。

    21410

    手撸一个前端天气卡片

    开发过程中受到室友启发，尝试为天气图标增加了一些动画，不过有些喧宾夺主，最后不了了之。 3. normal样式和detail样式？ 开发前我其实仅仅计划做出两种样式（即small和medium）。...在写天气卡片前，我只使用过一次Web Components，那是在原神玩家信息查询中，当时是因为有很多重复的要素（角色信息），所以想尝试用这个新鲜玩意封装一下。...得到的教训就是：如果不用构建工具，又想要较为优雅地开发，template标签是必不可少的，否则维护代码简直要了我的老命。 2. 如何优雅地显示图标？...然而DW的天气图标并没有采用上述的两种方式。我对图标部分使用Web Components做了封装，已经是类似symbol的作用，因此再使用symbol便显得有些多此一举。...给我灵感的，是windows的资源管理器： 天气卡片的主体元素固定在左侧不动，右侧的数据展示根据卡片宽度显示滚动条，实现也非常简单，因为我使用的弹性布局，只要在原来的数据展示区域外边包装一层带有 flex-grow

    2.3K50

    Ai-artifacts：免费使用o1模型！还有Claude Artifacts 功能，几秒生成全栈APP（10+编程任务测试）

    非常完美，后续我还让他： “ 想要添加更复杂的功能控件，并将将对话框发送在底部 ” 太酷啦 ... 创建一个天气桌面应用程序，显示当前天气和未来几天的天气预报。...当然o1-mini生成的和claude有一点不同的是左边直接提供了天气应用程序api的接入框，总的来说这个任务下二者做的都不错。...gpt4-o效果很一般 这行忘删了：创建一实时天气应用程序，使用Vue.js显示当前天气数据。 使用Gradio开发一个AI代理应用程序，允许用户通过选择不同的任务与多个模型进行交互。...o1-preview，虽然创建出来了，但是和指令似乎并不那么相关 生成一个看起来很酷很现代的桌面天气应用，使用虚拟数据。 这个看起来还是不错的。...Build the Web App 一切准备好后，我们就可以开始使用了。只需运行 npm run 命令，它就会启动，转到它显示的本地端口。

    58310

    Flutter开发多端天气预报App：一场奇妙的编程之旅

    我比较习惯使用 IDEA，这需要你安装 Flutter 与 Dart 插件才能使用；这里我新建了一个 weather_app 的 flutter 项目，并勾选了所有的平台。...UI 设计 对于第一版的 weather_app，浅浅的画了一个草图，把界面简单分成两个部分，上半部分是今日天气的一些信息，比如天气的logo（是晴天就显示太阳，多云就显示云朵，下雨就显示下雨的图标），...获取天气数据 获取 API 及请求内容简易分析 为了获取天气信息，我们可以使用一些开放的天气API。在这里，我们选择使用和风天气提供的免费API。...首先，你需要在其官网上注册一个账号，然后创建一个项目，便可以获得我们的免费 API。...有了API密钥后，我们查看一下文档，和风天气的 API 的请求使用如下： https://api.qweather.com/v7/weather/now?

    65230
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券