有部分同学和朋友问到过我相关问题。利用周末我就浅浅地谈谈我对web前端开发的理解和体会,仅仅能浅浅谈谈,高手请自己主动跳过本篇文章。

毕竟我如今经验并非非常足,连project师都算不上,更不用说大牛了。今天也不谈技术。技术非常多人比我掌握得更好,也大同小异。可是每一个人的理解体会是不一样的。

1、对前端开发的三个整体理解和体会

我对前端开发的整体体会有三:

第一:杂而难,难度甚至超过了一般的后台开发,假设有人认为前端开发简单仅仅能说明他还没有入门。

第二:web前端开发正在向响应式和移动端方向大步迈进。

第三:前端project师事实上就是编程技术人员,用一句话来形容“比UI设计懂技术,比技术人员更懂交互”。当然也有人说前端project师是project师中的设计师,是设计师中的project师。既然是编程工作。那就不会做一辈子。毕竟太累。认真敲几年代码然后去卖水果吧,还望师弟师妹们来照应我生意。

2、网页制作与web前端开发

前端开发project师是一个比較新的职业。在国内乃至国际上開始受到重视的时间不超过几年。互联网进入2.0时代后,web开发技术得到了空前的发展,尤其是前端技术。近几年,随着用户对体验的要求越来越高,前端开发技术难度也越来越大。以前设计和制作不分的职位也最终分为UI设计师和web前端开发project师(前端开发师)两个职位。分别向艺术和技术的方向纵向发展。

从技术体系上讲,前端开发师须要掌握和了解的东西许多。有些大牛用庞杂来形容。

几年前,还没有前端开发的时候我们叫做网页制作,主要内容都是静态的页面。用户也是以浏览为主,而如今发生了翻天覆地的变化,网页不再仅仅是承载单一的文字和图片,各种富媒体让页面内容更加生动,更注重用户体验。

曾经会平面设计软件、DW和简单的HTML、CSS、JS就能够制作网页,如今只掌握这些已经远远不够了,假设只掌握这些连工作机会都非常少。不管是开发难度。还是开发方式。如今的web前端开发都接近传统的站点后台开发。我觉得比一般的后台开发更复杂。一个站点或者移动应用是否专业、功能是否强大。server端是用J2EE+Oracle组合还是ASP+Access组合。并没有太明显的差别,可是,前端的用户体验却给了用户直观的印象。所以如今不不过网页制作。而是web前端开发。大部分人觉得是web前端开发代替了曾经的网页制作,我觉得如今网页制作和web前端开发的岗位同一时候存在。

假设只掌握曾经网页制作的技术,那么如今还是叫网页制作师(我在招聘网页上也看到不少网页制作师这个岗位),并不能称之为web前端project师。

3、Web前端开发一般要掌握哪些技术和具备哪些条件?

第一、要掌握以前网页制作师掌握的基本技术。如各种页面布局,面向对象编程,JS模块化编程。设计模式,前端MVC等等。

第二、站点性能优化,SEO。如尽量降低HTTP请求次数、cssSprites图片整合技术、合并css与js、运用CDN技术。降低DNS查找次数、避免重定向等。

第三、要会UI设计。当然在一些相对较小的公司前端project师也担任着UI设计的角色。在大公司尽管有专业的UI设计师,可是前端project师会UI设计能帮助你更准确的理解设计师的意图。在原型不完整的时候也能正确的反馈设计缺陷,将问题阻挡在设计的环节,会大大降低UI bug数量。比方。设计师会给出理想状态下的容器样式,却往往忽略了文字溢出折行、长连续字符、容器宽高是否适应内容尺寸变化而变化,溢出部分是作截字还是隐藏等诸多细节,由于设计师不一定懂“边界值測试”的道理,而这些问题往往在測试阶段才被发现,所以,假设能在拿到UI设计稿时就提醒设计师补充完整这些场景,自然降低測试回归次数。

