【APP开发】Angular+Ionic+TypeScript+产品视频教程推荐

移动APP开发Angular+Ionic+TypeScript及产品的视频教程推荐,帮助你掌握开发技术,具备移动APP产品设计思想。
2019-10-22 02:20:41
开发移动APP有多种方案,如今手机性能大幅提高,加之WebView对HTML5的支持越来越好。早年间,关于Native APP和Web APP的争论从未停止,但Hybird APP却在短短几年时间成为很多开发者的选择。

·什么是Hybird App

Hybird App即使用Web前端技术,即HTML+CSS+JavaScript开发,通过内嵌WebView或调用系统的WebView内核进行展示,并由一套中间件统一安卓、IOS等系统差异,提供统一API接口或方法,允许开发者通过JavaScript像Native APP调用系统底层设备、模块、读取信息、更改系统设置和原生SDK交互,从而开发出兼具 Native APP的流畅用户体验和充足权限,同时具备Web APP开发周期短,易于维护,更新快的特点的APP。

·开发Hybird App的技术选型

前端三大框架,都有与之对应的原生应用框架。提起Hybird App,不得不提及PhoneGap,国内比较知名的WeX5就是以PhoneGap为基础的。在被Adobe收购以后,PhoneGap的核心引擎代码被抽离出来,成为Apache下的开源项目Cordova,而PhoneGap则作为商业性质的平台继续存在。正如国内的在线应用开发平台APICloud提出的那样,服务皆接口,Cordova提供了一系列接口,让JavaScript具备使用原生的设备功能。

Ionic总是和Cordova一起出现,但前者并不是后者的替代品,Ionic更关注于UI,它与Angular等三大框架的关系,更像是AntD与后者的关系,并且天生基于Angular,对Vue,React的支持也在研发中。

提及Angular,不得不提及TypeScript,因为Angular本身就是用TypeScript写的,其对TypeScript具有较好的支持能力,对TypeScript的良好使用,可以大大增强项目的可维护性。

现在,我们至少总结出了一条开发Hybird App,即混合APP的技术选型:

TypeScript + Angular + Ionic + Cordova

·如何学习TypeScript + Angular + Ionic + Cordova

显然,学习一门语言或框架,最好的方法,是阅读它们的官网、文档、如果你像我一样,不喜欢阅读文字,那么看视频是更快的选择,这里我把自己看过的视频教程推荐给大家:

1 学习TypeScript的教程

TypeScript官网:

http://www.typescriptlang.org/

TypeScript中文手册:

https://typescript.bootcss.com/

【视频教程】TypeScript开发实战(系统掌握TypeScript核心技术)

极客时间《TypeScript开发实战》(系统掌握TypeScript核心技术)课程分享海报

https://time.geekbang.org/course/intro/211?code=oSNiYfv8MDVXXZ3LyQHwuLCQqfPPV6XGeAPzX5agNHc%3D&utm_term=SPoster

【听课方法】扫描上图的二维码就可以学习了,如果你是手机操作,可以先截屏,然后进入微信,扫一扫,从相册上传二维码,上传截屏就可以了,下面推荐的课程,也可以这样操作。

全套课程,大概47讲,分为基础篇、工程篇和实战篇,每一讲的时间都不是很长。但是老师讲得非常细,是目前市面上少有的非常完整系统的TypeScript视频教程。

只学习过JavaScript,而没有接触过后端语言的前端工程师,学习TypeScript的第一步,就是要重塑 类型思维,真正体会规范类型带给编程的好处。

需要重点了解TypeScript的基础类型,理解泛型,会用修饰符等等。

由于我们的目的是为学习 Angular 作准备,如果时间紧张,只看 基础篇(21讲) 就足够了。

基础篇的后面可能会比较难理解,建议反复看,然后看别人的项目代码来帮助理解。

【福利】扫描上图二维码,购买成功的朋友,加我微v信x(madfan),备注 返现,报 极客时间的昵称,可以返现20元红包。

【注意】如果没有安装极客时间APP,建议先下载安装极客时间APP,扫码成功后,直接购买/拼团/组团,不要转到其他课程,这样容易丢失返利哦!


2 学习Angular的教程

Angular中文文档:

https://www.angular.cn/

【视频教程】Angular实战教程

腾讯课堂《Angular实战教程》分享海报

https://m.ke.qq.com/course/420261?saleToken=&from=appso

同样是扫码学习,但是这套视频课程是完全免费的,只要下载腾讯课堂APP,就可以免费听课了。

课程有23节,每节课6-15分钟,快的话,两天可以看完,主要是手要敲上一遍,来更好的理解代码。

别看课程多,但只讲了一个内容,对应Angular文档里面《Tour of Heroes》(中文常翻译为:英雄指南,英雄编辑器)示例。

在教程中,你可以跟着老师,完整地敲一遍示例代码,将Angular的组件、组件通信、模块、服务、依赖注入、路由、HTTP接收数据完整地过一遍。

完成英雄指南案例,你就熟悉了Angular的基本操作了。

3 学习Ionic的教程

Ionic官网:

https://ionicframework.com/

Ionic文档:

https://ionicframework.com/ docs

【视频教程】Ionic4.x + Cordova + Angular7 打造仿京东商城跨平台移动端项目

这套视频课程出的时间比较晚,采用的Angular和Ionic都是比较新的版本,网上中文的Ionic4.x教程实际上很少。

需要提醒的是:Ionic2、Ionic3、Ionic4都存在一定的差异,需要问清楚你接手的项目采用的是Ionic的第几个版本。

教程讲解比较生动,给人的感觉就是很接地气,北方的同学可能会有一种亲近感。

教程存在免费和付费两种版本:

免费全集:

网盘链接: https://pan.baidu.com/s/1M_5yGDNVvkA2fzHQeISS6A 提取码:th90

付费全集:

https://www.itying.com/goods-1067.html

付费要比免费多很多内容,付费后,会提供给你专用播放器,支持MacOS和Win系统,部分视频需要专用播放器,并联系客服激活后,才可以播放。当然激活只用一次,以后就不用激活了,依然比较方便。


4 产品课:

移动互联网发展之时,一些传统的门户互联网巨头,并没有在APP中延续其在PC的地位。

但腾讯凭借微信、手Q、QQ邮箱、手机管家等多个APP,加上天天酷跑、王者荣耀、绝对求生等多个游戏,确定了其在移动领域依然无可撼动的地位。

但是同样出自腾讯,Q信、腾讯地图、QQ邮箱的阅读空间却未能获得大量用户的持续喜爱,原因是什么,腾讯内部做了哪些反思呢?反思最终导致了部分产品的进化,失败的阅读空间最终成就了今天的微信公众平台。

当你准备用Angular+Ionic+TypeScript制作功能大而全,外观高大上的APP时,因为这样或那样的不完美,而不断推迟上线日期时,不妨先看看《腾讯产品启示录》教程。

拉勾教育《腾讯产品启示录》课程分享海报

https://appcCrwMYBx6232.h5.xeknow.com/st/2U5gigalE

【福利】扫描上图二维码,购买成功的朋友,加我微v信x(madfan),备注,返现,报 拉钩教育的昵称,可以返现20元红包。


好啦,是不是已经准备好,开始制作你的APP了呢?赶紧开始你的学习之旅吧!

115210
小宇
ShopXO插件 ▶力扣 ▶Github ▶M站