发布于 2026-01-06 9 阅读
0

如何使用原生 JavaScript 构建食谱应用

如何使用原生 JavaScript 构建食谱应用

在本视频中,我将向您展示如何使用 API 和 JavaScript 构建一个菜谱应用。我们将使用深色和浅色主题以及响应式设计,以便您的应用在任何设备上都能完美呈现。

如果你想学习如何使用 API 构建 Web 应用程序,那么这个视频就是为你准备的!我们将向你展示构建一个实际 Web 应用程序所需的一切知识。这是一份绝佳的 Web 开发和 API 使用入门指南,千万不要错过!

起始文件

⏱️ 时间戳
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
0:00 - 演示
14:02 - 文件结构
15:16 - 项目初始设置
35:10 - 首页 - 页眉
47:10 - 浅色和深色模式
52:35 - 移动端导航
59:17 - 首页 - 主图部分
1:06:58 - 首页 - 标签页部分
1:46:24 - 首页 - 轮播图部分
1:53:40 - 首页 - 标签部分
2:04:46 - 页脚
2:08:01 - 设置 API
2:15:19 - JavaScript - 标签页部分
2:40:34 - JavaScript - 滑块部分
2:51:17 - Snackbar
2:58:24 - 食谱页面
4:25:18 - 食谱页面 - Rander 食谱
4:40:48 - 详细信息页面
2:37:26 - 详细信息页面 - Randar 食谱详细信息
5:16:33 - 书签页面
5:26:31 - 媒体查询

文章来源:https://dev.to/codewithsadee/how-to-build-a-recipe-app-with-vanilla-javascript-1ogm