第四、至少要会一门后台编程语言。职业的特殊性决定了我们须要跟后端工作者频繁的沟通。假设仅仅顾页面实现,不考虑后台。写出来的页面也有一部分是废弃代码,在后台进行数据交互的时候用不了。另一方面就是从招聘信息能够得知。如今差点儿全部公司前端开发岗位都明白要求会后台语言,在实际工作中可能也要做client和server端之间的数据交互等。
IMG_256
第五、掌握各种浏览器兼容解决的方法。国内和国际主流浏览器种类多,内核不统一,如以Trident为内核的IE、以Gecko为内核的FireFox、以Presto为内核的Opera、以Webkit为内核的google chrome和Safari等。这给我们前端开发添加了非常多困难,也是大多数人头疼的事情。且不说眼下市面在有这么多的浏览器,就只单一的IE系列家族的问题也够多的了,特别是IE6,IE7。下图是本月对上个月全球浏览器市场统计排行,IE浏览器用户任然超过百分之五十。虽然2016年1月起,微软将停止对旧版IE浏览器的支持。【微软相关原新闻链接请猛击这里】可是我相信近期非常多年之内IE低版本号浏览器还是会占比較大的比例。消亡还需时日。
IMG_257
第六、必须学会运用各种工具进行辅助开发。

第七、除了掌握技术层面的知识。还有掌握理论层面的知识。包含渲染原理。代码的可维护性,组件的易用性。分层语义模板等等。

第八、要有细心和耐心。和UI设计一样,我们必须精确到每个像素,耐心也体如今多方面,比方让初期开发人员头疼的兼容问题,假设编码不够规范,解决兼容问题的时间远远超过了页面实现的时间。

第九、热爱并不断学习新技术。

前端差点儿每天都有新技术产生,从事这一行,在打牢基础的情况下要不断学习新技术。包含开发流程部署,预处理技术,前端框架(如RequireJS、ReactJS、AngularJS等等),移动终端,标准规范等。

4、浅谈自己的体会

与server端语言先慢后快的学习曲线相比,前端开发的学习曲线是先快后慢。所以如今有非常多学生或者已从事工作了的人都開始想涌入web前端开发的潮流,并自学成“才”。但我知道大多数人都停留在会用的阶段。由于要想成为一名真正的web前端开发师每前进一步都非常难。虽然有的人每天都利用工作之余学习。却还是学不精,于是处于纠结迷茫的状态。

还有一方面,正如开篇所说。这还是一个比較新的职业,对一些规范和最佳实践的研究都处于探索阶段,一些新的技术随时都会闪现出来,比如:浏览器大战也越来越白热化,跨浏览器兼容方案依旧五花八门,眼下我所在的公司一般要求我们兼容到IE7,曾经常常遇到这样的情况。好不easy把IE各个版本号都兼容了,高兴之余又发如今360浏览器上出现了bug。没办法,熬夜奋战呗。

前端开发project师是一个易学难精的职业,我们必须深入、系统地学习并掌握前端知识,假设简单地自学一下就能成为web前端project师。那我想如今市场上也不会出现高薪找不到前端project师的情况了。有经验的web前端开发project师都知道,要精通这一行,必须先精通十行。有一些有经验的前端project师,在不断寻求新的技能上的突破,最明显的一点体现是。開始关注“底层协议”,即HTTP、第三方应用、系统对接、制造工具、工作流程等,这时思考的重点已经脱离了“切页面”,变为“出方案“,比方要架设一个网站,可以搭建网站框架,预见网站兴许(前端)开发中的全部风险。并一一给出解决方式。

说说半路出家的危与机,俗话说。隔行入隔山。每一个行业自有其道。自然不是想做就做。

前端技术领域半路出家者非常多,我们来分析一下转行的心理。

第一、看到前端技术入门简单、互联网对前端技术的需求缺口大;

第二、前端技术所见即所得、感觉学习起来非常快;

第三、我身边的某某转行作前端看上去不错、我似乎也能够。

第四、我不喜欢我如今做的工作、想换行业、正好前端技术上手较快。就选他吧;

第五、我的确了解并喜欢做Web前端。为它付出再多都是值得的。

新进入这一行或者转行者的心态比較easy走两个极端。一是仅仅看到新行业的好,二是仅仅认为原工作非常糟糕。

但无论是什么行业,对自己的职业规划的思考都应当先行一步。进入这一行必须先清晰的回答这些问题:

1.我能做什么?

2.我不能做什么?

3.我的优势是什么?

4.我的劣势是什么?

5.做这一行对我有何优点?

6.做这一行会让我付出何种代价?

7.怎样定义成功?

由于面试的时候一定会被这些问题所挑战。假设支支吾吾说不清楚,要么是对自己未来不负责任,要么骨子里就是草根一族,习惯做什么都蜻蜓点水浅尝辄止。也难让人信服你进入这一行是一个权衡再三看起来合理的选择。

5、相关误区解释

有人觉得前端project师上班不干别的。就是玩,弄点效果。攒两页面,搞点创新。当然这个表述很轻巧、甚至有调侃的味道,web前端工作绝对不是玩那么简单的。更不像以前的网页制作那么单一,有时候会为一些效果的实现或优化,弄得加班加点。上周还由于解决一个问题花了2天的时间。羞愧啊。

所以前端开发是一项很特殊的工作,前端project师的工作说得轻松,看似轻巧,但做起来绝对不是那么的简单。

在开发过程中涵盖的东西很宽广,既要从技术的角度来思考界面的实现,规避技术的死角,又要从用户的角度来思考,如何才干更好地接受技术呈现的枯燥的数据,更好的呈现信息。

在入行初期。非常多人过于着迷。从而陷入了迷途。比方有人纠结于是否将dt、dd的样式清除从reset.css中拿掉,原因是认为这两个标签的清除样式会耗费一些渲染性能。或者是否须要将for循环改为while循环以提高js运行速度。虽然这些考虑看上去是合理的,但并非性能的瓶颈所在,也就是说。你花了非常大力气重构的代码带来的页面性能提升,往往还不如将两个css文件合成一个带来的提升明显。就好比用一把米尺量东西,不是必需精确到小数点后10位,由于精确到小数点后2位就已经是不准确的了。这样的技术误区经常让人捡了芝麻丢了西瓜。

6、对自己学习和工作的要求

N.C.Zakas以前勉励过大家,如今成为了我对自己的要求和对已结确定要走Web前端开发方向的人的建议:热爱你的工作。热爱跨浏览器开发带来的挑战、热爱互联网技术的种种异端,热爱业内的同行,热爱你的工具。互联网发展太快了,假设你不热爱它的话,不可能跟上它的步伐。

这意味着你必须多阅读。多动手,保证自己的才干与日俱增。要为怎样编写易于维护、高质量的前端代码奋斗。

下了班也不能闲着。要做一些对自己实用的事儿。

能够參与一些开源软件的开发,读读好书,看看牛人的博客。常常參加一些会议,看看别人都在干什么。

要想让自己高速成长,有非常多事儿能够去做,相信付出一定会有回报。

这次就分享到这里。一个上午就这样过去了,饿了,该去做中午饭了。关于前端开发详细相关技术和详细怎么学习发展下次我会继续分享。

文章来源:网络 版权归原作者所有

上文内容不用于商业目的,如涉及知识产权问题,请权利人联系小编,我们将立即处理

相关文章

Git如何清除缓存?这四个命令得会!

git rm适用于从版本库和工作目录中删除文件,但无法处理未被追踪文件。git reset可以用于回滚提交和从缓存中移除文件,但不涉及工作目录中未被追踪的文件。提供更高级的索引控制,但不直接删除文件。git clean用于删除工作目录中未被追踪的文件。在实际使用中,根据具体的需求和场景选择适当的命令。清除缓存是一项破坏性操作,需要慎重对待,确保在清除之前做好备份,并尽量避免不必要的清除操作。

React 中引入 CSS 高阶用法

组件式开发选择合适的`css`解决方案尤为重要通常会遵循以下规则:- 可以编写局部css,不会随意污染其他组件内的原生;- 可以编写动态的css,可以获取当前组件的一些状态,根据状态的变化生成不同的css样式;- 支持所有的css特性:伪类、动画、媒体查询等;- 编写起来简洁方便、最好符合一贯的css风格特点

【Vue3】使用ref与reactive创建响应式对象

先来简单介绍一下ref,它可以定义响应式的变量let xxx = ref(初始值)。**返回值:**一个RefImpl的实例对象,简称ref对象或refref对象的value属性是响应式的。JSxxx.value,但模板中不需要.value,直接使用即可。对于let name = ref('张三')来说,name不是响应式的,name.value是响应式的。下面我们看一看上图红框中代表的意思是,我们哪里需要响应就在哪个里面导入上述代码即可。

如何使用阿里云OSS进行前端直传

在使用阿里云OSS进行前端直传时,首先我们需要去阿里云官网注册自己的存储桶,然后申请相关的accessKeyId和accessKeySecret,然后新建一个桶,为这个桶命名以及选择对应的地区。然后可以根据自己的业务,封装对应的组件,以下是根据我自己的项目,所封装的上传组件,所用的是React技术栈。

C# winfrom中excel文件导入导出

在C#交流群里,看到很多小伙伴在excel数据导入导出到C#界面上存在疑惑,所以今天专门做了这个主题,希望大家有所收获!环境:win10+vs2017界面:主要以演示为主,所以没有做优化,然后主界面上添加两个按钮,分别命名为ExportExcel和ImportExcel,添加两个dataGridView,分别是dataGridView1和dataGridView2然后在窗体加载程序中给dataGr...

