“我想做一个应用，即使不是工程师也能实现！”带着这样的想法，笔者尝试利用生成AI进行自制应用开发（即“AI辅助编码”），但很快遇到了“发布难题”。
为此，笔者向日本国家GMO互联网集团的现役工程师石丸智辉请教。在克服了各种技术难题后，前端开发逐步完善，Google AI Studio上的开发工作完成，应用正式命名为“AiLA”。
随后，笔者准备了开发所需的Visual Studio Code和应用基础平台Firebase，开始搭建AI编码助手“Claude Code”。在本地电脑环境中启动应用，完成了看似简单但至关重要的开发基础工作，同时学习了如何安全管理API密钥，避免直接在聊天中粘贴导致泄露风险。
这是一段业余者与专业人士携手合作，真实且充满挑战的开发纪录……
在上一次中，我们完成了在Visual Studio Code（简称VS Code）中安装AI编码助手“Claude Code”，并学习了API密钥的安全管理方法，成功在本地环境启动了应用。
本次将学习使用“Git”进行源码变更的记录与保存，并引入在本地模拟Firebase后端功能的“Firebase模拟器”。接着，将通过AI助手实现登录功能、数据库保存及图片存储等核心功能。
在正式开始之前，先了解相关的最新动态。本系列采用Google AI Studio构建前端，通过GitHub将代码同步至VS Code和Claude Code继续开发。值得注意的是，开发工具持续进化。
2026年3月19日，日本国家Google宣布将Firebase集成到Google AI Studio的构建模式中，用户可通过提示语一站式构建并部署包含认证、数据库和存储的全栈应用。未来，手动配置Firebase的步骤或将被自动化，大幅简化开发流程。
本系列仍将基于已搭建的VS Code+Claude Code环境继续开发。该组合支持在同一界面同时操作代码和AI聊天，极大方便非专业者进行AI辅助编码。虽然新功能值得期待，但当前首要任务是夯实基础。
使用Git保存源码并备份到GitHub
首先学习Git操作。源码已在前几期上传至GitHub，但本地文件已有改动。石丸指出，工程师通常会在功能完成或有意义的修改后提交（commit）代码，并推送（push）到GitHub，类似游戏中的存档点，方便回滚。
“Git操作有多种方式，但本次AI辅助编码，交给Claude Code即可。只需在聊天框说明想进行Git操作，Claude会自动理解并执行。”
输入“我想进行Git操作，请教我方法”，Claude Code会给出操作选项。主要学习两项：commit（本地保存修改）和push（上传至GitHub）。
指令“请提交所有更改”后，Claude Code自动生成Git命令并请求确认。确认后完成提交。
不过，自动生成的提交信息多为英文，为便于理解，笔者指示Claude用日语编写提交信息。为防止以后仍自动生成英文，按照石丸建议，在“CLAUDE.md”文件中添加规则，明确要求所有提交信息均用日语。
“CLAUDE.md是Claude启动聊天时首先读取的文件，写入开发规则后，Claude会遵守这些规则进行开发。”
随后指示“请推送代码”，打开GitHub页面即可看到带有日语提交信息的变更记录，新增代码行以绿色高亮显示，方便追踪修改。虽然AI辅助编码中不常细读源码，但有完整的变更记录令人安心。
在本地电脑完整模拟Firebase开发环境
完成Git操作后，进入正式开发阶段。首先安装“Firebase模拟器”。
此前已在云端配置Firebase认证和数据库，但每次开发都连接云端效率低且存在风险。Firebase模拟器能在本地完整复现认证、数据库和存储等服务器功能，方便安全开发。
“本地开发时不连接外部云服务，而是在电脑上模拟后端功能进行验证，是常见做法。能避免不完整代码影响外部环境。”
指示Claude Code“安装Firebase模拟器并在本地搭建认证、数据库和存储开发环境”，随后自动执行安装Node.js、Java等必要软件及生成配置文件等复杂操作。
石丸表示，以往需逐条阅读文档并手动执行命令，遇到问题可能耗时半天。如今一句话指令即可完成，充分体现AI辅助编码的强大。
通过AI快速实现登录、数据保存等功能
接下来在模拟器上实现登录功能。
指令“请在Firebase模拟器上实现登录功能”，Claude Code迅速编写代码，屏幕上不断显示命令行输出。多次请求确认，均按石丸指示选择“是”。
完成后，Claude给出启动应用的两条命令：启动Firebase模拟器和启动应用本体。将两条命令一次性交给Claude处理，节省了逐行输入的麻烦。
打开浏览器，新增登录界面出现。此次实现了基于邮箱和密码的登录，正式版将采用Google登录。
在另一浏览器用不同账号登录成功，显示了另一个账号的威士忌数据，但尚未实现用户访问控制。
随后指令“请实现威士忌日志数据的数据库保存和读取功能”，Claude Code再次完成任务。
按照石丸指示测试，上传威士忌图片并保存，换浏览器登录同一账号，数据正确显示，确认数据确实存储在Firebase数据库中。
添加图片存储功能，完善应用基础功能
虽然数据库保存成功，但图片存储还需额外步骤。
石丸解释，文字和数值数据存储在数据库，图片文件则存储在独立的存储系统中。指令“请在Firebase模拟器上实现图片存储功能”，Claude Code继续开发。
遇到图片文件大小超出模拟器限制的错误，无法复制错误信息，只能截图上传给Claude。AI自动帮忙实现图片压缩功能，顺利解决问题。
最终测试上传图片，浏览器显示正常，包括缩略图。登录、数据库保存、图片存储三大基础功能齐备，应用雏形完成。
勇于向AI提问，解决开发难题
本次开发中，笔者仅需在Claude Code聊天框用日语下达指令，确认后点击“是”，便完成了Git操作、环境搭建、登录、数据库和图片存储等复杂任务，耗时约一小时。
但若问非专业者能否独立完成，答案仍是否定。因为“使用Firebase模拟器”的思路本身难以想到，遇到错误时也不知如何描述给AI。石丸建议：
“只要将应用设计详细告诉生成AI并形成文档，AI就能建议如何搭建环境，甚至推荐Firebase等方案。正因为进入了不易的领域，遇到不懂的地方要积极向AI提问。”
此外，Claude Code本身通过订阅账户免费使用，但因前期使用频繁，达到限制，改用付费API。此次约一小时会话花费5.5美元（约900日元）。虽价格因人而异，但考虑到完成了笔者无法独立完成的设置，性价比仍然不错。
下一期将聚焦用户访问控制和界面设计优化，提升应用完整度。
（第7期未完待续）
作者简介：柳谷智宣
IT与商业领域资深撰稿人，拥有26年职业经验，涉猎数字设备、网络服务、消费品及企业产品。近年来专注于AI、SaaS和数字化转型领域。日常撰写大量稿件，已离不开生成AI的辅助。
