検索

1. 什么是前端 ?

就像一场足球比赛,有人做前锋,有的是中场战将,有的是后卫,有的是候补等等,每个人在不同的位置上都做着不同的事,最终完成一场完美的比赛,前端在这里有点类似前锋,它需要将球最后临门一脚射到球门里。

前端它是一个工作,它的工作领域是浏览器,它即要跟美工、设计打交道又要懂点后台代码,知道ajax怎么从后台拿数据,接口怎么调用,最主要的是把美工的图合成完成的网页呈现在用户面前,需要实现网页的交互效果。

前端处于设计与后台的中间领域,起到承上启下的作用,这也要求前端工程师的知识面在横向上必须要广。服务器技术要懂,产品与交互也要懂。

它需要掌握三个基本的技能:HTML,CSS, javascript。另外还需要懂点PHP或者其他应用在Web上的编程语言。

前端工作师主要面向用户、浏览器、数据接口。

2. 前端工程师的价值主要体现在哪里?

(1)让用户更便捷的获取信息。拿到psd,产出线上的代码,中间有很多细节需要去认真对待。表单的各种交互,页面的不同元素(区域)间的信息交互,都需要依靠自己的技术能力和自己对用户的感知去完成。

(2)让前端更加规范和标准。不断看各种规范,比较不同版本的区别,并思考引入的新特性的意义(技术或商业)。关注这个行业的最新发展,找出创新点,把自己对问题或bug的解决思路或方案总结并分享,为自己的公司、同行以及整个行业贡献自己的力量,推动前端的发展。

深入学习前端,需要做很多,前端各类库与框架的架构设计,w3c各种标准的深入研究,对于javascript语言本身的研究,对浏览器的原理分析,对于网络传输协议的原理分析等等。

3. 需要掌握的技能?

(1)解决浏览器兼容问题。前端需要懂得至少三种浏览器内核的接口,还要面对各种莫名其妙的bug,前端的技术也是日新月异,css3的规范标准什么时候确定还是未知。

(2)横向技能面要广。懂交互设计,懂视觉设计,略懂后台技术,精通http协议,linux操作,shell, vim, git, svn;至少熟练一门后端语言(java, c++, php, python),至少使用过一个MVC开发框架,还有前端的各种开源项目(jquery, requirejs, seajs, bootstrap, yui…);要灵活运用“面向对象”,“面向过程”,“函数式”的编程方法;还要懂设计模式,富客户端应用的常用架构模式。

(3)纵向技能要深。js, css, html5, css3…

(4)关注用户体验,懂得交互设计。帮忙产品经理和交互设计师校验错误是前端工程师的义务和责任。作为页面的实现者,如果不能提前预测出可能存在的问题,后期的错误会越来越多。

4. 应该具备怎样的知识结构?

368e85f1a418d0ade07041dc13a2edb6_r

d96bcca74b4d4a010c3b17366685cc18_r

图片地址:http://www.zhihu.com/question/19588629

 

5. 前端在研发团队的位置?

比较理想的情况是,前端的输入依然是psd稿,如果产品和设计能力不够,还可能需要前端参与交互设计。输出则是一个可以工作的模块或页面。前端直接从服务器模板(php, jsp)开始工作,前后端同学在开始工作前写好页面应该用的变量以及ajax通信的接口,随后独立开发,最后连调测试。这种开始方式,前端可以根据接口和数据结构来设计页面的html结构和css结构,把冗余工作降到最低。这样会让前端发挥更大的主观能动性,也可以让后台更加关注底层算法与数据存储于通信的逻辑。

6. 前端工程师的未来?

前端工程师一般讲有三条路可走,一条向前走,一条向后走,一条一直做前端,深入下去。向前就是往用户体验与交互设计甚至产品设计师上走,这最能体验前端价值,即用户体验。向后走是做web开发,往数据库和后台开始方向走,不再区分前后端,大家深入产品的研发实现,这条路就是与软件工程师融合的路,这时的价值就体现在业务功能的实现上。最后就是一直深入做前端开发,对各种前端类库框架的架构设计,对浏览器原理的研究和js的研究,对网络传输协议原理分析等等,这条路因为要涉及很多原理与根本性的东西,走的人也不是很多。

前端的未来则是:有越来越多的软件开始在浏览器里运行,随着google和火狐的webos的发展,甚至在不久的将来,浏览器的api,会替代操作系统的sdk成为软件开发的标准。随着html5的发展,浏览器里运行的早已不是简单的页面,而是复杂的web应用。前端工程师也早已不是页面制作,而是web应用工程师。而未来究竟是web时代还是app时代仍是一个难以回答的问题。

 

参考:http://blog.tianya.cn/post-5620717-83777702-1.shtml

