React-混合移动App开发介绍

  • Z时代
  • 2024-01-10
  • 分类：综合

react

学习目标

  • 了解混合移动App开发的相关背景

  • 了解项目开发流程

  • 了解三大框架

什么是混合移动App开发？

  • 苹果系统中的软件是如何被开发出来的：使用OC或者swift。

  • 安卓平台中的软件是如何被开发出来的：使用安卓相关的语言，例如Java,安卓控件等。

  • 苹果系统和安卓平台共有的软件是如何被开发的：例如，腾讯招2套开发人员【开发组】（一套负责苹果系统开发，一套负责安卓平台开发）

  • 前端移动App（Application）开发技术，开发手机端的应用程序。

  • 前端混合移动App开发技术：没有使用苹果、安卓官方推荐的开发平台、开发方式，而是抛弃了官方提供的方式。使用前端的独有的技术进行移动App开发。

 

移动App技术：将Web网站技术（HTML+CSS+JS）通过某种方式移植到移动App开发上进行使用。这种利用web开发技术进行移动端开发体验的方式，叫做混合移动App开发。

 

移动App开发相关概念

  • 原生开发（NativeApp）:使用IOS/Andriod（2013年左右）官方推荐的工具、开发平台、配套语言运行手机App开发的方式。

  • 混合开发（HybirdApp）：使用已有的技术（HTML+CSS+JS）,搭配一些相关的打包编译技术，就能够开发一个手机App，安装到手机中进行使用。

  • 什么是App:Application的缩写，指可安装的应用程序。

  • App的分类

    • 按平台划分

      • PC端：浏览器、代码编辑器、PC端游戏、听歌、视频等

      • 移动端：手机QQ、手机微信等

    • 按功能划分

      • 游戏：愤怒的小鸟、植物大战僵尸等

      • 应用：非游戏类的软件（支付宝、美团等）

  • App和Web的区别

    • App概念：Application的缩写，指可安装的应用程序。

      • 优点：流畅、稳定、某些App可以离线运行（用户体验好）

      • 缺点：不能跨平台

    • Web概念：基于浏览器的Web网站（本质：网页）

      • 优点：可以跨平台（浏览器天生可以跨平台）

      • 缺点：没有app流畅、不稳定。受限于网速

 

前端发展的历史

只能做页面 -> Ajax前后台数据交换 -> Jquery、BootStrap -> webApp -> 三大框架 -> 可以做手机混合app/桌面应用 -> 可以做原生App

 

前端APP开发2种方式

  • 第一种：首先开发一个网站，接着运行打包命令，最后得到APP。

  • 第二种：按照规定的语法编写框架代码，接着打包得到APP。

 

常见App开发方式

  • WebApp: 基于浏览器实现，有特定功能的网站，称作WebApp。

    • 例如：百度脑图、https://m.jd.com

    • 优点：跨平台

    • 缺点：依赖网络、用户体验相对较差；不能调用硬件底层设备，比如摄像头（网页版JD不能扫一扫）。

  • NativeApp: Android/Object-C等原生语言开发的应用。

    • 优点：体验好、用户使用流畅、适合游戏（游戏开发）、可直接调用底层硬件API

    • 缺点：不能跨平台

  • HybirdApp: 利用前端技术开发移动端App，间兼具2者优势。

    • 优点：能够跨平台、用户体验好、能够调用硬件底层API

    • 缺点：相对于原生开发用户体验稍差、不适合做游戏开发、适合做非游戏类型的手机App

注：使用Java、IOS编写的代码/程序，在运行时会将普通文本编译为原生的机器码去执行，不同于JS(解析执行，不运行到出错行不知道有错）,Java代码是编译执行（预编译阶段指出问题）。

 

 

 

企业如何选择合适自己的App开发方式

  • 如果企业曾今使用过原生技术开发过App，则在维护时必然选择使用原生技术来维护。

  • 如果企业需要开发游戏级别的应用，则推荐使用原生。因为原生运行效率高，对耗电处理效果好。

  • 如果企业做非游戏的应用软件，如淘宝、京东等，可以使用混合App。

  • 企业有一个好的项目方案，则需要立即将该项目做出来。使用混合App很合适，快速上线，抢先占市场。【裤衩开发】

企业项目开发流程

  • 需求调研：产品定位、受众群体、市场需求、开发价值；【产出物：需求文档】

  • 产品设计：功能模块、流程逻辑；【产出物：设计文档、交互稿】，确定项目的基本功能

    

  • 项目开发：项目架构、美工、前端、后台、测试【产品的把控】 （前后端分离的概念）

  • 运营维护：上线测试、调bug、微调功能模块、产品迭代

 

一言以蔽之：根据需求做设计、根据设计做开发。

 

三大框架介绍

  • Angular和Ionic(打包工具）

  • Vue.js和Weex(打包工具）

  • React.js和React-Native(打包工具）

    • [react.js英文网] {https://facebook.github.io/react}

    • [ReactNative中文网] {https://reactnative.cn}

    • [ReactNative英文网] {https://facebook.github.io/react-native}

Ionic/Weex/React-Native：运行命令将项目打包成手机App、三者提供一些组件以方便构建移动App的用户界面。

以上是 React-混合移动App开发介绍 的全部内容， 来源链接： utcz.com/z/382733.html

回到顶部