前端新机遇!为什么我建议学习鸿蒙?

简介: 【10月更文挑战第4天】前端新机遇!为什么我建议学习鸿蒙?

为什么要学习鸿蒙开发

大家好,我是石小石!最近一直在寻找新的工作机遇,但是行情确实不好,几乎没人理我。机缘之下,我搜了一下鸿蒙开发,看起来还不错!

于是,我深入的探索、学习了一下鸿蒙,得出一个重要结论:

前端非常适合学习鸿蒙,而且越早越好!

首先,我并不是贩卖焦虑,我并不是想表达前端已死、前端开始没落之类的意思!我一直认为,前端正在茁壮成长,前端永远不会被淘汰的!

之所以说前端适合或者应该学习鸿蒙,我的看法如下:

  • 鸿蒙方舟开发语言ArkTs保持TypeScript(简称TS)基本语法风格的基础上,对前端来说,接入难度低。
  • 鸿蒙ArkTs融合了很多优秀的语言,学习鸿蒙可以大幅度提升前端的代码水平。
  • 前端核心竞争力弱于后端,学习鸿蒙可以提升我们的地位和价值。
  • 随着华为生态的壮大,鸿蒙开发将是未来一大热点,目前鸿蒙开发者很好,现在学习,以后找工作什么的都具备优势。

鸿蒙开发简介

作为一门新语言,大家一定关注的是学习成本和产出性价比。那么很高兴的告诉前端同学,咱们学习嘎嘎快!

鸿蒙开发基于方舟开发语言ArkTs,只要我们开发一套代码,就可以部署手机、平板、TV、智慧屏(含车载)和穿戴设备,这一点,还是有一定优势的。

其次,鸿蒙的开发文档也是非常详细全面,完全满足我们的开发需求,大家感受下:

再者,鸿蒙开发生态也很完善,HarmonyOS SDK几乎提供了我们所能涉及的所有开发工具

前端学习鸿蒙开发的优势

之所以说前端学习鸿蒙开发有一定优势,主要基于方舟开发语言ArkTs本身。

基础语法接近TypeScript

首先,ArkTs保持了TypeScript的基本语法风格,前端看起来会比较熟悉

// 导入模块
import {
    collections } from '@kit.ArkTS';

// 声明一个字符串变量
let greeting: string = "Hello, ArkTS";

// 声明一个数字变量
let age: number = 25;

// 声明一个数组
let numbers: number[] = [1, 2, 3, 4, 5];

// 声明一个对象
let person: {
   
    name: string;
    age: number;
    isDeveloper: boolean;
} = {
   
    name: "John Doe",
    age: 25,
    isDeveloper: true
};

// 声明一个函数
function greet(name: string): string {
   
    return `Hello, ${
     name}`;
}

// 其他语法
let concatArray : collections.ConcatArray<string> = new collections.Array<string>('a', 'b', 'c');
let joinedString = concatArray.join('-'); // 返回 "a-b-c"

当然,ArkTs也具备java中装饰器的概念,对后端来说,也是比较亲切地

// 构造一个用户自定义的Sendable数据结构
@Sendable
class CustomData implements lang.ISendable {
   
    data1: number;
    data2: string;
    constructor(data1: number, data2: string) {
   
        this.data1 = data1;
        this.data2 = data2;
    }
}

UI框架可以完全用前端三件套开发

鸿蒙也是有一套UI框架的,叫做ArkUI

简单来说,ArkUI是基于ArkTS的声明式的UI开发范式,是ArkTS语言的一个具体应用或扩展,用于构建用户界面。ArkTs和ArkUI前端同学可以简单理解为js和element UI的关系。

借助ArkUI,我们可以直接写出类似小程序、vue的代码 一个简化的项目结构
// 目录结构
app.js                              用于全局JavaScript逻辑和应用生命周期管理
├── pages                           pages目录用于存放所有组件页面
│   ├── index
│   │   ├── index.html              描述当前页面的文件布局结构
│   │   ├── index.css               描述页面样式
│   │   └── index.js                处理页面间的交互

app.js是应用的一些声明周期

export default {
   
    onCreate() {
   
        console.info('Application onCreate');
    },
    onDestroy() {
   
        console.info('Application onDestroy');
    }
};

html是基于ArkUI组件的布局

<div class="container">
    <text class="title">你好!鸿蒙!</text>
    <text>跳转</text>
</div>

index.css 和前端css没有区别

index.js是页面的一些交互逻辑,像极了vue

export default {
   
    data: {
   
        title: ''
    },
    onInit() {
   
        this.title = this.$t('strings.world');
    }
}

注:对于一些大型的app开发,官方不建议使用这种类js的开发范式,要使用ArkTs声明开发范式

综上,完全可以证明前端确实适合学习鸿蒙开发,简单易上手!

最佳实践

这篇文章介绍了前端为什么需要学习鸿蒙,及学习鸿蒙开发的优势,算是开了个头。要想入门鸿蒙开发,大家可以去官网学习:https://developer.huawei.com/consumer/cn/arkui