http://kingzs70.sinaapp.com/2013/05/11/my_view_on_the_career_development_of_web_front_end

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
公式アカウントのキャッシュの更新の難しさ:バージョンの更新後のユーザーエクスペリエンスに影響を与える古いキャッシュを回避する方法は?公式アカウントのキャッシュの更新の難しさ:バージョンの更新後のユーザーエクスペリエンスに影響を与える古いキャッシュを回避する方法は?Mar 04, 2025 pm 12:32 PM

公式アカウントのWebページはキャッシュを更新します。これはシンプルでシンプルで、ポットを飲むのに十分な複雑です。あなたは公式のアカウントの記事を更新するために一生懸命働きましたが、ユーザーはまだ古いバージョンを開くことができますか?この記事では、この背後にあるtwist余曲折と、この問題を優雅に解決する方法を見てみましょう。それを読んだ後、さまざまなキャッシュの問題に簡単に対処でき、ユーザーが常に新鮮なコンテンツを体験できるようになります。最初に基本について話しましょう。それを率直に言うと、アクセス速度を向上させるために、ブラウザまたはサーバーはいくつかの静的リソース(写真、CSS、JSなど)やページコンテンツを保存します。次回アクセスするときは、もう一度ダウンロードすることなく、キャッシュから直接検索できます。自然に高速です。しかし、このことは両刃の剣でもあります。新しいバージョンはオンラインです、

HTML5フォーム検証属性を使用してユーザー入力を検証するにはどうすればよいですか?HTML5フォーム検証属性を使用してユーザー入力を検証するにはどうすればよいですか?Mar 17, 2025 pm 12:27 PM

この記事では、ブラウザのユーザー入力を直接検証するために、必要、パターン、MIN、MAX、および長さの制限などのHTML5フォーム検証属性を使用して説明します。

HTML5のクロスブラウザー互換性のベストプラクティスは何ですか?HTML5のクロスブラウザー互換性のベストプラクティスは何ですか?Mar 17, 2025 pm 12:20 PM

記事では、HTML5クロスブラウザーの互換性を確保するためのベストプラクティスについて説明し、機能検出、プログレッシブエンハンスメント、およびテスト方法に焦点を当てています。

WebページのPNG画像にストローク効果を効率的に追加する方法は?WebページのPNG画像にストローク効果を効率的に追加する方法は?Mar 04, 2025 pm 02:39 PM

この記事では、CSSを使用したWebページへの効率的なPNG境界追加を示しています。 CSSはJavaScriptやライブラリと比較して優れたパフォーマンスを提供し、微妙または顕著な効果のために境界幅、スタイル、色を調整する方法を詳述していると主張しています

< datalist>の目的は何ですか 要素?< datalist>の目的は何ですか 要素?Mar 21, 2025 pm 12:33 PM

この記事では、HTML< Datalist>について説明します。オートコンプリートの提案を提供し、ユーザーエクスペリエンスの改善、エラーの削減によりフォームを強化する要素。

< meter>の目的は何ですか 要素?< meter>の目的は何ですか 要素?Mar 21, 2025 pm 12:35 PM

この記事では、html< meter>について説明します。要素は、範囲内でスカラーまたは分数値を表示するために使用され、Web開発におけるその一般的なアプリケーション。それは差別化< Meter> < Progress>およびex

HTML5< time>を使用するにはどうすればよいですか 日付と時刻を意味的に表す要素?HTML5< time>を使用するにはどうすればよいですか 日付と時刻を意味的に表す要素?Mar 12, 2025 pm 04:05 PM

この記事では、html5< time>について説明します。セマンティックデート/時刻表現の要素。 人間の読み取り可能なテキストとともに、マシンの読みやすさ(ISO 8601形式)のDateTime属性の重要性を強調し、Accessibilitを増やします

< Progress>の目的は何ですか 要素?< Progress>の目的は何ですか 要素?Mar 21, 2025 pm 12:34 PM

この記事では、HTML< Progress>について説明します。要素、その目的、スタイリング、および< meter>との違い要素。主な焦点は、< Progress>を使用することです。タスクの完了と< Meter> statiの場合

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser は、オンライン試験を安全に受験するための安全なブラウザ環境です。このソフトウェアは、あらゆるコンピュータを安全なワークステーションに変えます。あらゆるユーティリティへのアクセスを制御し、学生が無許可のリソースを使用するのを防ぎます。

DVWA

DVWA

Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、

SublimeText3 英語版

SublimeText3 英語版

推奨: Win バージョン、コードプロンプトをサポート!

EditPlus 中国語クラック版

EditPlus 中国語クラック版

サイズが小さく、構文の強調表示、コード プロンプト機能はサポートされていません

SublimeText3 Linux 新バージョン

SublimeText3 Linux 新バージョン

SublimeText3 Linux 最新バージョン