HTML5和CSS3强化知识总结

之前总结定位元素水平垂直居中时,top left均为50%,之后margin-top为-高度的一半,margin-left为-宽度的一半,即可实现,但这一旦改变盒子的宽高,也得改变marign值,故tranform:translate(-50%,-50%)很方便的避免了频繁改动数据的问题。利用阴影进行动画设置,先利用定位将阴影与圆点放置合适位置,用一个盒子将其包含,让阴影水平垂直居中放置在盒子中,此时圆点就会在阴影正中间,利用动画将阴影的宽高调大,之后每个阴影进行延迟即可。

利用jmeter完成简单的压力测试

做压力测试,一般要使用工具,人工是没办法做的。Jmeter用来做轻量级的压力测试,非常合适,只需要十几分钟,就能把压力测试需要的脚本写好。本文举的实例是:在一台电脑用Jmeter模拟200个用户,同时去使用bing搜索不同的关键字,查看页面返回的时间是否在正常范围内。首先我们把测试需要用到的2个参数放在txt文件中,新建一个data.txt文件,输入些数据,一行有两个数据,用逗号分隔。顾名思义:压力测试,就是 被测试的系统,在一定的访问压力下,看程序运行是否稳定/服务器运行是否稳定(资源占用情况)

npm淘宝镜像过期解决办法

因为npm 官方镜像(registry.npmjs.org)在国内访问很慢,我们基本上都会选择切换到国内的一些 npm 镜像(淘宝镜像、腾讯云镜像等)。由于淘宝原来的镜像(registry.npm.taobao.org)HTTPS 证书正式到期,因此需要切换到淘宝最新的镜像,否则会出现证书到期异常。

Web 安全之点击劫持(Clickjacking)攻击详解

点击劫持(Clickjacking)攻击,又称为界面伪装攻击,是一种利用视觉欺骗手段进行攻击的方式。攻击者通过技术手段欺骗用户点击本没有打算点击的位置,当用户在被攻击者攻击的页面上进行操作时,实际点击结果被劫持,从而被攻击者利用。这种攻击方式利用了用户对网站的信任,通过覆盖层(通常是透明的iframe)覆盖在另一个网页之上,使受害者无法察觉。

如何在html5中的canvas绘制文本自动换行?

​在固宽的 canvas 中,字数过多的时候,并不会自动换行,我们可以增加 canvas 本身的宽度,但这不是解决问题的根本方法。还记得之前介绍 canvas 基本 api 的时候,有一个函数,这个函数可以测量字体的宽高度,那就好办了,我们计算好我们字符串的长度加上一个大概的宽度,基本上可以处理这种换行的问题了。​,保存开始截取的最后的索引,当循环变量 i 为最后一个字符的时候,直接绘制剩余部分。​,如果大于 canvas 的宽度,就截取这部分进行绘制,然后重置​。

鸿蒙(ArkUI)开发:实现二级联动

列表的二级联动(Cascading List)是指根据一个列表(一级列表)的选择结果,来更新另一个列表(二级列表)的选项。这种联动可以使用户根据实际需求,快速定位到想要的选项,提高交互体验。例如,短视频中拍摄风格的选择、照片编辑时的场景的选择,本文即为大家介绍如何开发二级联动。

Vue和React的区别 | | React函数式写法和类写法的区别

React 更多的是一个库而不是框架,它更专注于视图层的管理,通过社区和第三方库来进行补充和扩展。类式组件: 类式组件是 ES6 中引入的 class 类的一种用法,它继承自 React.Component,拥有完整的生命周期和内部状态管理能力。它是无状态的,没有生命周期和内部状态。而在 React 中,我们使用 JSX 语法,它是一种 JavaScript 的扩展语法,可以在 JavaScript 中直接编写类似 HTML 的结构。在 React 中,我们可以定义组件的两种方式,即函数式组件和类式组件。

微信小程序 自定义组件和生命周期

类似vue或者react中的自定义组件⼩程序允许我们使⽤⾃定义组件的⽅式来构建⻚⾯。类似于页面,一个自定义组件由 json wxml wxss js 4个文件组成可以在微信开发者⼯具中快速创建组件的⽂件结构在⽂件夹内 components/myHeader ,创建组件 名为 myHeader⾸先要在⻚⾯的 json ⽂件中进⾏引⽤声明。还要提供对应的组件名和组件路径index.wxml// 引用声明// 要使用的组件的名称 // 组件的路径< view >

