We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
你决定学习框架x,你打开youtube或任何搜索引擎,搜索与x框架相关的任何教程,并在30分钟之后突然发出"Eureka"(高兴地表现)的尖叫--我认为这个框架类似自己之前学过的框架。你是对的,你不必要从头开始学习它。在这篇文章中,我将向你展示我学习前端框架的经验以及这些框架如何彼此相似的。
x
每次你决定学习前端框架时,你定会反复听到这些术语(组件,路由和管理状态/状态管理)。
下面我们逐步了解下:
任何框架的核心都是以创建组件来达到复用的目的。如今,大多数现代框架都使用JSX或HTML模版引擎,生命周期钩子--提供生命瞬间可见性,比如创建,渲染,注销以及它们发生时的行为能力。
JSX
HTML
如今,大多数现代框架都提供API来创建和管理客户端路由。
API
有时,你的数据必须在组件之间共享,推荐的方法是使其成为中心(中转站)。
现在,所有框架都提供API来管理你的状态(例如Angular有一个Service,React现在有Context API)以及当你的数据规模变大之后,你可以考虑使用像redux这样的库。
完成基础学习之后,我们来亲自动手并创建项目。
为了理解事物的某些方面,你需要很好地了解它,这些知识(获取)不是仅仅来自阅读书籍或者观看视频课程。在这篇文章中,真实的测试伴随着现实中的真正问题,会带给你些启发,并应用在你选择的任何前端框架的项目中。
笔记:
常用的首个应用是使用其公共的API来模仿任何已知站点,尝试构建一个带下拉列表的搜索栏,来保存来自端点API的结果,检查其返回的数据,然后再显示它,就像有张图像一样(显示)或不显示。
端点API示例:
你将学到:
HTTP客户端
我在上一节中提到的一些端点API(可能)需要一些身份验证,因此在这一节中尝试添加或构建另一个带有登陆/注册页面的应用程序。如果用户登陆了,则将他/她重定向到用户主页,并阻止访客用户访问(主页),因为这需要用户登陆的。
登陆/注册
访客用户
增删查改的应用程序是本节中最受欢迎的前端应用程序,你可以使用本地存储或者使用在线服务(如Firebase)来构建此应用程序,甚至将它与后端框架集成在一起。
项目实例:
put、delete、post和get
auth
在前面的章节中,对后端的所有请求都是单向的,你在管理应用程序状态时没有问题。但在本节中,我们尝试使用web sockets来构建聊天应用程序,它是双向的,我们不能(总是)等待响应来更新视图,我们需要另一种方法来管理我们的客户端状态。
web sockets
学习如何使用管理状态解决方案,如redux for react, ngrx for angular 2+ 或 vuex for vuejs以及如何将其与客户端应用程序集成
管理状态
redux for react, ngrx for angular 2+ 或 vuex for vuejs
使你的应用更灵活(接收网络状态并通知用户新消息)
原文:https://dev.to/imm9o/how-i-learn-any-front-end-framework-29a2
The text was updated successfully, but these errors were encountered:
No branches or pull requests
你决定学习框架
x
,你打开youtube或任何搜索引擎,搜索与x
框架相关的任何教程,并在30分钟之后突然发出"Eureka"(高兴地表现)的尖叫--我认为这个框架类似自己之前学过的框架。你是对的,你不必要从头开始学习它。在这篇文章中,我将向你展示我学习前端框架的经验以及这些框架如何彼此相似的。每次你决定学习前端框架时,你定会反复听到这些术语(组件,路由和管理状态/状态管理)。
下面我们逐步了解下:
组件
任何框架的核心都是以创建组件来达到复用的目的。如今,大多数现代框架都使用
JSX
或HTML
模版引擎,生命周期钩子--提供生命瞬间可见性,比如创建,渲染,注销以及它们发生时的行为能力。路由
如今,大多数现代框架都提供
API
来创建和管理客户端路由。管理状态
有时,你的数据必须在组件之间共享,推荐的方法是使其成为中心(中转站)。
现在,所有框架都提供
API
来管理你的状态(例如Angular有一个Service,React现在有Context API)以及当你的数据规模变大之后,你可以考虑使用像redux这样的库。完成基础学习之后,我们来亲自动手并创建项目。
创建项目
为了理解事物的某些方面,你需要很好地了解它,这些知识(获取)不是仅仅来自阅读书籍或者观看视频课程。在这篇文章中,真实的测试伴随着现实中的真正问题,会带给你些启发,并应用在你选择的任何前端框架的项目中。
笔记:
1.查找 & 显示 (模仿)
常用的首个应用是使用其公共的
API
来模仿任何已知站点,尝试构建一个带下拉列表的搜索栏,来保存来自端点API
的结果,检查其返回的数据,然后再显示它,就像有张图像一样(显示)或不显示。端点API示例:
你将学到:
HTTP客户端
向端点API
发起请求API
获取结果数据2.Auth App
我在上一节中提到的一些端点
API
(可能)需要一些身份验证,因此在这一节中尝试添加或构建另一个带有登陆/注册
页面的应用程序。如果用户登陆了,则将他/她重定向到用户主页,并阻止访客用户
访问(主页),因为这需要用户登陆的。你将学到:
3.CRUD App
增删查改的应用程序是本节中最受欢迎的前端应用程序,你可以使用本地存储或者使用在线服务(如Firebase)来构建此应用程序,甚至将它与后端框架集成在一起。
项目实例:
你将学到:
put、delete、post和get
的HTTP请求auth
功能4.聊天应用
在前面的章节中,对后端的所有请求都是单向的,你在管理应用程序状态时没有问题。但在本节中,我们尝试使用
web sockets
来构建聊天应用程序,它是双向的,我们不能(总是)等待响应来更新视图,我们需要另一种方法来管理我们的客户端状态。你将学到:
学习如何使用
管理状态
解决方案,如redux for react, ngrx for angular 2+ 或 vuex for vuejs
以及如何将其与客户端应用程序集成使你的应用更灵活(接收网络状态并通知用户新消息)
The text was updated successfully, but these errors were encountered: