國產web前端架構推薦之–NEC（網易）

NEC

NEC:更好的CSS方案。nec架構是非常優秀的css架構，包含了規範、架構、程式碼程式庫等內容。
NEC官網：http://nec.netease.com/

規範

你是否常常碰到以下問題：你總是看不懂他寫的代碼，或者讀起來很吃力；你需要改他的代碼卻無從下手，或總是要去問他這裡是什麼改了會不會影響其他代碼；你和他一起開發一個產品，你總是怕代碼和他有衝突或互相影響；你的代碼在多次維護任務之後變得越來越臃腫，越來越難以維護。
解決以上問題只需一種方法——讀我們的規範！

• CSS規範：一系列規則和方法，協助你架構並管理好樣式。
• HTML規範：一系列建議和方法，協助你搭建簡潔嚴謹的結構
• 工程師規範：前端頁面開發工程師的工作流程和團隊協作規範

架構

NEC提供了很多CSS、HTML模板，再也不用為user agent stylesheetbody而頭疼啦

• css reset：重設樣式，清除瀏覽器預設樣式，並配置適合設計的基礎樣式。
• css function：功能樣式，從常用樣式方法中抽離，按需使用
• css media：媒體查詢，為不同的裝置和大小配置不同的樣式
• css animation：常見動畫效果的集合，主要用於效果示範和參考，基於css3
• html template：包含完整頭部資訊和主體結構的HTML模板
• html email：用於製作郵件內容的HTML模板

程式碼程式庫

NEC提供了常見布局、模組、技巧等代碼，在這裡找到她，或給你啟發，或她就是你的。為滿足產品對不同的平台和裝置的要求，NEC程式碼程式庫中的代碼開發使用了三種版本：相容、優雅、進階。
（相容[1]：支援包括IE6在內的所有主流瀏覽器和裝置，UI效果可能有所退化。
優雅[2]：在進階瀏覽器中有“進階”效果，在低級瀏覽器中有“相容”效果，是進階版的“優雅退化”，也是相容版的“漸進增強”。
進階[3]：支援IE9+、Chrome、Safari、Firefox等主流瀏覽器，支援行動裝置和所有智能系統，具有優越的UI效果。）

• 布局：提供各種常見的頁面配置方法，比如定寬布局、調適型配置等
• 模組：提供各種常見的網頁內容模組，比如導航、菜單、幻燈、圖文列表等
• 元件：提供各種常見的網頁內容元件，比如按鈕、標題、輸入框等
• BUG：展示了瀏覽器的BUG及其解決方案，比如IE雙倍邊距、3像素問題等
• 技巧：提供各種較難或特殊設計的解決技巧，比如垂直置中、自適應等
• 動畫：使用CSS3實現的各種常見動畫效果，比如淡入淡出、彈出等

總結：NEC提供了很多基礎性的東西，對於剛入行的web前端工程師們，可以更好更方便的學習一些web前端系統性的東西，規範，BUG，技巧等等，而且每個demo中還內建代碼運行效果，可以隨時修改方便自己調試、學習，NEC必須得給個贊！