如何成為前端工程師?不會英文也可以當前端工程師!

前端工程師這個詞很常聽到,身邊朋友或者是上網查詢都會聽到「前端」、「web 前端」、「前端工程師」、「網頁工程師」…. 等等

大家想成為前端工程師不外乎就是薪水薪資高啊!!聽到都是月薪 4 萬以上,資深的可能還會到月薪 7、8 萬以上都有!

但在這之前,要先說明一下前端工程師是做什麼的…

前端工程師是什麼?

主要是負責軟體開發或網站用戶介面的開發,白話一點也可以說是寫程式做網頁,隨著網際網路的發展,在早期也稱作美工或 UI 開發,然而隨著網頁的用戶體驗要求越來越高,網頁的 UI 來越複雜,美工就又細分到設計與開發兩種崗位,當然設計又會分互動設計、視覺設計、動畫設計,而開發自然就是前端開發,主要是跟設計與後端開發人員一起協作。

不是相關科系畢業背景,轉職人生也可以成為前端工程師嗎?

答案是可以的!,在職場上的前端工程師,有很多背景都不是資訊相關科系畢業的,轉職的也很多,像是有的從金融業轉前端、有的是設計轉前端、有的是環境工程轉前端 …. 有太多的斜槓人都成功轉前端呢!

只要努力學習,每個職業都可以轉職成功前端工程師。

需要會哪些技能?

一張技能樹圖說明一切!!

六角學院製作,來源文章2017 前端開發者技能樹!
( 六角學院製作,來源文章 2017 前端開發者技能樹! )

但是,核心只有三個

如何成為前端工程師?
(HTML、JavaScript、CSS)

主要技能核心就是 HTML、CSS、JavaScript,這是網頁構成的三大要素

  • HTML (HyperText Markup Language):
    主要是負責把網頁結構生出來,所以看起來都是方方正正的不是那麼給觀
  • CSS (Cascading Style Sheets):
    主要就是把外貌呈現出來,讓網頁外貌更美觀些,例如顏色,框線、字距、行高等
  • JavaScript
    主要就是負責去控制網頁的內容讓網頁互動以及使用者的操作行為

當你逛網頁的時候,看到漂漂亮亮的網頁,比如圖片排版,互動或可點擊連結按鈕,這些畫面都是這三大要素所組成

所以基本上從這三個開始,就可以寫網頁了,之後再慢慢增進你的技能,看你的技能樹要從哪邊開始發展,再慢慢學習!後面還要知道怎麼串接 API、RWD、SASS、SCSS,跟修 Bug… 等等。

但開發後期要懂一些前端框架,如 React、Vue、Angualr … 等等,看到這裡,發現前端工程師要學習的東西太多,無論是否有一些基礎知識,還是零基礎,這些都沒關係,只要你想學,只要肯努力,相信你也會學得起來!

前端的工作內容是什麼?

建構網站

根據設計師設計出來的設計稿,用 HTML、JavaScript、CSS 架構出網站。

不僅要掌握基本的 Web 前端開發技術,網站性能SEO優化和伺服器端的基礎知識,而且要學會運用各種工具進行輔助開發以及理論層面的知識,包括代碼的可維護性、組件的易用性、分層語義模板和瀏覽器分級支持等。

對應各瀏覽器與裝置

網頁瀏覽器有很多,像是 Google Chrome、App Safari、Microsoft Internet Explorer、Mozilla Firefox、Opera…等等,每個瀏覽器的不同,它們的 CSS 各有屬性限制(也就是所謂的相容性),因此前端要依據各瀏覽器所採用的 CSS 也會有所不同,然而手機的 IOS 與 Android 更是不同的語法系統,所以前端工程師需要多熟悉框架及技能,才能確保網站及各類裝置觀看有良好的使用者體驗。

加速網頁的讀取速度

一個好的使用者體驗,當然也包括網頁讀取速度,要是開一個網頁需要等 3 到 5 秒,相信使用者早就點擊上一頁離開了,所以要優化程式碼提高網頁的效能,像是圖片的檔案大小、動畫、網頁的外掛、資料量的多寡都會影響到網頁速度,所以也要優化網站來減少使用者在瀏覽網頁時需等待的時間。

要學習到什麼程度才可以到就業水準?

分享一下六角學院解說的 YouTube 影片,會讓你有更多收穫。



前端技能好學嗎?

看到上面的技能樹圖,很多人都會怕學不起來,這麼多怎麼記得住,但是,現在的網頁設計越來越人性化,更加符合人們的審美需求,與其說是前端開發,其實更多的是幕後工作。

想成為優秀的前端工程師,需要你付出更多的時間跟經歷,如果你對寫網頁有興趣與熱誠,在學習的道路上會是很順利的,比較容易碰壁的是邏輯性與觀念性,但只要你邏輯思考可以,相信難不倒你!

要如何開始學習?

很多人都會好奇,工程師的英文是不是一定要很好才可以當工程師?其實不用,像我英文也不好,也是當上工程師,一切是從自學開始,網路上的文件與 Google 翻譯很方便,基本上會用 Google 翻譯查,基本上都不是問題的。

那如果還沒學過HTML,可以點我寫的內容介紹,初步認識什麼是 HTML,那也不知道要用什麼編輯器編輯的,也可以點我連結參考。以下我也提供三個線上課程讓你參考!


六角學院

它們是一所線上程式開發學習單位,目前已累積超過 20,000 名學員,裡面從淺到深的課程都有,課程專為無背景新手所設計。

課程觀念講解非常細緻清楚,循序漸進幫助學員快速上手,課程中藉由不斷提醒加深印象,並利用練習不同例子來熟悉如何使用Bootstrap 所提供之相關元件與核心概念。

六角學院提供一張學習地圖讓不知道從哪邊開始學習做參考。

如何成為前端工程師?
(六角學習地圖)

課程教學的詳細,講師有條理邏輯清晰!學到很多之前不知道的技巧。是一個不錯的線上課程平台!

語言:全中文


Udemy

Udemy 是線上的學習與教學市場,這裡有超過 100000 個課程以及 24 百萬名學生。您可以學習程式設計、行銷、資料科學與其他眾多知識。

如果你想成為網路工程師,或是身為網路工程師的人,總是需要不斷學習相關新技術,每一個課程都有 10 萬以上的註冊人數!由專家講師教授。備有各式各樣的課程供您選擇,包括 Python 和 JavaScript 等前端程式語言,或是設計等個人成長教學,可以讓職涯更上一層樓,同時發掘新愛好興趣。

語言:提供中文介面,部分為中文課程或支援中文字幕

hahow 好學校

提供最多元有趣的線上課程,並透過獨特的課程募資機制,讓熱愛自學與交換技能的你。在家就可以完成高效率的線上學習與成就,學那些學校不會教的事。

學習不需要理由,每個人心中都有小小的火花,只要照自己的步調輕鬆學,就有機會發掘自己不一樣的潛能與快樂來源!這就是他們想要推廣的東西。

語言:全中文

以上分享給大家 🙂

20 Replies to “如何成為前端工程師?不會英文也可以當前端工程師!”

  1. 現在正在經營部落格,之後也想朝網頁設計的方向前進,但很擔心自己學不會
    看了版主的文章感覺信心增倍!而且現在線上課程的資源這麼發達,只要有毅力一定可以學好的~

  2. Akay Hu 前輩好
    我也是前端設計師(3年),原本是後端工程師轉前端。
    看到您整理了這麼多的成為前端工程師的學習技能真的感觸很多,
    要學的東西真的太多了,學無止境,有機會我們多多交流~

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *