8个教育项目

“大师犯的错误比初学者尝试的还多”

我们提供 8 个项目选项，可以“为了好玩”来完成这些项目，以获得真正的开发经验。

项目 1. Trello 克隆

来自 Indrek Lasn 的 Trello 克隆。

你将学到什么：

• 请求处理路由的组织（Routing）。
• 拖放。
• 如何创建新对象（板、列表、卡片）。
• 处理和检查输入数据。
• 从客户端：如何使用本地存储、如何将数据保存到本地存储、如何从本地存储读取数据。
• 从服务器端：如何使用数据库、如何在数据库中保存数据、如何从数据库中读取数据。

这是存储库的示例，用 React+Redux 制作。

项目2.管理面板

Github 存储库。

一个简单的 CRUD 应用程序，非常适合学习基础知识。 让我们来学习：

• 创建用户、管理用户。
• 与数据库交互——创建、读取、编辑、删除用户。
• 验证输入并使用表单。

项目 3. 加密货币追踪器（原生移动应用程序）

Github存储库。

任何东西：Swift、Objective-C、React Native、Java、Kotlin。

来学习吧：

• 本机应用程序如何工作。
• 如何从 API 检索数据。
• 本机页面布局如何工作。
• 如何使用移动模拟器。

试试这个API。 如果您发现更好的东西，请写在评论中。

如果你有兴趣，这里是 这是一个教程.

项目 4. 从头开始​​设置您自己的 webpack 配置

从技术上讲，这不是一个应用程序，但从内部了解 webpack 的工作原理是一项非常有用的任务。 现在它不再是一个“黑匣子”，而是一个可以理解的工具。

要求：

• 将 es7 编译为 es5（基础）。
• 将 jsx 编译为 js - 或 - .vue 编译为 .js （你必须学习加载器）
• 设置 webpack 开发服务器和热模块重载。 （vue-cli 和 create-react-app 都使用）
• 使用 Heroku、now.sh 或 Github，学习如何部署 webpack 项目。
• 设置您最喜欢的预处理器来编译 css - scss、less、stylus。
• 了解如何通过 webpack 使用图像和 svgs。

对于完全的初学者来说，这是一个很棒的资源。

项目 5. Hackernews 克隆

每个绝地武士都必须制作自己的黑客新闻。

在此过程中您将学到什么：

• 如何与 hackernews API 交互。
• 如何创建单页应用程序。
• 如何实现查看评论、个人评论、个人资料等功能。
• 请求处理路由的组织（Routing）。

项目 6. Tudushechka

TodoMVC。

严重地？ 图杜什卡？ 有数千个。 但请相信我，这种受欢迎是有原因的。
Tudu 应用程序是确保您了解基础知识的好方法。 尝试用普通 Javascript 编写一个应用程序，并用您最喜欢的框架编写一个应用程序。

学习：

• 创建新任务。
• 检查字段是否已填写。
• 过滤任务（已完成、活动、全部）。 使用 filter и reduce.
• 了解 JavaScript 的基础知识。

项目 7. 可排序的拖放列表

Github存储库。

非常有助于理解 拖放 API.

让我们来学习：

• 拖放API
• 创建丰富的 UI

项目 8. Messenger 克隆（本机应用程序）

您将了解 Web 应用程序和本机应用程序的工作原理，这将使您从灰色人群中脱颖而出。

我们将研究什么：

• Web 套接字（即时消息）
• 本机应用程序如何工作。
• 模板如何在本机应用程序中工作。
• 在本机应用程序中组织请求处理路由。

这足够你用一两个月了。

翻译是在公司的支持下进行的 爱迪生软件谁是专业人士 使用 PHP 开发应用程序和网站 对于大客户，以及 使用 Java 开发云服务和移动应用程序.

来源： habr.com