版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_34414916/article/details/85113777
Angular7入门辅助教程
1、Angular简介
Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angular 集声明式模板、依赖注入、端到端工具和一些最佳实践于一身,为你解决开发方面的各种挑战。Angular 为开发者提升构建 Web、手机或桌面应用的能力。(复制官网的),它是用typescript(ts)写成的一个前端框架,拥有面向对象的特点(这其实是typescript拥有的!)
2、Angular的中文官网
3、一些开发工具的官网
vscode(一款流行的IDE)官网:https://code.visualstudio.com/
Typescript(学习Angular的前提)中文官网:https://www.tslang.cn/docs/home.html
4、学习前提
- 拥有一定的Typescript基础,或者javascript的基础也行,但是最好是typescript,如果你不懂Typescript,请先学习Typescript(特别是其中的泛型,函数等),再来学习Angular,会达到事半功倍的效果!
5、适合人群
- 看了Angular官方文档但是有点疑惑的人群,可以来过一遍本教程
- 有Typescript基础,并且希望快速入门Angular的人群,也很适合本教程
6、编写原因以及本教程的特点
从博客的标题就可以看出,本教程是官方教程的辅助教程,因为官方教程很详细,知识点也分的很清楚,短时间很难做到快速了解Angular,所以本教程应运而生,它有两个特点:(1)、简洁明了,(2)、各Angular核心知识点联系较强,所以他不仅适合已经看过官方文档(对Angular有一定了解)的人群,还适合处于某种原因,想快速了解Angular的人群
7、参考文档
8、本教程的目标
这或许是读者所关心的,因为是官网的辅助教程,所以,还是以官网为主!现在你可以先导航到官网的快速入门教程,没错,本教程的目标就是毫无障碍的看懂这篇官方教程,注意,是毫无障碍的看懂哦!!所以,你可以先看看官方的那篇快速入门教程(也就是用Angular写的一个小项目),如果有障碍,那么这篇教程就很适合你!
9、本教程涉及到的Angular的核心知识点
(注意,下面的链接都会导航到官方文档,想做详细了解的可以点进去看下)
主要涉及
次要涉及(主要是官方文档已经足够简洁明了,没必要再写一遍)
10、环境准备
下面步骤是必须进行的!!
- Node.js/npm:下载并安装Node.js
- TypeScript:参考官方文档安装并使用TypeScript
- Angular:参考官方文档安装并使用Angular CLI
推荐使用vscode这款编辑器,如果你感兴趣,可以参考下面这篇博客(在这款IDE中使用Angular并不需要额外的配置)
vscode中使用TypeScript,以及vscode一些常用的快捷键
11、代理
你在使用npm或者vscode的时候,或许会遇到问题,这时候,你可以设置代理,步骤如下:
npm:
(在使用代理的时候,有时候可能需要认证)
npm config set proxy http://"认证账号:密码"@代理的域名:代理的端口/
npm config set https-proxy http://"认证账号:密码"@代理的域名:代理的端口/
npm config set registry http://registry.npmjs.org/
然后使用下面命令查看配置是否正确
npm config list
然后就可以使用npm下载自己需要的包了
vscode:vscode中使用TypeScript,以及vscode一些常用的快捷键,这篇博客中有设置代理的教程
12、章节结构
- 心法篇(章节的中心,重点中的重点,在开始章节前,你可能看不懂,但是请先过一遍,留个印象就好)
- 详细教程篇(围绕心法篇,通过具体的实例,解释心法篇)
- 问题篇(提出一个与本章节相关的问题,但是可能需要讲很多知识关联起来才能解答,所以你在看完本章节后可能还不知道答案。我会另外写一篇博客给出统一的解答)
注意:如果我觉得官方教程已经足够好了,我会 直接使用官方教程的链接,你可以导航至权威的教程一探究竟
13、章节连接
Angular7入门辅助教程(五)——Observable(可观察对象)
Angular7入门辅助教程(六)——Subject(可多播的可观察对象)
14、有趣的练习
你可能在此之前,已经学过很多门语言。你可能很精通你所学过的所有语言,但是你也有可能是这样的一种状态:我会用100多种语言写“hello world”,现在,在你看完这个教程后,我们试着用上前面所学的知识,用Angular这一种语言的不同方式输出“hello world”
15、讨论区
如果你发现本教程有什么错误的地方、或者疑惑可以联系我,联系方式有如下三种
- 直接在下方留言
- 在我的github上面留言:https://github.com/Learning-Angular/discussion
- 通过我的微信公众号后台留言(二维码在文章结尾处)
但是。这三种方式都有一个缺点:我可能不能及时看到哈(你也可以附上你的邮箱,以便你能及时看到答复)
微信公众号二维码