既然選擇了遠方,便只顧風雨兼程 __ HANS許
[TOC]
系列:零基礎搭建前後端分離專案
前端
-
Node.js 是一個基於 Chrome V8 引擎的 JavaScript 執行環境。 Node.js 使用了一個事件驅動、非阻塞式 I/O 的模型,使其輕量又高效。
-
npm 是 JavaScript 世界的包管理工具,並且是 Node.js 平臺的預設包管理工具。通過 npm 可以安裝、共享、分發程式碼,管理專案依賴關係。 cnpm 這是一個完整 npmjs.org 映象,你可以用此代替官方版本(只讀),同步頻率目前為 10分鐘 一次以保證儘量與官方服務同步。
NPM是隨同NodeJS一起安裝的包管理工具(類似nuget),能解決NodeJS程式碼部署上的很多問題,常見的使用場景有以下幾種:
- 允許使用者從NPM伺服器下載別人編寫的第三方包到本地使用。
- 允許使用者從NPM伺服器下載並安裝別人編寫的命令列程式到本地使用。
- 允許使用者將自己編寫的包或命令列程式上傳到NPM伺服器供別人使用。
-
yarn跟npm類似,但各有優缺點,大家可以看下這篇文章瞭解下:www.jianshu.com/p/254794d5e…
Yarn 對你的程式碼來說是一個包管理器, 你可以通過它使用全世界開發者的程式碼, 或者分享自己的程式碼。Yarn 做這些快捷、安全、可靠,所以你不用擔心什麼。 -
Webpack 是一個前端資源載入/打包工具。它將根據模組的依賴關係進行靜態分析,然後將這些模組按照指定的規則生成對應的靜態資源
- 忽略不用的靜態資源。這對刪減不必要的CSS尤其有用。Webpack只會將你的應用真正需要使用的資源放到dist目錄中
- 便捷的程式碼分裂。例如,你知道你的檔案Homepage.js只需要require幾個特定的CSS樣式,Webpack會根據你的需要建立一個homepage.css檔案來減少檔案體積。
- 你來控制靜態資源被執行的方式。如果一個圖片大小低於某個特定的值,你可以用base64來將它轉碼直接引入到你的JavaScript檔案中,從而減少HTTP請求次數。如果一個JSON檔案太大,那麼你可以通過一個URL來載入它。你可以通過require(‘./style.less’)來將less檔案自動轉為純CSS
- 穩定的生產環境。你不會將不用的圖片或舊的CSS部署到伺服器上。
- 當你熟練掌握了之後用起來會非常快。你可以熱更新頁面,管理正確地CSS,自動更新CDN快取。Webpack可以自動更新檔名及相關內容。
-
Sass 是一個 CSS 的擴充套件,它在 CSS 語法的基礎上,允許您使用變數 (variables), 巢狀規則 (nested rules), 混合 (mixins), 匯入 (inline imports) 等功能,令 CSS 更加強大與優雅。使用 Sass 以及 Compass 樣式庫 有助於更好地組織管理樣式檔案,以及更高效地開發專案。
-
Less 是一門 CSS 預處理語言,它擴充套件了 CSS 語言,增加了變數、Mixin、函式等特性,使 CSS 更易維護和擴充套件。 Less 可以執行在 Node 或瀏覽器端。
-
TypeScript是JavaScript型別的超集,它可以編譯成純JavaScript。 TypeScript可以在任何瀏覽器、任何計算機和任何作業系統上執行,並且是開源的。
-
Vue.js(讀音 /vjuː/, 類似於 view)是一個構建資料驅動的 web 介面的漸進式框架。 Vue.js 的目標是通過儘可能簡單的 API 實現響應的資料繫結和組合的檢視元件。它不僅易於上手,還便於與第三方庫或既有專案整合。 另一方面,當與單檔案元件和 Vue 生態系統支援的庫結合使用時,Vue 也完全能夠為複雜的單頁應用程式提供驅動。
服務端(後端)
- ASP.NET WebApi
ASP. NET Web API支援能夠輕鬆地建立功能強大的 Web API,可以從範圍廣泛的客戶端 (包括使用 JavaScript從瀏覽器中,到任何移動/客戶端平臺上的本機應用程式)訪問。
系列文章規劃
- VsCode+Node的前端環境搭建及其理解並建立一個前端目錄
- Less與TypeScript的簡單理解與應用,並使用WebPack打包靜態頁面
- 簡簡單單的Vue
- 深入使用NodeJs與npm等打包工具的命令
- 深入使用Less|Sass跟TypeScript
- 深入使用Vue與部落格園API進行簡單開發的移動端網站
- 深入使用Vue與知乎日報API進行簡單開發的移動端網站
- 深入使用Vue與網易新聞API進行簡單開發的移動端網站