回忆杀!自制虚拟钢琴串烧童年经典动漫歌曲,你听过几首?

简介: 六一快乐 !大龄儿童如何正确过节?还只会卖萌 p 图抄文案?快来学会这个儿童节必杀技!!制作一个虚拟的网页版的钢琴,一边弹着琴一边和大家一起在耳熟能详的歌曲中回味童年的快乐,要做就做最酷最炫的才艺小天才~

截屏2020-06-01 上午11.57.53.png

开发工具介绍

image.png

云开发平台提供了一个云上的 IDE,也就是说你可以随时随地在任何的电脑上打开云开发平台来进行开发。在这个云开发平台上面进行的话的话大家和朋友协作起来也特别方便, 比如以往我们需要在本地进行的一些配置环境的工作现在统统都不需要了,直接在云端为团队里所有人配置环境即可。它还很好地整合了和 Serverless,也就是无服务器架构相关的解决方案,你不需要再去为你的应用创建 ECS 服务器,他的现有模板可以直接让你把写好的应用部署到函数计算中的函数里面去。

开发流程

image.png

这个钢琴的应用可以直接套用 Ali Midway FaaS 和 React 的一体化解决方案,这个 Midway FaaS 的方案可能大家听起来有些陌生,它其实是一个用于构建 Node.js 云函数的 Serverless 框架,非常易上手和部署。

这个 APP 前端采用 React 框架,钢琴的部分参考了屏幕上这位大神的一个项目,然后节奏的部分是把两个常用的节拍的音频文件摆在了对象存储的桶里面,然后后端就只需要一个 getAudio 的 API 来把相应的音频返回给前端就可以了。做好之后,我们直接在 IDE 里面点击部署它就会自动部署在阿里云上了,你甚至连 yaml 文件都不用写。

image.png

使用这个云开发平台另一个非常赞的点就是你在开发过中是不需要支付任何费用的,同时开发完成之后部署到函数计算服务当中,也只需要按量付费而不用去支付整个服务器的使用时间,所以说这个 Serverless 的架构对于个人或者是小型团队开发者来说特别实惠。

观看视频
https://www.bilibili.com/video/BV1P5411x77F?from=search&seid=3575955341459461352

相关实践学习
函数计算部署PuLID for FLUX人像写真实现智能换颜效果
只需一张图片,生成程序员专属写真!本次实验在函数计算中内置PuLID for FLUX,您可以通过函数计算+Serverless应用中心一键部署Flux模型,快速体验超写实图像生成的魅力。
从 0 入门函数计算
在函数计算的架构中,开发者只需要编写业务代码,并监控业务运行情况就可以了。这将开发者从繁重的运维工作中解放出来,将精力投入到更有意义的开发任务上。
相关文章
|
7天前
|
人工智能 数据可视化 安全
王炸组合!阿里云 OpenClaw X 飞书 CLI,开启 Agent 基建狂潮!(附带免费使用6个月服务器)
本文详解如何用阿里云Lighthouse一键部署OpenClaw,结合飞书CLI等工具,让AI真正“动手”——自动群发、生成科研日报、整理知识库。核心理念:未来软件应为AI而生,CLI即AI的“手脚”,实现高效、安全、可控的智能自动化。
34477 17
王炸组合!阿里云 OpenClaw X 飞书 CLI,开启 Agent 基建狂潮!(附带免费使用6个月服务器)
|
19天前
|
人工智能 JSON 机器人
让龙虾成为你的“公众号分身” | 阿里云服务器玩Openclaw
本文带你零成本玩转OpenClaw:学生认证白嫖6个月阿里云服务器,手把手配置飞书机器人、接入免费/高性价比AI模型(NVIDIA/通义),并打造微信公众号“全自动分身”——实时抓热榜、AI选题拆解、一键发布草稿,5分钟完成热点→文章全流程!
45307 142
让龙虾成为你的“公众号分身” | 阿里云服务器玩Openclaw
|
8天前
|
人工智能 JSON 监控
Claude Code 源码泄露:一份价值亿元的 AI 工程公开课
我以为顶级 AI 产品的护城河是模型。读完这 51.2 万行泄露的源码,我发现自己错了。
4872 21
|
1天前
|
人工智能 自然语言处理 安全
Claude Code 全攻略:命令大全 + 实战工作流(建议收藏)
本文介绍了Claude Code终端AI助手的使用指南,主要内容包括:1)常用命令如版本查看、项目启动和更新;2)三种工作模式切换及界面说明;3)核心功能指令速查表,包含初始化、压缩对话、清除历史等操作;4)详细解析了/init、/help、/clear、/compact、/memory等关键命令的使用场景和语法。文章通过丰富的界面截图和场景示例,帮助开发者快速掌握如何通过命令行和交互界面高效使用Claude Code进行项目开发,特别强调了CLAUDE.md文件作为项目知识库的核心作用。
1966 6
Claude Code 全攻略:命令大全 + 实战工作流(建议收藏)
|
7天前
|
人工智能 API 开发者
阿里云百炼 Coding Plan 售罄、Lite 停售、Pro 抢不到?最新解决方案
阿里云百炼Coding Plan Lite已停售,Pro版每日9:30限量抢购难度大。本文解析原因,并提供两大方案:①掌握技巧抢购Pro版;②直接使用百炼平台按量付费——新用户赠100万Tokens,支持Qwen3.5-Max等满血模型,灵活低成本。
1809 5
阿里云百炼 Coding Plan 售罄、Lite 停售、Pro 抢不到?最新解决方案