Hello! 我是峰华

欢迎来到我的博客!我是一名前端工程师,拥有10年左右开发经验,5年从业经验,从事过前端、后端、全栈、移动端的开发工作,并曾在美国史蒂文斯理工学院攻读计算机科学硕士学位,获得云计算专业证书

最新博客 

鸿蒙 OS:使用 JavaScript 开发 Todo App UI 界面

距离鸿蒙 OS 2.0 发布已经过去一些日子了,看到鸿蒙系统强大的设备共享能力,我觉得未来它一定能够成为主流的操作系统。在利用了分布式系统的优势之后,多个设备间可以共享应用程序界面和数据,并且对于开发者,也可以使用一套代码编写应用,就可以在多种设备终端上运行。

一开始我并没有太关注鸿蒙系统,以为它只能使用 Java 开发应用,跟前端好像没啥关系,但是看了开发文档后,发现 UI 部分既支持纯 JavaScript 开发,也支持纯 Java 开发,还可以 Java 跟 JavaScript 混合开发。鸿蒙应用的开发跟 Android 的开发很像,只是把概念重新定义了一下。它分为 FA(Feature Ability)和 PA(Particle Ability)两种应用模式,FA 是带有用户界面的,PA 则是运行在后台的服务程序,可以想象成安卓里的 Activity 和 Service,不过也略有不同。FA 支持使用 Java 和 JavaScript 两种方式开发 UI 界面。如果使用 Java,则跟 Android 一样,使用 xml 定义布局或者 Java 代码定义布局,每个页面都是一个 PageAbility,使用 Java 编写业务代码,不同的页面之间传递数据依然使用 intent。而这里如果使用 JavaScript UI 框架的话,那么写法跟 Vue 应用基本一模一样,同样支持 data、props、computed、watch 和 functions(methods),也能创建自定义的组件,这样 web 前端工程师就很容易转型成为鸿蒙 UI 开发工程师,不得不说华为在已有概念上做的整合,还是相当厉害的。

职业规划:程序员的 T 字形发展攻略

你是不是在面对市面上众多的技术的时候,不知道选择哪个才能对自己的职业和未来发展有所帮助?有这样的想法是正常的,因为随着科学的发展,现在的编程技术已经到了百花齐放的地步了。

  • 从编程语言上,你可以选择 Java、JavaScript、Go、PHP,还有基于它们的框架等等。
  • 从客户端上,可以选择移动端,web 端,还有后端等等。
  • 从行业领域上,还可以选择数据科学、金融工程或商业智能分析等等。

那么这么多的技术和领域,我们到底应该选哪一个才比较好呢?

前端工程师到底要学到什么程序才能去找工作?成功面试的必备要素与回答技巧

好多人都想知道,前端工程师到底要需要掌握什么技能、到什么程度,才能去找工作?最简单的答案:

把 html、css、 js 基础学扎实,再掌握 vue 或 react 前端框架之一就可以了。

真的是这样吗?技术上看似乎没问题,但是找工作不只要从技术上下手,还要从个人目标和公司的招人标准综合进行考量。那么接下来,我们从这几个方面来分析一下,前端工程师找工作的必要条件,然后给大家分享一套有逻辑、有结构的面试回答技巧。

噢!原来这就是 TypeScript

我第一次使用 TypeScript 是 16 年在读研的时候,学校的算法课是使用 TypeScript 实现的。当时只知道 TypeScript 是 Angular 开发的必备语言,没想到还能这么通用。后来在写作业的时候,发现 TypeScript 也并不是特别难,只不过是给 JavaScript 加上了类型信息,让代码不那么容易出错,并且支持高级的面向对象编程范式,让 JavaScript 变得跟 Java/c# 差不多。接下来,这篇文章就给你揭开 TypeScript 的面纱,对它来一个宏观上的认识,然后介绍一下如何编写并运行 TypeScript 程序,如何定义类型,另外假设你有 JavaScript 基础。

给前端工程师看的后端科普

前端工程师了解后端的功能和作用之后,能更好的和后端工程师进行沟通,减少沟通成本,另外也有助于向全栈工程师方向发展。在开始之前,先回顾一下应用的构成:

前后端通信之 HTTP 协议

前后端数据的交换一般是基于 HTTP 协议。HTTP 协议包括客户端和服务端两个实体,客户端发送请求给服务端,服务端返回响应给客户端。在 HTTP 中,数据称为资源,可以是 html 文档、图片、也可以是普通文本。资源是通过 URL 进行定位的。

5个技巧助你成为 CSS 大神

作为一名前端工程师,经常在写完 HTML 以后,才觉得真正的噩梦要开始了,啊,写 CSS 的时候,面对满屏乱飞的组件,真想手动给他们挪到该在位置上…… 都说 CSS 很难掌握,最愁给页面编写样式,其实都是因为还没有形成一个对 CSS 宏观的了解,只要有了正确的学习方法、设计思维,再通过不断的积累,就能轻松的掌握它。接下来我会把掌握 CSS 的 5 个技巧整理一下,让你在以后编写 CSS 的时候不再发愁。

CSS Flexbox 布局教程 2020 最新版

在 CSS flexbox 布局出现以前,如果要控制 HTML 元素的布局,要用到很多种奇葩的方式。在水平方向上得用float控制左右对齐,稍一不注意,就会有浮动的元素飞来飞去~。在垂直方向上就更是百家争鸣了:要么手动计算高度然后算出中心点,要么用 line-heightheight 的结合,要么用十之八九不生效的 vertical-align 属性等等等等。自从 flex-box 出现以后,一切似乎就豁然开朗了,水平垂直各种花式对齐,空间分配由你做主。当然,要用好它,用对它也不是一件容易的事,今天就给你说说 flex-box 布局,看完之后你也能熟练的运用它!(博客中的示例都是真实的 HTML 代码,可以使用 chrome 开发者工具查看属性。(此文为了演示某些 flex 示例,在小屏幕下会有横向滚动条)

CSS 选择器优先级(特异性、权重)详解

在写 CSS 的时候你一定遇到过有些样式明明写对了,也选择了正确的 html 元素去应用这些样式,可是就是不生效,这是为什么呢?因为在选择同一个 HTML 元素的时候,不同的选择器有不同的优先级,优先级低的选择器的样式会被优先级高的覆盖。

制作渐变背景生成器 - React State和Event教程

Hello, 今天教你写一个渐变背景生成器。我会用这个例子来解释 react 的 state,状态管理,还有事件处理。这个小工具提供了两个颜色选择器,分别可以选择渐变的两个颜色,渐变的角度是 75 度,线性渐变。另外还有一个重置按钮可以把渐变恢复成初始值。