Promise和箭头函数和普通函数的区别

箭头函数与普通函数的区别在于: 1、箭头函数没有this,所以需要通过查找作用域链来确定this的值,这就意味着如果箭头函数被非箭头函数包含,this绑定的就是最近一层非箭头函数的this, 2、箭头函数没有自己的arguments对象,但是可以访问外围函数的arguments对象 3、不能通过new关键字调用,同样也没有new.target值和原型。6、箭头函数没有自己的arguments,可以在箭头函数中使用rest参数代替arguments对象,来访问箭头函数的参数列表。

HarmonyOS应用开发之DevEco Studio安装与初次使用

DevEco Studio是基于IntelliJ IDEA Community开源版本打造,面向华为终端全场景多设备的一站式集成开发环境(IDE),为开发者提供工程模板创建、开发、编译、调试、发布等E2E的HarmonyOS应用/服务的开发工具

React Query 实战教程:在 React 中如何优雅的管理接口数据状态?

如何通过Ajax或者Fetch优雅的请求后端接口,这是所有复杂前端项目都需要考虑处理的事情。在React项目中,有不少成熟的Hook能够让开发者管理整个请求过程中的数据和状态,例如use-httpswr甚至ahook中提供的useRequest。我曾经很长一段时间是直接使用ahook中的useRequest,但是有的项目中不需要ahook中的其他hook,我又不愿意仅仅为了使用useRequest而在项目中引入ahook。就像我第参与的一个前端项目中仅仅为了使用jquery的$.ajax而引入。

【Hadoop】YARN容量调度器详解

Hadoop YARN的核心组件是ResourceManager,负责集群资源管理与调度,而ResourceManager组件的核心是调度器,负责统筹集群资源,满足应用的资源需求。调度器不仅需要优化整个集群的资源布局,避免热点等问题对应用的影响,最大程度利用集群资源;还要能协调好大量应用在集群的运行,基于多租户(队列)公平性、应用优先级等策略解决好资源竞争等问题;也要能满足个别应用在节点依赖、放置策略等方面的特殊需求。_hadoop调度器详解

【Java 基础篇】Java多线程实现文件上传详解

本文介绍了如何使用Java多线程实现文件上传功能。通过将文件切割为多个块并使用多线程同时上传,可以提高文件上传的效率。同时,服务器端需要接收和重组这些块数据以还原原始文件。希望本文对您理解文件上传的原理以及如何实现多线程文件上传有所帮助。如果您有任何问题或疑问,请随时提出。

【Java 基础篇】Java网络编程:实现远程文件访问与管理

通过本文,我们深入探讨了如何使用Java实现远程文件访问与管理。我们讨论了建立与远程服务器的连接、文件上传与下载、列出远程目录、文件管理操作以及异常处理等关键方面。这些知识对于构建网络文件系统、文件共享应用程序以及需要进行远程文件操作的应用程序非常重要。希望本文对您理解和应用Java网络编程提供了有价值的信息。通过继续学习和实践,您可以更深入地探索这个领域,从而构建出更加复杂和功能丰富的网络应用程序。祝您编程愉快!

【Java 基础篇】Java网络编程实战:P2P文件共享详解

P2P(Peer-to-Peer)文件共享是一种分布式计算模型,其中每个计算机或设备都可以充当客户端和服务器。这意味着每台计算机都可以上传和下载文件,而不仅仅是从一个中心服务器获取文件。P2P文件共享有许多优势,包括更快的下载速度、更高的可用性和更好的容错性。P2P文件共享是一种强大的分布式文件共享模型,可以提供更快的下载速度和更好的可用性。通过使用Java网络编程,我们可以实现P2P文件共享,让不同的客户端之间可以方便地共享文件。

【Java 基础篇】Java网络编程:文件下载详解

文件下载是指从一个网络服务器或远程位置传输文件到本地计算机或设备的过程。这些文件可以是文本文件、图像、音频、视频或任何其他类型的数据文件。文件下载在Web浏览器、移动应用程序和桌面应用程序中都是常见的操作。在Java中,您可以使用各种网络协议(如HTTP、FTP、SFTP等)来执行文件下载操作。下面我们将以HTTP协议为例,介绍如何使用Java进行文件下载。本文介绍了如何使用Java进行文件下载,以及文件下载的一些进阶功能和注意事项。
返回
顶部