Web前端開發(fā)職業(yè)技術(shù)要求規(guī)劃

親愛的朋友們：

大家好，我是演講者-達(dá)達(dá)前端，也可以叫我 Jeskson !

今天，我演講的題目是《Web前端開發(fā)職業(yè)技術(shù)要求規(guī)劃》。這個(gè)世界有很多不平凡的人，也有更多平凡的人，你是屬于哪一種呢？

我曾經(jīng)即當(dāng)過學(xué)霸也當(dāng)過學(xué)渣，從小不愛學(xué)習(xí)的我，每一科成績(jī)都不及格，成天和朋友們出去玩耍，然而是什么時(shí)候開始轉(zhuǎn)變成為學(xué)霸的呢？那就是我的父親教我數(shù)學(xué)的那一刻起，我的學(xué)習(xí)突飛猛進(jìn)，在班里每次考試不是第一就是第二，再也不用老師教我數(shù)學(xué)了，哈哈哈！?。?/p>

我當(dāng)時(shí)坐在倒數(shù)第二排的邊邊角角的位置，那絕對(duì)是“愛玩耍，愛講話”的風(fēng)水寶地，天天拉著前面的女同學(xué)愉快的交流起來，當(dāng)時(shí)的成績(jī)可想而知，這樣的小子一定是成績(jī)很差的（但是當(dāng)時(shí)成績(jī)也不算低啦，考低了還是怕被父母湊的），從父親教我學(xué)習(xí)開始，第一次的第一也許會(huì)讓老師感到這小子有點(diǎn)6哦，不過接二連三的數(shù)學(xué)成績(jī)第一名讓老師對(duì)我充滿信心，上課每次的最后一道大題都是叫我上去做，然后我分分鐘做完的那種。

你們知道是什么改變我的學(xué)習(xí)成績(jī)嗎？你們可以猜猜~

是的，因?yàn)槲腋赣H手把手教我學(xué)習(xí)，做練習(xí)題，教我解題思路。當(dāng)時(shí)只是一本數(shù)學(xué)練習(xí)題，做完后，我的數(shù)學(xué)都會(huì)了。我相信每一個(gè)人都是一樣的，大家的頭腦其實(shí)都是一樣的，只要努力你也能成為你想要的人。

目前，我是一位編程開發(fā)人員，專注于Web前端開發(fā)，每天大量的時(shí)間投入到學(xué)習(xí)中去，請(qǐng)大家記住一句話：永遠(yuǎn)不要拿年齡與時(shí)間來當(dāng)借口，當(dāng)你想成長(zhǎng)的時(shí)候，當(dāng)下就是最好的年齡，時(shí)間永遠(yuǎn)都能抽出來。

接下來，我將展開對(duì)Web前端開發(fā)職業(yè)技術(shù)要求規(guī)劃主題內(nèi)容講解。

首先說說web開發(fā)前景怎樣？據(jù)我所知，目前web前端工程師的年薪待遇平均在10萬以上，高級(jí)HTML前端工程師年薪達(dá)30—50萬，很多企業(yè)對(duì)于與web前端相關(guān)的技術(shù)職位更是求賢若渴。

Web前端開發(fā)工程師，是從事Web前端開發(fā)工作的工程師。主要進(jìn)行網(wǎng)站的開發(fā)、優(yōu)化、完善的工作。不得不說，web前端開發(fā)工程師的“黃金時(shí)代”正在走來。Web前端開發(fā)技術(shù)包括三個(gè)要素：HTML, CSS, JavaScript，隨著RIA的流行和普及，XML、Flash/Flex、Silverlight和服務(wù)器端語言也是前端開發(fā)人員應(yīng)該掌握的。

下面我將從第一部分入手，說說：web前端開發(fā)簡(jiǎn)介，web開發(fā)過程，web前端開發(fā)職業(yè)技能。

那么什么是web呢？Web是萬維網(wǎng)（World Wide Web）亦作“Web”“WWW”“‘W3’，是一個(gè)由許多互相鏈接的超文本組成的系統(tǒng)，通過互聯(lián)網(wǎng)訪問。

而web開發(fā)目前主要分為前端和后端兩部分，后端指的是程序、數(shù)據(jù)庫和服務(wù)器層面的開發(fā)，而前端指的是直接與用戶接觸的網(wǎng)頁，網(wǎng)頁上通常有HTML、CSS、JavaScript等內(nèi)容。

我們常常用到的瀏覽器，你們知道作用是什么嗎？是的，它是用于顯示網(wǎng)頁內(nèi)容，并讓用戶與這些文件交互的一種軟件。而我們常用到的瀏覽器有如下：IE、谷歌瀏覽器（Chrome）、火狐（Firefox），一般人很難理解什么是Web服務(wù)器？但是它其實(shí)就是一部提供Web服務(wù)的計(jì)算機(jī)。

當(dāng)我們?cè)跒g覽器輸入的地址，其實(shí)是叫URL，如下即是它的格式：

URL的一般格式如下：
協(xié)議://主機(jī)地址（IP地址）+目錄路徑+參數(shù)

通過地址輸入到瀏覽器地址欄中， 我們就能上網(wǎng)，查找我們想要的學(xué)習(xí)內(nèi)容，這部分看到的大都是來源于我們前端開發(fā)程序員。

接下來我們了解一些網(wǎng)絡(luò)應(yīng)用程序架構(gòu)：分 B/S架構(gòu)（Browser/Server） 和 ?C/S架構(gòu)(Client/Server)

B/S架構(gòu)（Browser/Server）的特點(diǎn)有：

無需安裝特定客戶端程序，通過URL訪問；跨平臺(tái)能力（Windows、Linux、Android、IOS…）；無縫升級(jí)，客戶端免維護(hù)；不能直接使用客戶端硬件資源，用戶體驗(yàn)單一。

而 C/S架構(gòu)(Client/Server) 的特點(diǎn)有：需要安裝特定客戶端程序；針對(duì)不同平臺(tái)開發(fā)不同版本；升級(jí)應(yīng)用須重新安裝；充分應(yīng)用客戶端硬件資源，構(gòu)建大型3D效果應(yīng)用。

了解了應(yīng)用程序結(jié)構(gòu)，讓我們了解一下，web開發(fā)過程：

如圖，我們可以清晰了解web開發(fā)過程：

了解其開發(fā)過程中，所需的內(nèi)容人員團(tuán)隊(duì)：

作為一名合格的前端開發(fā)，我們需要掌握其職業(yè)技能：

由圖要知道第一，職業(yè)技能定義是：利用HTML、CSS、JavaScript、網(wǎng)頁開發(fā)框架等專業(yè)知識(shí)、方法和工具將產(chǎn)品UI設(shè)計(jì)稿實(shí)現(xiàn)成網(wǎng)站的技能。

第二，職業(yè)技能特征是：具有較強(qiáng)的邏輯思維能力，擁有良好的編寫代碼習(xí)慣，溝通能力強(qiáng)，具有運(yùn)用色彩搭配、點(diǎn)線面布局來設(shè)計(jì)較好用戶體驗(yàn)網(wǎng)站頁面的能力。

需要充分考慮到了 Web 前端開發(fā)從業(yè)人員的職業(yè)發(fā)展路徑與成長(zhǎng)路徑，以職業(yè)素養(yǎng)、職業(yè)技能、知識(shí)水平為主要框架結(jié)構(gòu)，設(shè)計(jì)了 HTML 基礎(chǔ)及 HTML5 標(biāo)簽、CSS 及 CSS3 應(yīng)用、JavaScript基本語法與高級(jí)編程、ES6 標(biāo)準(zhǔn)、數(shù)據(jù)庫應(yīng)用、項(xiàng)目模塊化開發(fā)、各種復(fù)雜的交互與優(yōu)化等知識(shí)和能力等模塊。面向的主要崗位包括網(wǎng)頁設(shè)計(jì)、網(wǎng)頁制作、響應(yīng)式頁面搭建、移動(dòng)網(wǎng)頁制作與設(shè)計(jì)、網(wǎng)站搭建（門戶（行業(yè)）網(wǎng)站、交易類網(wǎng)站、企事業(yè)網(wǎng)站、娛樂性質(zhì)網(wǎng)站）、網(wǎng)站規(guī)劃與設(shè)計(jì)等。

所以，我們需要有自己的職業(yè)規(guī)劃：

第二部分說要闡述的是前端開發(fā)規(guī)劃

其發(fā)展路線為：Web 初級(jí)前端開發(fā)工程師 ，Web 中級(jí)前端開發(fā)工程師 ，Web 高級(jí)前端開發(fā)工程師，這三部分。

那么說說Web頁面制作基礎(chǔ)需要掌握內(nèi)容：

第一，（了解）Web簡(jiǎn)介

第二，掌握HTML語法基礎(chǔ)

第三，HTML文本圖像元素（掌握、應(yīng)用）

第四，HTML表單表格元素（掌握、應(yīng)用）

第五，HTML超鏈接元素（掌握、應(yīng)用）

第六，CSS基礎(chǔ)（了解）

第七，CSS樣式修飾（掌握、應(yīng)用）

第八，CSS盒子模型（掌握）

第九，CSS布局（掌握、應(yīng)用）

對(duì)于要掌握的JavaScript程序設(shè)計(jì)：

1.JavaScript語法基礎(chǔ)（掌握）

2.分支、循環(huán)語句（掌握）

3.函數(shù)（掌握、應(yīng)用）

4.數(shù)組、字符串（掌握）

5.正則表達(dá)式（掌握）

6.對(duì)象（掌握、應(yīng)用）

7.BOM對(duì)象（掌握）

8.DOM對(duì)象（掌握、應(yīng)用）

9.JavaScript事件處理（掌握、應(yīng)用）

對(duì)于HTML5和CSS3開發(fā)基礎(chǔ)與應(yīng)用的掌握：

1.HTML5簡(jiǎn)介（了解）

2.HTML5新增元素（掌握、應(yīng)用）

3.表單控件新增屬性（掌握、應(yīng)用）

4.CSS3新增選擇器（掌握、應(yīng)用）

5.CSS3新增屬性（掌握、應(yīng)用）

對(duì)于輕量級(jí)框架開發(fā)應(yīng)用的掌握：

1.JQuery框架概述（了解）

2.JQuery選擇器（掌握、應(yīng)用）

3.JQuery中的DOM操作（掌握、應(yīng)用）

4.JQuery事件（掌握、應(yīng)用）

5.JQurey效果（掌握、應(yīng)用）

6.JQuery Ajax（掌握、應(yīng)用）

下面給出案例，可以學(xué)習(xí)做做試試：

案例重點(diǎn)要求：

100%實(shí)現(xiàn)UI效果圖。HTML結(jié)構(gòu)清晰，標(biāo)簽使用盡量做到語義話。根據(jù)功能劃分功能模塊，便于日后調(diào)整頁面內(nèi)容。按照標(biāo)準(zhǔn)網(wǎng)站構(gòu)建目錄，做到CSS、HTML、圖片分離。

當(dāng)我們來到中級(jí)時(shí)，所需掌握：

1.深入淺出MySQL數(shù)據(jù)庫：MySQL概念（了解），MySQL安裝（掌握），MySQL范式（掌握），MySQL表結(jié)構(gòu)管理（掌握、應(yīng)用），MySQL用戶管理（掌握、應(yīng)用），MySQL基本語法（掌握、應(yīng)用），MySQL事務(wù)管理（掌握），MySQL視圖（掌握），MySQL索引（掌握），MySQL分區(qū)（掌握），MySQL觸發(fā)器（掌握、應(yīng)用），MySQL存儲(chǔ)過程（掌握、應(yīng)用），MySQL數(shù)據(jù)備份與恢復(fù)（掌握）

2.PHP技術(shù)與應(yīng)用：PHP概述與工作原理（了解），PHP環(huán)境搭建與安裝（掌握），PHP語言基礎(chǔ)（掌握），PHP操作函數(shù)（掌握、應(yīng)用），PHP圖形圖像處理（掌握），PHP文件系統(tǒng)處理（掌握），PHP面向?qū)ο蟪绦蛟O(shè)計(jì)（掌握），PHP操作數(shù)據(jù)庫（掌握、應(yīng)用），PHP Web開發(fā)框架-Laravel（掌握）

3.Web前后端交互技術(shù)：WEB概述（了解），HTTP協(xié)議（掌握），Ajax（掌握、應(yīng)用），Iframe（掌握、應(yīng)用）等

4.響應(yīng)式開發(fā)技術(shù)：Bootstrap等。

可以做一做案例：

來到了高級(jí)，這就是最重要的了。

如圖要掌握內(nèi)容：

1.WEB前端框架簡(jiǎn)介及VUE簡(jiǎn)介（了解）

2.VUE基礎(chǔ)知識(shí)（掌握、應(yīng)用）

3.VUE組件（掌握、應(yīng)用）

4.VUE工程化工具（掌握）

5.VUE路由（掌握、應(yīng)用）

6.VUE狀態(tài)管理（掌握、應(yīng)用）

7.UI庫（掌握、應(yīng)用）等

我們也可以做做案例：

以上就是我本次所演講的內(nèi)容，謝謝各位觀看，如需ppt內(nèi)容，以及不了解的內(nèi)容，可私下與我聯(lián)系，謝謝！??！