前端、後端、運維的基本思考

在dcg實訓了一段日子，雖然我們和正常工作一樣分了前端、後端、運維、設計和產品等的小組，但是學習嘛，多多少少還是都要了解一點的。

來的第一天，實訓的老師就對我們說

程式設計師，最高的境界是什麼，不是工程師，不是架構師，也不是寫演算法而是有一個女朋友:fa-hand-o-up:。哈哈哈簡直了，在這邊工作室的大部分人好像大部分人都是單身的吧。

話說論技術的話，反正禿了的一般都比較膩害~~

前端的東西都很雜，但是感覺應該是我比較感興趣的地方。先不過架構師的話，前端的額很多東西都是造房子一樣，有一種build一個自己喜歡的東西出來~這種建造的過程還是比較直觀的。

想成為一個前端工程師，我和前端的實訓老師聊了蠻多。大致有這些基礎要去打好的吧。

基礎篇

• html 和css ，css的各種盒子就不說了，flex和動態，選擇器，各種模型一直標籤語言中自帶的屬性應該都是熟練知道的。

• 另外多看書！我一般都是邊看邊查這種，其實建議大家把相關書籍看一兩遍，就普遍的書就好了，不用特別貴的那種。

html5和css也包括在內哦。

• js，js是我用過和py差不都方便簡潔的語言了。之前使用nodejs的express框架做過網站，基本的class id選擇和觸發還有功能的除錯和資料的呼叫處理會使用就好了。其實很多複雜的內容網上都有js包，就是檔案（引用可以先看看有沒有cdn檔案哦）。進階的使用就應該是js和後端的資料相對接吧（當然也可以使用框架的模板template）

• dom ：文件物件模型（Document Object Model，簡稱DOM），是W3C組織推薦的處理可擴充套件標誌語言的標準程式設計介面。在網頁上，組織頁面（或文件）的物件被組織在一個樹形結構中，用來表示文件中物件的標準模型就稱為DOM。HTML DOM 定義了所有 HTML 元素的物件和屬性，以及訪問它們的方法。是關於如何獲取、修改、新增或刪除 HTML 元素的標準。ps：好吧這段話不是我自己寫的，因為我也說不太清楚。簡單的理解就是html中節點/元素的物件的結構樹的標準，這個標準不僅是關於html的定義和css的屬性，還有js給予的方法

稍微稍微稍微有一點點的攻城獅應該知道這些吧（好吧我給自己的定位就應該是在這裡了。:fa-wheelchair:）

• json，xml的格式的資料的編寫，讀懂，crud【增加(Create)、讀取查詢(Retrieve)、更新(Update)和刪除(Delete)】必須要掌握吧

• Node.js 強推這個。。環境？我們看看官方給的解釋：是一個基於 Chrome V8 引擎的 JavaScript 執行環境。 Node.js 使用了一個事件驅動、非阻塞式 I/O 的模型。 [1]

Node 是一個讓 JavaScript 執行在服務端的開發平臺，它讓 JavaScript 成為與PHP、Python、Perl、Ruby 等服務端語言平起平坐的指令碼語言。感覺前端的同學都需要去會使用這個搭起來網站什麼，本來語言就是js可以鍛鍊js的使用，還可以瞭解一些網站的框架是如何運作的，在練習js語言的同時也去熟悉後端，學習不要太片面了哦？！

• festful api，這個網站正在build一些api。他這個概念也比較抽象，我的理解是，給不同層面之間，view model之間，客戶端，伺服器之間，建立一些api ，或者說互動性質的指令碼，然後提供一組設計原則和約束的條件，是網站更加簡潔，更有層次感，方便build快取機制（待實現）

• canvas、向量圖形，svg動畫的瞭解和簡單製作（看懂別人的再修改？），頁面的響應式和功能。

• 響應式，單獨聊一下吧。不僅僅是根據螢幕大小再來調css，再設計html的dom tree的時候我們就應該考慮到響應式，標籤使用要規範化，不然後期維護更新很辛苦的。

• 網格佈局（Grid Layout）、柵格佈局、Flexbox佈局、SEO（Search Engine Optimization）：漢譯為搜尋引擎最佳化、sitemap網站地圖構建

