面試超尷尬瞬間：我從沒參與過一個全棧項目！

文章轉載自http://www.qingmengtech.com/blogdetail?id=34

寫簡歷是找工做的第一步，第二步就是面試，那麼簡歷就是一塊敲開面試大門的敲門磚，因此寫簡歷的根本目的就是要體現出你的專業水平和項目經驗，那麼什麼樣的簡歷可以快速的抓住HR的眼球呢？做爲前端工程師的簡從來說，其中很重要的一點，就是要在簡歷當中至少有一個亮點的項目，這個項目既要凸顯出你技術的深度和廣度，又要與公司中的主流技術棧相吻合。那麼接下來咱們就一塊兒來分析一下目前公司的主流技術棧有哪些？咱們又應該如何運用這些技術棧打造一塊「夠硬」的敲門磚從而獲得心儀的offer呢？

前端部分

隨着時間和技術的發展，前端框架從jQuery一家獨大的狀況，發展到如今的Vue、React、Angular三足鼎立的狀況，三個框架各有優略，也都是比較成熟，但從國內的前端使用現狀來看，使用最多的兩個框架是Vue、React，咱們再來對比一下Github上的Star數：

React的Star數

雖然star數不能表明一切，但由此也能夠看出Vue受歡迎程度是很是高的。下面咱們着重介紹一下Vue.js的生態圈。

Vue

Vue.js是一款極簡的MVVM框架，若是讓我用一個詞來形容它，就是「輕巧」。若是用一句話來描述它，它可以集衆多優秀逐流的前端框架之大成，但同時保持簡單易用。爲何這麼說，由於Vue.js經過簡潔的API提供高效的數據綁定和靈活的組件系統。在前端紛繁複雜的生態中，Vue.js卻一直受到必定程度的關注，而其自己也在高速發展中，不管是生態、社區、資源、插件等等都在日趨壯大。

Vuex

若是說整個生態圈裏Vue.js做爲核心，坐實了老大地位的話，我會把Vuex放在老二的位置。學過React的人都知道Redux的重要性，而Vuex之於Vue就像Redux之於React。

Vuex 是一個專爲 Vue.js 應用程序開發的狀態管理模式。靈感來自Flux和Redux,但簡化的概念和實現是一個專門爲Vue.js應用設計的狀態管理架構。若是您的應用程序足夠簡單，建議您不要使用Vuex。可是，若是您須要構建是一箇中大型單頁應用，您極可能會考慮如何更好地在組件外部管理狀態，Vuex 將會成爲天然而然的選擇。

言歸正傳，什麼是狀態管理模式？講講我本身的理解吧。當你在開發應用程序時，你必定會分解出不少組件進行開發，而各個組件之間想必在邏輯上多少是有關係的。那麼組件之間的「通訊」就成了待解決問題。之前咱們試圖用事件廣播來作，但隨之而來的問題是，在應用不斷的擴展和變化中，事件變得愈來愈複雜，愈來愈不可預料，以致於愈來愈難調試，愈來愈難追蹤錯誤。這固然不是咱們想要的，咱們但願應用的各個部分都易維護、可擴展、好調試、能預測。因而，狀態管理模式冒了出來。下圖就是Vuex實現單向數據流的示意圖：

Vue Router

Vue Router 是Vue.js官方的路由插件，它和Vue.js是深度集成的，適合用於構建單頁面應用。Vue的單頁面應用是基於路由和組件的，路由用於設定訪問路徑，並將路徑和組件映射起來。傳統的頁面應用，是用一些超連接來實現頁面切換和跳轉的。在Vue Router單頁面應用中，則是路徑之間的切換，也就是組件的切換。包含的功能有：

• 嵌套的路由/視圖表
• 模塊化的、基於組件的路由配置
• 路由參數、查詢、通配符
• 基於 Vue.js 過渡系統的視圖過渡效果
• 細粒度的導航控制
• 帶有自動激活的 CSS class 的連接
• HTML5 歷史模式或 hash 模式，在 IE9 中自動降級
• 自定義的滾動條行爲

Vue CLI
做爲Vue的腳手架，Vue CLI無疑是出色的。它能夠幫你快速的上手Vue構建的工程，而無需再花多餘的時間去熟悉Vue工程的文件系統。
使用它的方法也很簡單：

安裝Vue CLI3：

npm install -g @vue/cli

查看版本號：

vue –V

進入項目：

cd project-name

運行項目：

npm run serve

須要
注意的是：
若是你已經全局安裝了舊版本的

vue-cli (1.x 或 2.x)，

須要先經過

npm uninstall vue-cli -g

或

yarn global remove vue-cli

卸載它
Vue CLI 須要 Node.js 8.9 或更高版本 (推薦 8.11.0+)

Vant
有贊前端團隊開發的一款輕量、可靠的移動端 Vue 組件庫，60+高質量組件，95%單元測試覆蓋率，完善的中英文文檔和示例，支持按需引入，支持主題定製，支持國際化，支持 TS，支持 SSR。

# 經過 npm 安裝
npm i vant -S

::: hljs-center

Webpack

Webpack並非Vue獨有的東西,並且Webpack的大名說不定比Vue自己還響亮。Github上各大主流的項目，無一例外都已是基於webpack來開發。你能夠不打算將其用在你的項目上，但沒有理由不去掌握它。篇幅有限，不展開描述，一句話歸納webpack的主要用途：把全部瀏覽器端須要發佈的資源作相應的準備，完成資源的合併和打包。四個核心概念：

入口(entry)：指示 webpack 應該使用哪一個模塊，來做爲構建其內部依賴圖的開始。進入入口起點後，webpack 會找出有哪些模塊和庫是入口起點（直接和間接）依賴的。
輸出(output)：告訴 webpack 在哪裏輸出它所建立的 bundles，以及如何命名這些文件，默認值爲 ./dist。基本上，整個應用程序結構，都會被編譯到你指定的輸出路徑的文件夾中。
loader：讓 webpack 可以去處理那些非 JavaScript 文件（webpack 自身只理解 JavaScript）。loader 能夠將全部類型的文件轉換爲 webpack 可以處理的有效模塊，而後你就能夠利用 webpack 的打包能力，對它們進行處理。
插件(plugins)：能夠用於執行範圍更廣的任務。插件的範圍包括，從打包優化和壓縮，一直到從新定義環境中的變量。插件接口功能極其強大，能夠用來處理各類各樣的任務。

後端部分

介紹完前端咱們須要掌握的技術棧，接下來要聊聊做爲煊赫一時的全棧工程師來講，還有哪些知識是須要咱們必須掌握的：

Node.js 給不少初學者的第一印象就是「能夠在服務器上運行 JavaScript」，因而不少人就有這種疑問：「我寫的是前端代碼，又不是後端，我學Node.js幹嗎啊」。

現在的前端已經不是零幾年的前端了，之前咱們寫的是 Web Page，咱們寫出來的頁面是給人「看」的；而如今咱們寫的是 Web App，咱們寫出來的應用是給別人「用」的。而二者的複雜度也不可同日而語。

在服務器端，JavaScript不依賴瀏覽器，而是由特定的運行環境提供的JavaScript引擎解析執行，好比Node.js。服務器端的JavaScript不操做DOM和BOM，它經常用來作一些在客戶端作不到的事情，例如操做數據庫、操做文件等。另外，在客戶端的Ajax操做只能發送請求，而接收請求和作出響應的操做就須要服務器端的JavaScript來完成。

因此哪怕你只想作一個前端er，Node.js也是一項必需要掌握的技能。

KOA2
MongoDB是一個介於關係數據庫和非關係數據庫之間的產品，是非關係數據庫當中功能最豐富，最像關係數據庫的。它支持的數據結構很是鬆散，是相似json的bson格式，所以能夠存儲比較複雜的數據類型。MongoDB最大的特色是它支持的查詢語言很是強大，其語法有點相似於面向對象的查詢語言，幾乎能夠實現相似關係數據庫單表查詢的絕大部分功能，並且還支持對數據創建索引。
咱們能夠在Koa2中經過Mongoose對MongoDB進行便捷的對象模型操做。

總結

若是你的簡歷中有一個具有上述先後端技術棧而且可以上線的全棧項目的話，你還愁得不到面試機會嗎？並且這種級別的項目在面試過程當中，當面試官問你關於項目經驗的問題的時候，你也能夠足夠從容的來應對。

文末福利

給你們推薦一門包含上述全部技術棧的一個全棧項目，是由慕課網精英講師--謝成老師講授的。

雙11活動只要1塊錢哦~~（加後面的課程助手領取優惠券）下面小編奉上項目課程大綱：

課程地址

 

掃碼加我好友
領取課程福利