推荐个国产框架,从此轻松开发 小程序/App/h5

简介: 推荐个国产框架,从此轻松开发 小程序/App/h5

我的学习背景


目前前端市场,主流框架分为PC框架和移动框架两个方向。此外,还有两种 JavaScript 库,React 和 Vue 。基于这两个 JS 库,市场上有各种各样的框架。今天介绍 UNI-APP 是一个基于 Vue.JS 的跨端移动框架。


现在在国内,有很多移动平台,比如微信、支付宝、百度、字节跳动等,都提供了小程序的开发/开通功能。这些都是基于移动平台,平台本身也提供了小程序开发功能和指南。


但是在很多平台上,如果一个应用想要完成统一标准化的开发,可以兼容各个平台的差异,但是成本会比较大。还有一个要求是我们自己发布一个app,功能和小程序一致。所以一个合适的框架,一个降低成本的框架是需要考虑的。




uni-app给予我的帮助

这也就是我学习uni-app的理由,不管是开发一些竞赛的参赛作品还是一些承接的外包项目的开发,只需要写一套代码然后就可以多个平台部署,真的很爽~~~


uni-app 官方功能图:


34.png

当然 react native 、flutter 、以及小程序、安卓、ios原生做开发也不差;但说实话就以我本人的开发体验而言,只要会 vue uni-app 真的不需要学习成本,下载好 HBuilderX ,再配合一个可以整合的ui框架(例如 uView ),直接新建项目按照 vue-cli 的逻辑和ui框架的文档,一股脑梭哈就好。对于我个人来说 uni-app 在敏捷开发方面带来的体验确实很棒。


使用 uni-app 编写一套代码,可发布到多个平台,我们在官方推荐的IDE:HBuilderX 中可以看到各个发行方式


35.png


就在前不久学院老师联系我,表示因为疫情所以需要做一个在线的心理辅导平台,我很愉快的答应了下来,也是因为uni-app带给我的自信,首先针对wap版的demo试用,可以直接按照平时的方式渲染出来。之后wap版本使用稳定了之后就可以直接发不成小程序,不需要进行二次开发节省了大量时间(至于为什么不直接进行小程序的开发。。这个因为预算有限。。。我可不想赔本)




分享一些知识点

考虑到要真正学习到uni-app的正确使用方法,特此以写促学,和大家分享uni-app 开发规范


为了实现多端兼容,综合考虑编译速度、运行性能等因素,uni-app 有如下开发规范:


  • 组件标签 尽量贴近小程序规范。
<view>
  <button size="mini">按钮</button>
</view>
  • 页面文件遵循 Vue 单文件组件(SFC)规范
<template>
  <view>
    此处必须且只能有一个根view,所有内容都需要写在这个标签里。 
  </view>
</template>
<script>
    export default {
        //....
    };
</script>
<style></style>
  • JavaScript API 尽量贴近微信小程序规范,将前缀 wx 替换为 uni。


uni.chooseImage({
  //...
});
  • 数据绑定及事件处理同 VUE.JS 规范,同时 uni-app 补充了 App 及页面的生命周期。


  • 为兼容多端运行,推荐建议使用 flex 布局进行开发。


关于 flex布局 推荐阅读我的 【W3C推荐的新布局模式 【CSS Flex布局】详解】

目录
相关文章
|
11天前
|
小程序 JavaScript 前端开发
小程序常见的UI框架
小程序常见的UI框架
|
20天前
|
Web App开发 Java 视频直播
FFmpeg开发笔记(四十九)助您在毕业设计中脱颖而出的几个流行APP
对于软件、计算机等专业的毕业生,毕业设计需实现实用软件或APP。新颖的设计应结合最新技术,如5G时代的音视频技术。示例包括: 1. **短视频分享APP**: 集成FFmpeg实现视频剪辑功能,如添加字幕、转场特效等。 2. **电商购物APP**: 具备直播带货功能,使用RTMP/SRT协议支持流畅直播体验。 3. **同城生活APP**: 引入WebRTC技术实现可信的视频通话功能。这些应用不仅实用,还能展示开发者紧跟技术潮流的能力。
51 4
FFmpeg开发笔记(四十九)助您在毕业设计中脱颖而出的几个流行APP
|
21天前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
45 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
10天前
|
小程序 开发工具
app跳转微信小程序,使用明文scheme拉起
app跳转微信小程序,使用明文scheme拉起
36 4
|
14天前
|
移动开发 小程序 JavaScript
uni-app开发微信小程序
本文详细介绍如何使用 uni-app 开发微信小程序,涵盖需求分析、架构思路及实施方案。主要功能包括用户登录、商品列表展示、商品详情、购物车及订单管理。技术栈采用 uni-app、uView UI 和 RESTful API。文章通过具体示例代码展示了从初始化项目、配置全局样式到实现各页面组件及 API 接口的全过程,并提供了完整的文件结构和配置文件示例。此外,还介绍了微信授权登录及后端接口模拟方法,确保项目的稳定性和安全性。通过本教程,读者可快速掌握使用 uni-app 开发微信小程序的方法。
39 3
|
19天前
|
开发框架 JavaScript 前端开发
uni-app x 跨平台开发框架
uni-app x 是一个强大的跨平台开发框架 uni-app x 是一个庞大的工程,它包括uts语言、uvue渲染引擎、uni的组件和API、以及扩展机制。
17 1
|
3天前
|
小程序 前端开发 JavaScript
Java开发工程师转小程序开发的前景如何?
Java开发工程师转小程序开发的前景如何?
15 0
|
12天前
|
小程序 前端开发 JavaScript
开发支付宝小程序的思路
【9月更文挑战第7天】本文介绍了一种在支付宝小程序中实现网页抓取的方法,通过云函数或自建后端服务来解析外部网页的标题、描述和图片。具体步骤包括:用户输入链接,小程序调用云函数抓取并解析网页内容,最后将结果返回并在前端展示。文中详细介绍了使用 Node.js 的云函数实现过程,包括代码示例和小程序前端页面的实现方法。通过这种方式,可以显著提升链接分享的用户体验。
26 0
|
20天前
|
Android开发 iOS开发 C#
Xamarin:用C#打造跨平台移动应用的终极利器——从零开始构建你的第一个iOS与Android通用App,体验前所未有的高效与便捷开发之旅
【8月更文挑战第31天】Xamarin 是一个强大的框架,允许开发者使用单一的 C# 代码库构建高性能的原生移动应用,支持 iOS、Android 和 Windows 平台。作为微软的一部分,Xamarin 充分利用了 .NET 框架的强大功能,提供了丰富的 API 和工具集,简化了跨平台移动应用开发。本文通过一个简单的示例应用介绍了如何使用 Xamarin.Forms 快速创建跨平台应用,包括设置开发环境、定义用户界面和实现按钮点击事件处理逻辑。这个示例展示了 Xamarin.Forms 的基本功能,帮助开发者提高开发效率并实现一致的用户体验。
45 0
app开发的一些思路
<p><br></p> <p><br></p> <p></p> <h3 style="margin:0px; padding:0px; border:0px; vertical-align:baseline; clear:both; font-weight:normal; list-style:none; color:rgb(102,102,102); font-family:宋体;
2909 0