也可以关注本专栏,本专栏将持续更新鸿蒙开发,帮助大家快速入门开发!

下一篇文章预告:前端快速上手鸿蒙开发极速版!

相关文章
|
7天前
|
前端开发 JavaScript 算法
【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
transition过渡属性 早期在Web中要实现动画效果,都是依赖于JavaScript或Flash来完成。 但在CSS3中新增加了一个新的模块transition,它可以通过一些简单的CSS事件来触发元素的外观变化, 让效果显得更加细腻。简单点说,就是通过鼠标经过、获得焦点,被点击或对元素任何改变中触发, 并平滑地以动画效果改变CSS的属性值。 在CSS中创建简单的过渡效果可以从以下几个步骤来实现: 在默认样式中声明元素的初始状态样式; 声明过渡元素最终状态样式,比如悬浮状态; 在默认样式中通过添加
87 1
|
7天前
|
前端开发 JavaScript 算法
【CSS】前端三大件之一,如何学好?从基本用法开始吧!(七):学习ransform属性;本文学习 rotate旋转、scale缩放、skew扭曲、tanslate移动、matrix矩阵 多个参数
transform变形 css3在原来的基础上新增了变形和动画相关属性,通过这些属性可以实现以前需要大段JavaScript才能实现的 功能。 CSS3的变形功能可以对HTML组件执行位移、旋转、缩放、倾斜4种几何变换,这样的变换可以控制HTML组件 呈现出丰富的外观。 借助于位移、旋转、缩放、倾斜这4种几何变换,CSS3提供了transition动画。 transition动画比较简单,只要指定HTML组件的哪些CSS属性需要使用动画效果来执行变化,并指定动画时间,就可保证动画播放。 比transitio
35 1
|
4月前
|
索引 容器
120. [HarmonyOS NEXT 实战案例:教育应用] 基础篇 - 垂直分割布局打造课程学习平台
在本案例中,我们将使用以下HarmonyOS NEXT组件: | 组件名称 | 功能描述 | | ------------- | -------------------------------------- | | `ColumnSplit` | 垂直分割布局容器,将界面分为上下两部分 | | `Column` | 垂直布局容器,用于垂直排列子组件 | | `Row` | 水平布局容器,用于水平排列子组件 | | `Scroll` | 滚动容器,用于在有限空间内展
85 3
120. [HarmonyOS NEXT 实战案例:教育应用] 基础篇 - 垂直分割布局打造课程学习平台
|
4月前
|
UED 容器
122.[HarmonyOS NEXT 实战案例:教育应用] 高级篇 - 课程学习平台的高级布局与自适应设计
在前两篇教程中,我们学习了如何使用HarmonyOS NEXT的`ColumnSplit`组件构建课程学习平台的基本布局,以及如何添加交互功能和状态管理。本篇教程将进一步深入,讲解课程学习平台的高级布局技巧和自适应设计,使应用能够在不同尺寸的设备上提供一致且优质的用户体验。
90 1
122.[HarmonyOS NEXT 实战案例:教育应用] 高级篇 - 课程学习平台的高级布局与自适应设计
|
10月前
|
缓存 API 数据安全/隐私保护
自学记录:学习HarmonyOS Location Kit构建智能定位服务
作为一名对新技术充满好奇心的开发者,我选择了HarmonyOS Next 5.0.1(API 13)作为挑战对象,深入研究其强大的定位服务API——Location Kit。从权限管理、获取当前位置、逆地理编码到地理围栏,最终成功开发了一款智能定位应用。本文将结合代码和开发过程,详细讲解如何实现这些功能,并分享遇到的挫折与兴奋时刻。希望通过我的经验,能帮助其他开发者快速上手HarmonyOS开发,共同探索更多可能性。
379 5
|
7月前
|
API 人机交互 Android开发
鸿蒙特效教程09-深入学习animateTo动画
本教程将带领大家从零开始,一步步讲解如何讲解 animateTo 动画,并实现按钮交互效果,使新手也能轻松掌握。
227 6
鸿蒙特效教程09-深入学习animateTo动画
|
12月前
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
253 0
|
10月前
|
API 数据安全/隐私保护 UED
探索鸿蒙的蓝牙A2DP与访问API:从学习到实现的开发之旅
在掌握了鸿蒙系统的开发基础后,我挑战了蓝牙功能的开发。通过Bluetooth A2DP和Access API,实现了蓝牙音频流传输、设备连接和权限管理。具体步骤包括:理解API作用、配置环境与权限、扫描并连接设备、实现音频流控制及动态切换设备。最终,我构建了一个简单的蓝牙音频播放器,具备设备扫描、连接、音频播放与停止、切换输出设备等功能。这次开发让我对蓝牙技术有了更深的理解,也为未来的复杂项目打下了坚实的基础。
357 58
探索鸿蒙的蓝牙A2DP与访问API:从学习到实现的开发之旅
|
8月前
|
安全 前端开发 开发工具
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
394 5
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
|
9月前
|
Dart 前端开发 架构师
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
466 26