無經驗轉職前端工程師 - 工程師

By Ida
at 2017-01-29T19:21
at 2017-01-29T19:21
Table of Contents
※ [本文轉錄自 Soft_Job 看板 #1OZ3BkOn ]
作者: Titus (天和) 看板: Soft_Job
標題: [心得] 無經驗轉職前端工程師
時間: Sat Jan 28 13:58:03 2017
說明一下小弟的背景與結論
國立經濟系學士畢業、在旅遊業當業務兩年半,
自學 HTML、CSS、jQuery、Ruby on rails 半年(有買線上教材),
目前面試:6家
Offer: 2個 (28~32k 目標是35左右,努力中)
---------------------------------分隔線----------------------------------
會寫這篇文章主要是分享自己的轉職心路歷程,
以及覺得這是一條「沒有這麼困難、大家都能嘗試」的一條路,
走在轉職的道路上,也受過許多人的幫忙,
希望透過ptt的分享,分享自己的幸運。
文章會寫得比較長一點,分成:
一、「最基礎」前端工程師的技能(以能找到第一份工程師正職工作為目標)
二、學習資源與順序安排(中文、英文,免費與付費)
三、求職心態、策略與未來的路
----
一、「最基礎」前端工程師的技能
實際求職、跟許多前輩聊了以後,大家對「前端工程師」的定義差異很大,
兩者的差異大概有狗跟熱狗的差異這麼大。
有些人認為一個「合格」的前端工程師要熟悉 Angular、React 其一,
要懂得怎麼做前後端分離、開API、用webpeck打包...
但市場上也有一些工作,是只要會用HTML、CSS、bootstrap(寫得出想要的畫面),
會使用jQuery,一點點javascript、ajax,也能成為一個前端工程師。
而小弟第一份目標的工作等級是放在後者,
也就是能使用HTML、CSS與CSS框架如bootstrap,
搭配jQuery做動畫、用ajax要資料與存資料的工作。
會用HTML的定義:
知道怎麼做切版、怎麼為「使用bootstrap」鋪路
form tag的操作,會打出什麼request
會用CSS的定義:
1.懂排版(display、position、z-index、box-model)
2.懂權重、selector
3.懂pseudo element
會使用jQuery:
念過一本jQuery書從頭到尾(我是念 the missing manual https://goo.gl/IhvGYX )
二、
現在線上的課程很多,如以下:
免費課程:
codecademy、Udacity、learn to code(還不錯但我沒念完QQ 後來還是念中文的)
付費課程:
treehouse、Udemy、網頁十五天
我自己的學習路徑是:
codecademy >> treehouse >> Udemy >> 網頁15天 + Rails 101 + ihower實戰聖經
(除了codecademy、rails101、ihower實戰勝經以外都是付費的)
會想選擇付費課程的原因很簡單,
我希望可以用比較快的速度把「找到第一份工作最低標準」的東西學起來,
二來付了錢比較有動力(壓力)
1. codecademy https://goo.gl/gorvx8(15個小時)
算是初期的嘗試,HTML CSS的課程有全部跑完,
也確定自己不排斥「與機器溝通」,可以再投入更多的資源
2. treehouse https://goo.gl/sxTgo1(5個小時)
有聽朋友推薦treehouse是學HTML CSS的好線上教材,
使用free trail以後覺得真的很普通,甚至我會給負評。
原因有兩點:
第一點是整個學習沒有架構,只是把HTML、CSS在MDN上面可以查到的東西講一次,
但其實看完、寫完一點點練習題,馬上就會忘記。
第二就是老師教學的習慣,常常一次改動很多HTML屬性和CSS值,然後才看畫面,
不注意就會不知道畫面的更動是因為修改了哪一個地方、因此有新的改變
所以在free trail還沒結束我就果斷放棄,畢竟時間很重要。
3. Udemy https://goo.gl/sOoDz4(15個小時)
在treehouse之後,我有想是否要改上中文線上課程會比較合適,
因此在Udemy上面嘗試了一門HTML CSS的課程,覺得效果還好。
4. 網頁基礎十五天 https://goo.gl/nWMg28(300個小時)
這和ihower實戰聖經是我主要轉職的的學習工具,當初會認識這個課程,
是在youtube上面找bootstrap教材的時候有看到 free trail 的影片,
避免廣告嫌疑就不多談,比較之後比Udemy上的六角學院適合我,
加上某天腦波弱覺得自己學習速度太慢,想要加速就付費了,最後沒有後悔,很推薦。
最近也有個似乎是前端大大也開了一套bootstrap課程,
想花錢購買課程的可以多方比較、找到適合自己的課程。
後端的部分:
1. Rails 101 https://goo.gl/BM710y
2. iHower實戰聖經 https://goo.gl/yMv3gW
大家可能會覺得說:「為什麼一個立志當前端工程師的人要學Rails?」
某次和朋友聚會的時候,和幾個工程師朋友請教「什麼是一個合格的前端」,
就像前面說的,大家的定義真的是從狗到熱狗都有,
但其中一個後端工程師朋友說:
「只懂HTML CSS的叫做視覺設計,沒辦法跟我溝通API、完全不懂request到response之間
發生什麼事情的前端工程師,在我們公司連實習都拿不到。」
因此,在把HTML CSS jQuery念到一個基礎,開始做大量實作時,
我同步也開始「貼」Rails 101的code,以及翻ihower實戰聖經,
去感受「丟資料到後端、把資料存進資料庫、從資料庫拿資料出來」的感覺
最終的作品有包含一點透過 jQuery ajax去跟 rails的後端做溝通的功能(CRUD)
也是我面試的時候,部分面試官覺得我「勉強還算是個工程師」的點。
三、求職心態、策略與未來的路
1.心態面:
「被拒絕是應該、被洗臉是正常,清楚知道自己的目標、展現自己最好的一面」
坦白講我覺得我自己最幸運的部分,
就是身邊有認識兩三個網頁工程師的好朋友,
在我覺得自己什麼都不是的時候,告訴我工程師的人力市場狀況,
當我被其中一家老闆酸說:「你零經驗,讓你實習三個月看情況,一個月15k」
在我差點要接受的時候,告訴我我值得更好的機會。
2.策略面:
「有看到機會就投、有面試就去,一切以拿到offer再說」
我的最後一個作品是我朋友接了一個小案子,兩人一起合作(rails)
我意識到真的和有點經驗的人一起工作有許多好處,
例如一些光怪陸離的寫法才會消失
(被唸說這樣寫沒人看得懂..現在自己也越來越看不懂 囧)
或是一些既有的工作flow,也幫助我在面試的時候不至於被當「搞不懂狀況的人」
(合作開發時我學會使用git、github、trello跟github flow)
加深了我「無論如何,找到一個正職的工作,實際工作中才會養出更強的實力」的想法
3.未來面:
也曾經被身邊的朋友揶揄說:
「你貓大經濟畢業,為什麼不去銀行、券商?寫HTML、CSS不是很簡單的嗎?不是要用
再查就好的東西嗎?寫那個有未來嗎?你又不是資工系的,你有競爭力嗎?....」
我心裡非常清楚,我心中「前端工程師」的定義是最前面提到:
「熟悉Angular、React其一、懂nodejs、會規劃API、用webpack打包...」
那是對自己的期許,但知道自己的現況就是零開始。
也曾經想過是不是要參加bootcamp(alpha camp或是資策會),但因為經濟因素而作罷。
最後我的做法是,先讓自己成為求職市場上的「前端工程師」(無論內容做什麼)
工作的期間,期許自己可以將HTML、CSS、jQuery熟悉外,更懂得瀏覽器的運作,
更懂得整個「從request到response之間到底發生什麼事情」了解得更透徹,
學習javascript、能用javascript解leetcode,到能夠熟練angular或react
「人們常常高估短期能做到的事情、但低估長期能做到的事情」
如果我逼迫自己半年內要成為「心中認定的前端工程師」,我只會得到滿滿的挫折,
但,我可以一步一步往「心中認定的前端工程師」前進。
而會發這篇文章,是因為自己達到了自己設定的第一個里程碑
「在求職市場上找到前端工程師的工作」
雖然比預期的時間晚了一點,
原本希望年前可以確定offer並發面試心得文+轉職心得,
但作品集晚了一點做完、面試的公司並不夠多、且還沒有拿到心儀的Offer,
因此,面試的具體內容、要注意哪些事項,
等工作有著落後,會再分享給大家。
祝大家雞年行大運
有想要轉職的朋友可以順利成功
有一樣是零經驗想轉職網頁工程師的朋友,也可以找我聊聊,
我可以分享一些微薄的經驗給你們 :D
--
作者: Titus (天和) 看板: Soft_Job
標題: [心得] 無經驗轉職前端工程師
時間: Sat Jan 28 13:58:03 2017
說明一下小弟的背景與結論
國立經濟系學士畢業、在旅遊業當業務兩年半,
自學 HTML、CSS、jQuery、Ruby on rails 半年(有買線上教材),
目前面試:6家
Offer: 2個 (28~32k 目標是35左右,努力中)
---------------------------------分隔線----------------------------------
會寫這篇文章主要是分享自己的轉職心路歷程,
以及覺得這是一條「沒有這麼困難、大家都能嘗試」的一條路,
走在轉職的道路上,也受過許多人的幫忙,
希望透過ptt的分享,分享自己的幸運。
文章會寫得比較長一點,分成:
一、「最基礎」前端工程師的技能(以能找到第一份工程師正職工作為目標)
二、學習資源與順序安排(中文、英文,免費與付費)
三、求職心態、策略與未來的路
----
一、「最基礎」前端工程師的技能
實際求職、跟許多前輩聊了以後,大家對「前端工程師」的定義差異很大,
兩者的差異大概有狗跟熱狗的差異這麼大。
有些人認為一個「合格」的前端工程師要熟悉 Angular、React 其一,
要懂得怎麼做前後端分離、開API、用webpeck打包...
但市場上也有一些工作,是只要會用HTML、CSS、bootstrap(寫得出想要的畫面),
會使用jQuery,一點點javascript、ajax,也能成為一個前端工程師。
而小弟第一份目標的工作等級是放在後者,
也就是能使用HTML、CSS與CSS框架如bootstrap,
搭配jQuery做動畫、用ajax要資料與存資料的工作。
會用HTML的定義:
知道怎麼做切版、怎麼為「使用bootstrap」鋪路
form tag的操作,會打出什麼request
會用CSS的定義:
1.懂排版(display、position、z-index、box-model)
2.懂權重、selector
3.懂pseudo element
會使用jQuery:
念過一本jQuery書從頭到尾(我是念 the missing manual https://goo.gl/IhvGYX )
二、
現在線上的課程很多,如以下:
免費課程:
codecademy、Udacity、learn to code(還不錯但我沒念完QQ 後來還是念中文的)
付費課程:
treehouse、Udemy、網頁十五天
我自己的學習路徑是:
codecademy >> treehouse >> Udemy >> 網頁15天 + Rails 101 + ihower實戰聖經
(除了codecademy、rails101、ihower實戰勝經以外都是付費的)
會想選擇付費課程的原因很簡單,
我希望可以用比較快的速度把「找到第一份工作最低標準」的東西學起來,
二來付了錢比較有動力(壓力)
1. codecademy https://goo.gl/gorvx8(15個小時)
算是初期的嘗試,HTML CSS的課程有全部跑完,
也確定自己不排斥「與機器溝通」,可以再投入更多的資源
2. treehouse https://goo.gl/sxTgo1(5個小時)
有聽朋友推薦treehouse是學HTML CSS的好線上教材,
使用free trail以後覺得真的很普通,甚至我會給負評。
原因有兩點:
第一點是整個學習沒有架構,只是把HTML、CSS在MDN上面可以查到的東西講一次,
但其實看完、寫完一點點練習題,馬上就會忘記。
第二就是老師教學的習慣,常常一次改動很多HTML屬性和CSS值,然後才看畫面,
不注意就會不知道畫面的更動是因為修改了哪一個地方、因此有新的改變
所以在free trail還沒結束我就果斷放棄,畢竟時間很重要。
3. Udemy https://goo.gl/sOoDz4(15個小時)
在treehouse之後,我有想是否要改上中文線上課程會比較合適,
因此在Udemy上面嘗試了一門HTML CSS的課程,覺得效果還好。
4. 網頁基礎十五天 https://goo.gl/nWMg28(300個小時)
這和ihower實戰聖經是我主要轉職的的學習工具,當初會認識這個課程,
是在youtube上面找bootstrap教材的時候有看到 free trail 的影片,
避免廣告嫌疑就不多談,比較之後比Udemy上的六角學院適合我,
加上某天腦波弱覺得自己學習速度太慢,想要加速就付費了,最後沒有後悔,很推薦。
最近也有個似乎是前端大大也開了一套bootstrap課程,
想花錢購買課程的可以多方比較、找到適合自己的課程。
後端的部分:
1. Rails 101 https://goo.gl/BM710y
2. iHower實戰聖經 https://goo.gl/yMv3gW
大家可能會覺得說:「為什麼一個立志當前端工程師的人要學Rails?」
某次和朋友聚會的時候,和幾個工程師朋友請教「什麼是一個合格的前端」,
就像前面說的,大家的定義真的是從狗到熱狗都有,
但其中一個後端工程師朋友說:
「只懂HTML CSS的叫做視覺設計,沒辦法跟我溝通API、完全不懂request到response之間
發生什麼事情的前端工程師,在我們公司連實習都拿不到。」
因此,在把HTML CSS jQuery念到一個基礎,開始做大量實作時,
我同步也開始「貼」Rails 101的code,以及翻ihower實戰聖經,
去感受「丟資料到後端、把資料存進資料庫、從資料庫拿資料出來」的感覺
最終的作品有包含一點透過 jQuery ajax去跟 rails的後端做溝通的功能(CRUD)
也是我面試的時候,部分面試官覺得我「勉強還算是個工程師」的點。
三、求職心態、策略與未來的路
1.心態面:
「被拒絕是應該、被洗臉是正常,清楚知道自己的目標、展現自己最好的一面」
坦白講我覺得我自己最幸運的部分,
就是身邊有認識兩三個網頁工程師的好朋友,
在我覺得自己什麼都不是的時候,告訴我工程師的人力市場狀況,
當我被其中一家老闆酸說:「你零經驗,讓你實習三個月看情況,一個月15k」
在我差點要接受的時候,告訴我我值得更好的機會。
2.策略面:
「有看到機會就投、有面試就去,一切以拿到offer再說」
我的最後一個作品是我朋友接了一個小案子,兩人一起合作(rails)
我意識到真的和有點經驗的人一起工作有許多好處,
例如一些光怪陸離的寫法才會消失
(被唸說這樣寫沒人看得懂..現在自己也越來越看不懂 囧)
或是一些既有的工作flow,也幫助我在面試的時候不至於被當「搞不懂狀況的人」
(合作開發時我學會使用git、github、trello跟github flow)
加深了我「無論如何,找到一個正職的工作,實際工作中才會養出更強的實力」的想法
3.未來面:
也曾經被身邊的朋友揶揄說:
「你貓大經濟畢業,為什麼不去銀行、券商?寫HTML、CSS不是很簡單的嗎?不是要用
再查就好的東西嗎?寫那個有未來嗎?你又不是資工系的,你有競爭力嗎?....」
我心裡非常清楚,我心中「前端工程師」的定義是最前面提到:
「熟悉Angular、React其一、懂nodejs、會規劃API、用webpack打包...」
那是對自己的期許,但知道自己的現況就是零開始。
也曾經想過是不是要參加bootcamp(alpha camp或是資策會),但因為經濟因素而作罷。
最後我的做法是,先讓自己成為求職市場上的「前端工程師」(無論內容做什麼)
工作的期間,期許自己可以將HTML、CSS、jQuery熟悉外,更懂得瀏覽器的運作,
更懂得整個「從request到response之間到底發生什麼事情」了解得更透徹,
學習javascript、能用javascript解leetcode,到能夠熟練angular或react
「人們常常高估短期能做到的事情、但低估長期能做到的事情」
如果我逼迫自己半年內要成為「心中認定的前端工程師」,我只會得到滿滿的挫折,
但,我可以一步一步往「心中認定的前端工程師」前進。
而會發這篇文章,是因為自己達到了自己設定的第一個里程碑
「在求職市場上找到前端工程師的工作」
雖然比預期的時間晚了一點,
原本希望年前可以確定offer並發面試心得文+轉職心得,
但作品集晚了一點做完、面試的公司並不夠多、且還沒有拿到心儀的Offer,
因此,面試的具體內容、要注意哪些事項,
等工作有著落後,會再分享給大家。
祝大家雞年行大運
有想要轉職的朋友可以順利成功
有一樣是零經驗想轉職網頁工程師的朋友,也可以找我聊聊,
我可以分享一些微薄的經驗給你們 :D
--
All Comments

By Quanna
at 2017-02-02T19:15
at 2017-02-02T19:15

By Charlie
at 2017-02-05T13:27
at 2017-02-05T13:27

By John
at 2017-02-05T17:30
at 2017-02-05T17:30

By Audriana
at 2017-02-06T14:30
at 2017-02-06T14:30

By Susan
at 2017-02-11T01:42
at 2017-02-11T01:42

By Hazel
at 2017-02-11T05:53
at 2017-02-11T05:53

By Sandy
at 2017-02-14T03:34
at 2017-02-14T03:34

By James
at 2017-02-17T17:55
at 2017-02-17T17:55

By Doris
at 2017-02-20T05:33
at 2017-02-20T05:33

By Hedy
at 2017-02-24T09:43
at 2017-02-24T09:43

By Franklin
at 2017-02-25T13:44
at 2017-02-25T13:44

By Thomas
at 2017-03-01T04:34
at 2017-03-01T04:34

By Margaret
at 2017-03-03T15:09
at 2017-03-03T15:09

By Andrew
at 2017-03-07T09:46
at 2017-03-07T09:46

By Zenobia
at 2017-03-10T14:25
at 2017-03-10T14:25

By Edwina
at 2017-03-14T03:50
at 2017-03-14T03:50

By Gary
at 2017-03-14T14:51
at 2017-03-14T14:51

By Yedda
at 2017-03-16T09:18
at 2017-03-16T09:18

By Kristin
at 2017-03-20T11:12
at 2017-03-20T11:12

By Linda
at 2017-03-22T00:44
at 2017-03-22T00:44

By Jacob
at 2017-03-24T23:50
at 2017-03-24T23:50

By Tom
at 2017-03-28T00:03
at 2017-03-28T00:03

By Bennie
at 2017-03-29T17:15
at 2017-03-29T17:15

By Rachel
at 2017-04-02T16:00
at 2017-04-02T16:00

By Agatha
at 2017-04-04T17:41
at 2017-04-04T17:41

By Daniel
at 2017-04-08T07:42
at 2017-04-08T07:42

By Daniel
at 2017-04-11T21:34
at 2017-04-11T21:34

By Ophelia
at 2017-04-15T17:31
at 2017-04-15T17:31

By Anthony
at 2017-04-15T23:01
at 2017-04-15T23:01

By Frederica
at 2017-04-17T19:15
at 2017-04-17T19:15

By Emma
at 2017-04-20T01:22
at 2017-04-20T01:22

By Anonymous
at 2017-04-24T07:49
at 2017-04-24T07:49

By Michael
at 2017-04-27T23:06
at 2017-04-27T23:06

By Edith
at 2017-04-30T04:03
at 2017-04-30T04:03

By Oliver
at 2017-05-01T03:33
at 2017-05-01T03:33

By Tom
at 2017-05-01T17:45
at 2017-05-01T17:45

By Zenobia
at 2017-05-03T07:18
at 2017-05-03T07:18

By Agatha
at 2017-05-06T21:25
at 2017-05-06T21:25

By Dorothy
at 2017-05-10T10:43
at 2017-05-10T10:43

By Megan
at 2017-05-14T11:49
at 2017-05-14T11:49

By Catherine
at 2017-05-19T11:26
at 2017-05-19T11:26

By Iris
at 2017-05-24T04:12
at 2017-05-24T04:12

By Joe
at 2017-05-28T10:37
at 2017-05-28T10:37

By Zora
at 2017-06-01T21:27
at 2017-06-01T21:27

By Doris
at 2017-06-02T03:02
at 2017-06-02T03:02

By Aaliyah
at 2017-06-05T18:08
at 2017-06-05T18:08

By Xanthe
at 2017-06-07T13:58
at 2017-06-07T13:58

By Kama
at 2017-06-09T13:18
at 2017-06-09T13:18

By Jack
at 2017-06-12T13:15
at 2017-06-12T13:15
Related Posts
〈年後換工作〉股王大立光也要徵才 「怕

By Edward Lewis
at 2017-01-29T15:34
at 2017-01-29T15:34
取英文名的藝術

By Olivia
at 2017-01-29T15:19
at 2017-01-29T15:19
期望薪資?

By Selena
at 2017-01-29T14:46
at 2017-01-29T14:46
內推 Facebook Solutions Engineer

By Agatha
at 2017-01-29T12:30
at 2017-01-29T12:30
機械系未來努力方向

By Edward Lewis
at 2017-01-29T09:12
at 2017-01-29T09:12