零基礎入門前端的修煉之道

 

本文是爲了給那些想要了解前端開發是什麼，或者剛剛打算開始學習前端的朋友們準備，但願能夠幫助準備入行的你;

 

總所周知，目前不管是企業仍是我的，都會有製做網站、博客、小程序等需求,他們但願把本身的產品或服務經過互聯網展現給更多用戶。在這種狀況下, 對於剛剛接觸這方面的新人來講，可能先須要瞭解一個網站的從零到有的製做過程會涉及哪些環節。

 

簡單的來講網站的誕生過程會經歷這些環節

策劃 > 設計 > 前端開發 > 後端開發 > 測試發佈

 

從這個流程來看,咱們的網站開發是一個系統工程,它需是多個環節之間緊密配合來去完成的，而「前端開發」這個環節處於整個系統工程的中間部位，起到承上啓下的核心做用，所以「前端開發工程師」這個職位愈來愈受到重視，接下來咱們先和你們詳細聊聊關於前端開發這些事。

前端開發是作什麼的

前端開發的興起

前端開發是從網頁製做演變而來的,在國內被你們所認知並接受是在 2005 年以後。在 2005 年以前,處於1.0 時代的 Web 並無「前端」這個概念,此時的網頁內容主要就是一些文字和圖片,用戶使用網站的行爲也以瀏覽爲主,這樣的網頁使用幾個網頁製做軟件,諸如 Photoshop+Dreamweaver+Flash 就能製做出來。因此Web1.0 時代的網頁開發也叫網頁製做、美工切圖；

 

 

2005 年以後,互聯網進入 Web2.0 時代,對網頁的開發要求愈來愈高,比起 1.0 時代,其開發難度加大,前端開發已經再也不是掌握幾個製做軟件就能夠作好的事了,它須要專業的工程師才能作好，網頁除了展現信息之外,還須要美觀的設計、炫酷的交互、良好的用戶體驗、複雜的業務邏輯處理、跨終端的適配兼容等，開發方式也有了本質改變，所以網頁開發再也不叫網頁製做，而是變成了前端開發。

 

 

前端開發的市場需求

隨着互聯網行業的發展，在這個處處都是講究「顏值」和用戶體驗的時代，「高顏值」以及能與用戶進行友好交互的網站會極大地吸引用戶，用戶會更加願意深刻地瞭解這樣的網站，也提升網站的用戶黏度。面對這些較高的要求，前端在開發環節中的做用也變得愈來愈重要；

 

於是近幾年來前端工程師備受青睞,通常水平的前端工程師平均年薪可達 10 萬元,資深前端工程師年薪高達 20~80 萬元。但就這樣的年薪,不少企業仍是很難找到合適的前端工程師；

 

 

從上述企業的招聘信息來看,前端行業的就業薪資是較爲可觀的。

那麼如何才能作好專業的前端開發呢?

就讓我在接下來的日子裏，爲你們分享下個人前端入門學習的修煉之道吧。

 

前端開發人員要具有如下能力

1. 複雜炫酷的頁面交互設計能力

在進行前端開發時,開發人員除了要將設計圖完美還原之外,還須要對交互效果進行編寫。當用戶打開頁面的時候,若是頁面風格新穎、交互炫酷,那他就會感受你的產品技術含量很高。相反若是頁面風格老舊、交互呆板,他就會以爲你的產品不行,不買你的帳。所以,前端開發工程師要具有設計複雜炫酷頁面的能力。

在鼠標懸停和移開時的不一樣效果,就體現了一種較爲炫酷的交互效果；

  

2. 良好的用戶體驗設計能力

用戶體驗是從用戶的角度出發,不只要把炫酷的視覺效果展示給用戶,還要從功能上讓用戶有所感知。例如當用戶註冊微博帳號時,電話號碼提供錯誤或者沒有輸入密碼,輸入框右側應有相應提示。這種用戶體驗的細節問題是否處理穩當,是判斷一名前端工程師是否優秀的因素。

  

3. 複雜的業務邏輯處理能力

如今的前端工程師不只要製做頁面,還須要配合服務端工程師一塊兒去實現某些功能。例如,微博的文章發佈、用戶搜索、評論留言等內容的開發,前端開發工程師對後端數據接收是否成功、搜索結果狀態以及評論留言是否合法等進行邏輯判斷處理。所以,前端開發工程師要具有處理複雜業務邏輯的能力。

用戶輸入數據不正確時顯示提示信息

    

4. 能處理跨終端的適配兼容問題

近年來,智能手機發展迅猛,幾乎人手一部,大街上隨處可見「低頭族」。隨着手機、平板電腦等不一樣移動終端的普及,愈來愈多的人喜歡移動辦公、移動學習、移動娛樂......人們常常會在不一樣的終端之間進行切換,所以,這就要求一個頁面能實現跨終端的適配兼容——即能在不一樣終端中正確顯示。

 

好比域名 www.miaov.com,在 PC 和移動端瀏覽器中的顯示如圖 1-6 所示,該示例給咱們展現了該域名跨終端適配兼容的其中一種狀況,這種適配兼容運用於網站內容比較複雜的狀況,經過後臺判斷,渲染不一樣模板進行輸出或跳轉；

 

還有一種狀況,就是各終端顯示的頁面內容徹底同樣,但頁面佈局等樣式會根據終端屏幕的大小進行自動切換,如圖所示就是響應式設計。響應式網頁開發主要是基於一套代碼來適配不一樣尺寸的終端,有關響應式網頁開發技術請閱讀本系列叢書的響應式開發。

 

綜上所述的，前端開發的工做主要是開發用戶操做界面,其中涉及的內容包括實現炫酷的頁面交互、提供良好的用戶體驗、配合服務端工程師處理複雜的業務邏輯和實現 Web 的跨終端適配兼容等，這些都是一個合格前端要掌握的必備技能； 

至此,咱們已經大體瞭解了前端開發究竟是作什麼的。如今的問題是如何成爲一名合格的前端開發工程師?怎樣才能將前端 開發的各項工做作好?要成爲專業的前端開發工程師、作好前端開發的各項工做,須要掌握哪些相關的技術呢? 

下一期我將就這些內容進行介紹

 

關注本訂閱號，觀看《零基礎入門前端的修煉之道》系列文章

公衆號ID：Miaovclass

關注妙味訂閱號：「妙味前端」，爲您帶來優質前端技術乾貨；