進階的攻城獅發展篇（娃哈哈店長的todo-list，咕咕咕）

只列list 不做評價。想了解的百度一下。

ES6 / TypeScript

• [x]MVC / MVVM / MV*

• [ ]程式碼質量（如JSLint / ESLint / TSLint / CSLint）

• [ ]安全性（如跨域）、工程化

• [ ]授權（如HTTP Basic、JWT等等）、程式碼分析（如Code Climate）

• [ ]相容性，跨平臺，跨瀏覽器、跨版本

• [ ]css和html動畫

• [ ]Icon 字型(感覺和美術相關的東西太難了，簡單易懂的還是懂，但是細微的差異真的太頭疼了)

• [ ]DOM操作（如jQuery、React等等）、包管理（如npm、bower）、版本管理（如git、svn）

• [ ]服務、安全、效能測試以及最佳化

基礎篇

• HTML / CSS、Java / Python / PHP / Ruby、Web框架，如Spring MVC、Flask、Laravel、HTTP協議基礎、CGI基礎

之前也說過，後端的任務最簡單直接的是寫api介面，然後給前端傳遞資料。類似django的template的tags，和model class的一些處理資料的方法的構造，還有調取外界的資料的api。

運維工程師(Operations)，負責維護並確保整個服務的高可用性，同時不斷最佳化系統架構提升部署效率、最佳化資源利用率提高整體的ROI Returner of Open Interface。

運維的話乾的事情基本都和伺服器有關，專案做完了啊，上線的過程，網路的最佳化和處理，後期的維護等等。

再短期的課程中，基本瞭解這些東西：

• 檔案轉碼：網站中不僅僅有自己的靜態檔案，還有使用者上傳、下載的檔案之類的，檔案轉碼就是將使用者提交的檔案進行轉碼、壓縮，放便傳輸運送，也方便儲存。比如使用者瀏覽一個txt檔案但是我們轉碼成pdf更方便使用者去瀏覽。

• 監控 、頻寬監控 對服務監控 騰訊雲：伺服器相關的站點，比如騰訊雲，阿牛，阿里都有提供api介面，檢視資料，調取資料的。另外自己還可以寫指令碼去抓取資料。

• 網站測試按鈕一個個點 還是寫指令碼？ 寫的話怎麼寫？：功能性的東西還是需要去人工的去測試，一個個點。壓力測試之類的就有一些框架了功能 壓jmeter .loadrunner這些，都很好使用。

• 測試的時候時具體怎麼測試的：本地測試、網路測試

• 運維負責專案和網路伺服器的溝通是嗎對相應的框架進行一定的瞭解，專案上線前要搭環境，前後端檔案的處理，api程式碼、中介軟體的處理，還有資料庫的維護和處理。專案上線的時候也可以寫一個自動化的指令碼，方便一些。

• 我的網站，502怎麼解決？：閘道器錯誤 檢視nginx指向有沒有問題， 域名到伺服器檢視有沒有問題， 公網ip ping 一下，日誌的檢視！！。

• 直播？雲直播？透過雲開啟直播嘛阿里雲提供的服務 。但是現在並不是說我搞一個直播專案，然後就可以上線了上市了，現在這些還是抓的比較嚴。

• cdn不是很快是怎麼回事？要換成靜態資源嘛：不用，cdn節點到處都是，而且檔案也不受大小的影響，對檔案也有壓縮功能。

• 網站如果進行cdn配置、將網站的靜態資源放在cdn上：這裡還是要多說一些啊，假設我們有一個域名，一個伺服器，域名是指向這個伺服器的，然後我們再騰訊雲或者阿里雲進行cname，分配一個伺服器（相當於cdn伺服器了），將我們的域名暫時指向到我們cname後的cdn伺服器，然後使用者訪問的時候會先訪問cname後的伺服器，如果檔案存在就給使用者，如果沒有那域名會自動去原始伺服器去呼叫，原始伺服器有這個檔案就會返回給使用者，同時檔案也會在cname後的伺服器進行一個複製。

待續。。。

本作品採用《CC 協議》，轉載必須註明作者和本文連結