作為一個服務端開發人員，需要了解並掌握一定的前端技能嗎？回答是，當然需要。
我記得剛開始做開發的時候，還不流行前后端分離，那時候也沒那么多的前端框架，什么 Vue、React 都還不存在，Angular 才剛剛發布第一代版本不久，但是在國內基本上還沒人用。
那時候，大部分應用都還是服務端渲染，比如 Java 的 jsp、.NET 的 aspx、Python 的 Jinja2 等等，剩下的真的需要異步加載的，也是 JQuery 一統天下。
那時候我還投身在 .NET 的懷抱，在微軟的一款叫做 SharePoint 的產品上做定制開發，使用的技術就是 .NET。接觸前端也就是從那時候開始的，那時候團隊里沒有人是專門的前端，也沒有人是專門的后端，甚至根本就沒有前端這一說法。前端的概念也很簡單，就是 HTML + CSS + JQuery，掌握這三樣，那就是掌握了前端。
還要感謝那時候我們做的產品，因為 SharePoint 有個特點。它里面的功能都是以組件的形式存在，你可以在頁面上選擇性的添加需要的組件，並且實現拖動布局，這些組件就是定制開發出來的，由於這樣的產品特性，所以那時候我們開發的組件其實就是前后端分離的，后端就提供接口，最開始寫的是 webservice，后來變成了 RESTful 接口。前端就是那三樣， HTML + CSS + JQuery 。
無論是技術的發展，還是學習新技術。都是現有的技術不能滿足業務或者開發上的需求，才催生出新的技術框架，才能讓團隊或者開發人員發現新的技術框架。由於當時需要一些表單的動態變化，比如 A 字段的修改實時聯動 B、C 字段，這時找到了一些實現表單雙向綁定的模板引擎，然后就發現了還有 Angular 這種東西。
那么說到正題了，作為一個后端，如果你還沒掌握甚至沒有入門前端，怎么樣才能快速入門並掌握呢？當然有方法。
在幾年前開始學習前端
當然了，這個方法不是適用於每個人，對於到現在為止還沒掌握前端的人來說就不太適合。
但是，還有但是，適合過幾年后的你自己。
是不是有點繞，是不是有點哲學的意思。是不是和那句"種一棵樹最好的時間是十年前，其次是現在。"是一個道理。
學習前端基礎
以前的前端基礎就是 HTML + CSS + Javascript。但是現在呢，有些人說，除了這些，各個前端框架都是基礎，比如 Vue、React 等，甚至 nodejs 都得掌握點兒。有些前端同學，甚至根本就不怎么理解 Javascript，上來直接就各種框架了。
先不要看什么框架，先把 Javascript 是什么搞明白。不管是什么 Vue、React，什么 ES5、ES6 ，甚至 typescript，到最后編譯完成還是 Javascript 代碼。
先老老實實的做幾個頁面，就用純的 HTML ，與后台的交互就用 JQuery，比如做一個表單頁，提交表單傳到后台，再做一個列表頁，用來展示數據列表。樣式不用太關心，畢竟我們不是專業前端，了解前端基礎，重點是前后端的數據交互。因為最近我發現，有些同學不太理解前后端交互的流程，主要是剛開始做開發的同學。另外有的同學只埋頭做后端，對於前后端交互也不甚了解。
自己實現一個 web
學習的方法就是實踐，尤其對於開發，動手才是最重要的。 Talk is cheap. Show me the code.除非你是天才，不然技術都是靠時間堆出來，經驗是靠實踐積累而來的。
就算讀再多的書，看再多的博文，關注再多的公眾號，收藏再多的文章。一旦開始動手了，也是一臉懵的狀態，請相信我，絲毫都不用懷疑。
有了上一步前端的基礎，就可以選一個框架了，推薦 Vue 或者 React 里選一個。上來什么都別干，先到官網讀一遍官方文檔，差不多耗時1、2個小時。然后就開始按照官網的例子，創建項目、運行項目、編譯項目，保證出來一個最簡單的可運行項目。
接下來就開始動手添枝加葉了，你的這個網站可以從個人博客入手，做一個簡易的博客，有頂部或者左側菜單，有個人信息，有文章列表頁，文章詳情頁等等。前端的展示層面，有好多開源的 UI 框架，比如 AntDesign、iView、Bootstrap 等等。
還是要強調，樣式不是很重要，重點是前后端交互過程。比如說后端接口需要驗證 header 中的 Token 信息，前端如何在 header 中加入 Token。如何 post json 格式參數到后端，如何向服務端傳文件等等，只有把這個過程都了解了，在設計后端接口的時候才能更加清楚。
另外，在學習新技術的時候，不要過度關注細節。比如你用 Vue 開發，可能配置上要涉及到 webpack，webpack 有很多的設置，但是它只是用來調試和打包的，不用太關注它的配置，因為重點不是它。
一旦動起手來，萬事開頭難。剛開始的時候，你會步步難行，唯有搜索引擎可以救你。除了搜索之外，找一些簡單的開源項目做參考也是不錯的方式。
比如我前幾天做的 web 版的 JVM 監控工具。前端就是用 React 做的，你也可以參考一下。源碼在 github 上: 點擊跳轉到源碼。當然，還有更多比我寫的強得多開源項目值得參考。
啥都別說了，動手吧。
不要吝惜你的「推薦」呦
歡迎關注，不定期更新本系列和其他文章
古時的風箏 ，進入公眾號可以加入交流群
