# kitchen

**Repository Path**: tangfangze/kitchen

## Basic Information

- **Project Name**: kitchen
- **Description**: 一个人气美食网站，美食爱好者的天堂，热门美食尽在爱厨网，集原创菜谱，健康养生秘籍、美食教学分享和交流于一体的互动类美食平台。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2023-01-29
- **Last Updated**: 2025-10-14

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 乐厨

## 项目介绍

一个人气美食网站，美食爱好者的天堂，热门美食尽在爱厨网，集原创菜谱，健康养生秘籍、美食教学分享和交流于一体的互动类美食平台。

## 项目功能

1、热门美食：汇集了全国各地热门美食，从吃货日常“家常菜”到全球各国 “各地美味”。

2、海量菜谱：包括家常菜谱、西餐菜谱、烘焙食谱、儿童菜谱等等。无论是菜名还是食材，都能通过搜索功能找到对应菜谱教程。

3、美食天堂：为喜爱美食的人提供了一个展现自己厨艺的舞台，也为吃喝发愁的新手提供了学习的课堂。

4、搜索功能：关键字高亮、热门搜索、搜索记录、不同的跳转内容、搜索内容分为推荐、食材和课程。

5、食材搭配：选择两种或以上食材推荐对应的菜谱。

6、界面简洁：界面精美简洁，小清新，图文并茂，并辅助视频教学，让你全身心贯注于美食的制作！


## 技术选型
| 技术栈 | 描述 | 官网 |
| --- | --- | --- |
| React | 构建页面的 JavaScript 框架 | https://react.docschina.org/ |
| axios | 基于 promise 的网络请求库   | https://axios-http.com   |
| antd-mobile| 轻量、可靠的移动端组件库 | https://antd-mobile.gitee.io/zh |
| Reaat-router | Vue.js 的官方路由 | https://reactrouter.com/en/main/start/tutorial |

## 编码规范

规范方式：严格遵守阿里编码规约。

命名统一：简介最大程度上达到了见名知意。

分包明确：层级分明可快速定位到代码位置。

注释完整：描述性高大量减少了开发人员的代码阅读工作量。

工具规范：使用统一jar包避免出现内容冲突。

代码整洁：可读性、维护性高。

依赖版本：所有依赖均使用当前最新可用版本以便新技术学习。

## 项目成果截图

### 首页

<div>
    <img src="./public/assets/imgs/首页.png" width="160" />
    <img src="./public/assets/imgs/首页2.png" width="160" />
    <img src="./public/assets/imgs/首页3.png" width="160" />
    <img src="./public/assets/imgs/首页4.png" width="160" />
</div>

### 新手入门

<div>
    <img src="./public/assets/imgs/新手入门.png" width="160" />
    <img src="./public/assets/imgs/新手入门2.png" width="160" />
    <img src="./public/assets/imgs/新手入门3.png" width="160" />
    <img src="./public/assets/imgs/新手入门4.png" width="160" />
</div>

### 场景菜谱

<div>
    <img src="./public/assets/imgs/场景菜谱.png" width="160" />
    <img src="./public/assets/imgs/场景菜谱2.png" width="160" />
    <img src="./public/assets/imgs/场景菜谱3.png" width="160" />
</div>

### 食材搭配

<div>
    <img src="./public/assets/imgs/食材搭配.png" width="160" />
    <img src="./public/assets/imgs/食材搭配3.png" width="160" />
    <img src="./public/assets/imgs/食材搭配4.png" width="160" />
    <img src="./public/assets/imgs/食材搭配5.png" width="160" />
    <img src="./public/assets/imgs/食材搭配6.png" width="160" />
</div>

### 菜谱分类

<div>
    <img src="./public/assets/imgs/菜谱分类.png" width="160" />
    <img src="./public/assets/imgs/菜谱分类2.png" width="160" />
    <img src="./public/assets/imgs/菜谱分类3.png" width="160" />
    <img src="./public/assets/imgs/菜谱分类4.png" width="160" />
    <img src="./public/assets/imgs/菜谱分类5.png" width="160" />
    <img src="./public/assets/imgs/菜谱分类6.png" width="160" />
    <img src="./public/assets/imgs/菜谱分类7.png" width="160" />
    <img src="./public/assets/imgs/菜谱分类8.png" width="160" />
    <img src="./public/assets/imgs/菜谱分类9.png" width="160" />
</div>

### IP视频

<div>
    <img src="./public/assets/imgs/ip视频.png" width="160" />
    <img src="./public/assets/imgs/ip视频2.png" width="160" />
    <img src="./public/assets/imgs/ip视频3.png" width="160" />
    <img src="./public/assets/imgs/ip视频4.png" width="160" />
    <img src="./public/assets/imgs/ip视频5.png" width="160" />
    <img src="./public/assets/imgs/ip视频6.png" width="160" />
    <img src="./public/assets/imgs/ip视频7.png" width="160" />
    <img src="./public/assets/imgs/ip视频8.png" width="160" />
    <img src="./public/assets/imgs/ip视频9.png" width="160" />
</div>

### 专题

<div>
    <img src="./public/assets/imgs/专题.png" width="160" />
    <img src="./public/assets/imgs/专题2.png" width="160" />
    <img src="./public/assets/imgs/专题3.png" width="160" />
    <img src="./public/assets/imgs/专题4.png" width="160" />
</div>

### 个人中心

<div>
    <img src="./public/assets/imgs/个人中心.png" width="160" />
    <img src="./public/assets/imgs/个人中心2.png" width="160" />
    <img src="./public/assets/imgs/菜篮子.png" width="160" />
    <img src="./public/assets/imgs/我的菜谱.png" width="160" />
    <img src="./public/assets/imgs/登录.png" width="160" />
</div>

### 搜索

<div>
    <img src="./public/assets/imgs/搜索.png" width="160" />
    <img src="./public/assets/imgs/搜索2.png" width="160" />
    <img src="./public/assets/imgs/搜索3.png" width="160" />
    <img src="./public/assets/imgs/搜索4.png" width="160" />
</div>