前言
如果我做不了最厲害的Java工程師，那我就做Java工程師中最厲害的前端工程師。
前段時間，我默默給自己又餵了這碗心靈雞湯……
我不是很厲害的Java工程師，哪怕我已經工作八年，我依然覺得自己和頂尖工程師存在不小的差距，但我有個優點，就是對待學習樂觀且執拗，我會經常暗示自己前進，哪怕我已經寸步難行。
我從參加工作三年後就意識到了一件事，我不是特別聰明有悟性的人，我對技術領悟的慢，哪怕我經常熬夜也解決不了工作中一些十分簡單的問題。
曾經有個女孩對我說過：如果你不是特別幸運，那就請特別努力。這是我的人生格言，你如果想不斷激勵自己，那麼你也需要有一個。
所以我從那時也給自己定下了一句人生格言：如果我做不了大佬，那我就做大佬的跟屁蟲。
之後這些年我一直都是如此，學別人的，總結別人的，最後轉變成自己的。
前端是後端的未來
在講事情起因之前，我想先以多年Java程式設計師的角度來聊一下前端
我對前端一直都保留著十分敬畏的態度，因為它把最直觀的設計動態變現了，僅僅是通過一些CSS和JS程式碼就能實現許多好看豐富的效果。
以前的工程師是根本不分前後端的，後端java，前端直接拷貝貼上，敲敲JQuery，就能把頁面和資料都做出來，後面的bootstrap出來之後，帶來了更多前端的理念及變革，隨後而來的LayUI更是陪伴了我許多年。
然好景不長，時代的進步決定了IT行業的發展速度，前後端終究自成一家，Angular、react、vue的出現直接迎來了新的革命，layUI的作者也不得不面對現實關閉官網走向開源，成為了JQuery時代的記憶，一時令我失望且黯然神傷。
我從成為Java程式設計師初始，就沒認真寫過css，但凡能複製絕對不手寫，但凡能實現絕對不求甚解，甚至我當年的JQuery熟練程度遠高於css，到現在我都沒想明白為什麼。
即使前後端分離了，等到vue出現後，我依然保持著虛心的態度去學習，認為這是後端程式設計師必修課，如果冒然放棄一定降低競爭力。
可我的css，這八年時間過去依然停留在初級階段，從未提升過。
直到最近，我終於因為工作原因受夠了部分前端工程師的傲慢。
事情起因
中小型的網際網路公司中，前端往往承擔著比後端更大的責任，至少我呆過的兩家公司，都是前端一兩個，後端一大把，這就註定了在這樣的公司中，前端擁有特殊的地位。
自從前端自成體系後，我不是第一次在工作中受到少部分脾氣較大的前端工程師帶來的鬱氣了，不論是畫頁面還是聯調介面，竟然處處湧現著高人一等的感覺，我差點以為和自己聯調的不是中國人是米國人。
直到上週的一次例會，因為工作任務逐漸繁重，前端確實壓力較大，主管提出讓我這個後端承擔一小部分前端的任務，結果前端瞬間炸毛了，以為會對他的工作價值造成威脅，什麼“他一天連個頁面都畫不出來”、“他會把前端工程寫的亂七八糟我們還要善後”之類的話語蜂擁而來，那梗著脖子發飆的樣子給我很大的衝擊。
我不喜歡把情緒帶到工作中，但不代表我沒有任何脾氣，這玩意兒能忍？？
尤其是說我一天連個頁面都畫不出來，簡直是誅心之言！我忍得了嗎？？我忍了，因為我確實不會。
俗話說，人活一口氣，樹活一張皮，我這些年從未停止過學習，我叫你學Java你學的會嗎？累不死你！但是你叫我學前端我一定比你學Java輕鬆的多。
所以我含著這口氣，說什麼也要在css上有所突破，馬上列出計劃就開幹了。
學習方法
Java程式設計師若想立馬精通css，是十分困難的，難的不是css，是Java，你沒聽錯，就是因為Java要學的太多，註定了你在css這種不太關心的技術上想有成就很難，這單純就是個精力的問題。
可Java程式設計師也有自己快速學習css的方法，我這裡根據自己這一週所學的經驗分享給大家：
1）、只掌握最基本的語法，比如width、height、margin、padding、color、border等等類似這樣的語法，一些偏門的語法可能很有用，但你花時間深入學習不值得，放到以後邊搜邊學；
2）、先從佈局開始，尤其是彈性佈局flex語法，我可以這麼說，對Java程式設計師最有用的就是flex語法，不管PC端還是移動端都適用，所以我建議flex語法著重學習，學到最後你會發現萬物皆可flex；
下面是我學習總結的flex筆記截圖，你也可以像我這樣對重點知識進行記錄，因為Java程式設計師很容易忘記這些東西，可以反覆觀看最終形成永久記憶。
3）、掌握Photoshop少量用法，主要用來計算間距或寬高等元素，以及使用吸管獲取顏色引數，剛開始學習時，直接把某網站頁面截圖放到Photoshop裡面，直接參考別人的取值和顏色搭配是最方便實用的選擇；
計算間距：
取背景色：
4）、學會F12除錯，主要用來參考網站及平臺的樣式，許多可以拿來複用，同時能學到很多CSS樣式寫法。
5）、最好最快速的CSS學習方式依然是模仿，找一個網站，模仿裡面的某個頁面進行CSS仿寫，這種方式不僅能快速進入狀態，還能學到很多東西，最重要的，能直接做出效果你會很有動力。
我的成果
我根據上述的學習方法進行了快速學習，尤其是對flex語法進行了重點學習，然後就直接擷取了掘金的首頁，開始仿寫。
在週末放假的時間，含著這口氣，從晚上8點開始，一直寫到凌晨4點多，終於完成了我八年來首次認真學習CSS的成果。
也許很多前端看到了會取笑我吧，一個簡單的首頁竟然花那麼多時間完成，可我卻感到很開心，我覺得我從這時候開始，真正對如何畫頁面有了充分的認識，也更確定了自己以後的方向：要努力做Java工程師中最厲害的前端工程師。
後記
分享這篇文章的初衷，是希望那些像我一樣彷徨過的Java程式設計師或其他程式設計師都能夠尋回自我，一點點突破自己，怕的不是學不好，怕的是你不學啊。
我仿寫掘金的頁面及樣式檔案會分享出來，小夥伴們可以照著參考下，有興趣的也可以試著仿寫下首頁或其他頁面，裡面每一行css都是我手敲的。
連結: https://pan.baidu.com/s/1QQkwcpNU8cOVjaGjpWh5dA?pwd=jtit
提取碼: jtit
我之後會專門花時間一邊學習積累一邊手寫一個後臺管理系統，純頁面不包含業務功能的那種，因為我不喜歡包含雜七雜八的內容，就喜歡乾乾淨淨的架子，業務我自己去寫。同時也會出一個包含vue及elementPLUS的版本，最重要的是，我會把文件寫好供大家學習，而且通過文章來一步步闡述實現方式，帶著大家一步步實現效果。
感興趣的小夥伴兒可以提前關注下本人哦~
本人專注分享工作中的趣事及經驗，覺得有一滴滴幫助的話麻煩點個推薦吧啦吧啦~~