❶ 關於前端開發的20篇文檔與指南
英文原文：Another
20
Docs
and
Guides
for
Front-End
Developers
相信在
2015
年很多這個行業的人都會有這樣的兩種感受：
真的不知所措，這個行業到底有多少東西需要去學習；
渴望更多，並迫不及待的為接下來的學習尋求一些思想方向。
第一個來自於我們的個人感受，而第二個則是純粹的必要性了。所以本文整理一些有用的信息，希望可以幫助相關領域的前端開發人員。
1.
I
want
to
use
基於
Can
I
use
的數據和功能，這款應用給予你選擇一組前端開發特性的能力，並會讀取出一個全球性用戶能夠使用它的百分比。
2.
Regulex
JavaScript
正則表達式的可視化工具，在線輸入表達式後，動態生成表達式圖片。非常不錯的一個可視化
Web
在線正則表達式設計工具。
3.
Mastering
the
:nth-child
一個單頁網站，幫助你理解如何去使用各種有用但又復雜的基於選擇器組合的
nth-child。
4.
HTML
5
視頻事件和
API
這個頁面展示了新的
HTML
5
視頻元素、媒體
API
和媒體事件。播放、暫停、搜索整個視頻、改變音量、靜音、改變播放速度（包括進入負值），查看視頻和潛在事件與屬性上的效果。
5.
Excess
XSS
這可能是所有開發者都應該熟悉的一個話題，並且這可能是一個很好的著手點。它是一個跨站點腳本編制綜合教程。
6.
RSCSS
意思為Reasonable
Standard
for
CSS
Stylesheet
Structure（CSS
樣式表結構合理的標准），記錄一些針對大項目的
Sass/CSS
編寫技巧和技術。
7.
CodeFightClub
一個由
Andrew
Hathaway
建立的項目，目的是幫助其他開發者學習如何用最好、最有效以及首選的方法編寫代碼。
8.
Sass
Guidelines
Hugo
Giraudel
寫的
Sass
Guidelines
目前已經被翻譯成其他六種語言。
9.
Flexbugs
如果你的目的是使用
flexbox
構建一個網站，而事情卻並沒有像你所期望的那樣進行，你可以在這里找到解決方案。
10.
A
Front
End
Engineers
Manifesto（一個前端工程師的宣言）
沒什麼深入的東西，只是一些簡單的事情提示，所有的前端開發者應該考慮將其結合到開發過程和工作流中。
11.
ES5
中的
ECMAScript
6
等價物
ES6
特性轉換到
ES5-compatible
代碼的一個很好的參考。
12.
Flexbox
Adventures
來自開發者
Chris
Wright
對
Flexbox
深入、實際看法。
13.
BEM
一個全面推廣和培養
BEM
CSS
使用方法的網站。
14.
Sass
Compatibility
記錄不同
Sass
引擎之間的不兼容性問題。
15.
HTMLelement.info
一個整潔、邏輯、易使用的指南規范，在不同的
HTML
元素上獲得信息。
16.
JSLint
Error
Explanations
你可能跟隨過很多
JavaScript
最佳實踐，卻並不明白所有這些技術背後的原因。本站旨在揭露
JSLint、JSHint、和
ESLint
工具里錯誤和警告。
❷ BAT等大公司有前端開發規範文檔和UI規範文檔嗎
有的，大公司規范較多，可能不採用外面流行的框架，有公司自己內部的框架，一些規範文檔都是自己公司編寫的
❸ 前端需求分析,首頁面結構有哪些
大體上根據設計來，通常情況是有基本框架，然後一個顯示系統名稱，用戶，等等基本信息的banner，一個導航欄，還有就是主頁頁面主體了，頁面主體兩旁是否有側邊欄根據設計決定，最後就是公司信息，和其他鏈接的尾部。
❹ 前端原型圖長什麼樣,需求文檔見過嗎
……我沒聽過前端原型圖。
只看過Javascipt 原型圖，如果是，附帶一張給你：
❺ 產品需求文檔模板
首先告訴你產品需求文檔肯定是有的！一個經過實際工作檢驗、經歷過「質疑」、「挑戰」和「斗爭」之後沉澱下來的模板，肯定是已經吸收了各類人的偏好、意見，固化了很多符合實際業務必須的內容要求，能夠起到很好的業務承接作用。格式化、標准化本身是一個很好的思維、工作方式，可以讓你在編輯文檔和接受文檔的雙方關系中建立一種「標准」的溝通機制和預先定義的溝通基礎，減少額外的溝通成本，提高效率。
不過，在享受別人智力和經驗梳理好的模板進行需求編寫的同時，還是應該了解模板形成的原因，並在此過程中形成自己對於模板的理解，進而形成對於產品需求文檔的理解，在理解中使用，裁剪和優化。
要理解和分析模板，理解和分析產品需求文檔，可以運用以下幾個方法：
一、描述-解釋-預測-監控
描述，是對觀察過程和觀察結果的描述。觀察的對象因不同的研究而有差異，其目標是盡可能完整地將觀察者根據自己的觀察得到的現象、由此現象所產生的思想和感覺，以及在觀察過程中選擇納入的過程參與者對現象的反應等信息進行描述。
解釋，是回答 「為什麼」，是對於描述的理解、歸類、定義和解釋。其目標是將描述內容背後的成因、原理、動機，內容中各部分之間的相關，依存、依賴和影響關系等進行說明，以便對於描述內容有更清晰、更細致、全面的了解。
預測，根據以因果關系為內容的內在聯系，相互影響來推導未來的發展或者將要發生的事情。通過研究解釋內在的聯系，准確地表達內在聯系，從中推導出正確的預測。
監控，是對於預測行為、現象的觀察和監督，包括了觀察到的預測中的行為、現象的發生或者預測以外的行為、現象的外發生，以及因此而採取的對應的反映動作；這些反映動作是預測過程中根據內在聯系制定的「響應」機制，並任其自然發生或者通過提供「系統」的自製能力來實現。
二、需求准備、編寫和檢查
回歸到產品經理的日常工作中，在時間佔比上較為集中的就是產品需求管理了，包括了需求的准備、分析、編寫和檢查過程。在這個過程中，描述——解釋——預測——監控這個通用的科學分析過程也同樣使用，且可以貫穿其中，並可以幫助理解、形成並固化成我們前文提到的需求文檔的模板。這個科學分析的過程、方法在不同階段運用的側重點會有所不同。
1. 描述
描述的過程是客觀的進行「需求向」描述的過程，是一個「背景」信息的補充，用來說明，這個需求文檔的源出是什麼，是針對什麼問題，這個問題是在具體什麼領域，在怎樣的范圍內，涉及到的是那些人；在需求相應的功能設計實現之前，當前的解決方案存在的問題是什麼，參與者是怎麼解決的，解決的情況怎麼樣，是好，還是不好，還是勉強可以，對於新的需求的緊迫性是什麼樣的。此外，描述的過程還需提供一個基礎的概念和流程的解釋，用來統一作為背景去理解一個現實的業務場景和「溝通字典」，避免在溝通中因為誤解而產生不必要的偏差。
需求准備的過程：了解需求來源（管理部門、市場部門、運營部門等），需求背景（行業、同業規則現狀等）；
需求分析的過程：了解需求目標、預期效果（時間、結果等）、使用者習慣、相關人影響；
需求編寫的過程：描述需求目的、背景、時間和結果要求、業務流程、交互過程、系統架構、干係人角色和影響范圍；
需求檢查的過程：需求的背景、目標、過程、干係人、結果預測和預防的完整性檢查；
2. 解釋
解釋在需求來源的基礎上描述了 「為什麼」接下來這個需求可以解決遇到的問題，同時還加入了「是什麼」和「怎麼樣」的部分。就是這個需求是通過怎麼樣的方法解決了「描述」過程中提到的問題，這個新的解決方法需要要做什麼，對於原有的業務過程有哪些改變，會提升什麼，會降低什麼，會影響哪些人、哪些業務部分、哪些業務系統以及哪些數據的產生。這個部分，是需求文檔的最主要、最核心的內容部分，也是在內容上佔比最大的一部分。
這里的解釋根據產品需求面向的要解決的問題不同，而可能存在多個層面，多個維度的層面，比如對於運營的影響，對於前端市場的影響，對於用戶的影響，對於財務、法務的影響；從技術開發、技術實現維度，比如對於前端開發的影響、對於服務端開發的影響、對於數據平台的影響，還可能涉及到對於運維資源的影響等；因此對應到實際的產品需求工作中：
需求准備的過程：了解需求可能涉及的相關業務系統及系統對應的數據流程和邏輯、了解需求可能涉及的外部服務的數據流程和邏輯；了解面向的內外部用戶的產品使用水平、學習能力和使用習慣；
需求分析的過程：選擇和制定最有效的，滿足時間、資源投入等要求的方案；
需求編寫的過程：詳細描述需求的業務流程，通過各種圖表格式說明新的解決方法在各服務系統之間、各業務部門之間、用戶與產品，產品與後服務之間的數據、文件和行為的交互過程、詳細的信息輸入、信息處理和信息輸出；每個業務節點明確的輸出物和節點標志，重要性和優先順序；系統架構、干係人角色和影響范圍；
需求檢查的過程：需求的流程、用戶交互動作、系統信息交互等完整性檢查；
3. 預測與監控
預測與監控在產品需求文檔的管理上是聯動的，是對於預測的事件發生的時候，進行管理的機制，監控=預測+干預。在產品需求文檔的管理上，對於設計好的業務流程、使用功能，在實際過程中可能會出現這樣或者那樣的 「非規劃」的使用，也就是我們通常說的「用戶並不總是按照產品設計的方式來使用產品，而且，往往相反。」因此，這部分內容很大的比例需要來對於用戶的行為進行預測和監控，並提供「預防」或者「解決」方案。其中：
預防在於，預測產品的用戶在使用的過程中，可能會進行的一些超過產品使用半徑的操作，一旦進行這些操作，操作的任務流程會中斷，掉出，進入其他業務流程中且無法回滾，從而使得操作無法進行下去，功能使用失敗，使用者會感覺產品、功能沒有包容性，缺乏引導性，導致了最後操作的失敗，預想的結果沒有實現，而且造成了一定的挫敗感，甚至造成了一定的損失。預防的具體方法多採用導航、提示等，不同的系統都有各自標准化的控價，我們在這里不做展開。
解決在於，預測產品的用戶在使用產品的過程中，因誤解、操作手誤而進行了「非標」、「超規」使用「掉出」原本設計的業務流程和操作流程的情況下，需要提供額外的流程和控制來「回轉」用戶的操作，來幫助用戶回到預先設定和他所需要的流程上來。解決的具體方法多通過「導航」引導「跳轉」和「返回」、「回退」來實現。對應到實際的產品需求工作中：
需求准備的過程：了解用戶特徵和使用水平、評估、比較不同方式實現需求對於用戶行為的可控性和「非常規」操作的危害程度；
需求分析的過程：選擇和確定需求實現方案，評估行為管理方式和管理機制；
需求編寫的過程：詳細描述需求的業務流程和交互過程中可能出現的用戶異常操作，相應異常操作中系統反應，系統對應的控制和引導；
需求檢查的過程：需求「異常」流程和相應引導、控制地完整性檢查；
在需求管理的過程中，就可以按照這個 描述——解釋——預測——監控流程來進行。這四個既是步驟，是需求文檔內容的組成部分，也是需求編寫完成之後的檢查。
四個模塊構成了需求文檔的完整性，且同時有各自獨立，有對應的說明，引導、要求和標准。所謂標准文檔，就可以按照這四個模塊作為框架、內容和格式。
寫在最後
產品需求文檔作為產品經理同視覺設計、交互設計以及技術開發人員進行需求溝通的一個載體，我平時用的比較多的是摹客的服務進行創作。一個完整的、充分溝通確認，並最終達成多方理解和共識的產品需求文檔，能夠最大限度的還原產品、功能的設計，保證產品、功能的實現，最大限度的減少因為各方理解的偏差而造成的時間、人力和經濟資源的浪費及復工。
❻ 前端開發做一個網頁，要交一份需求文檔，寫什麼呢
布局交互，和對ui的要求，控制項啥的自己掙
❼ 求一份APP前端設計（包括從流程圖到效果圖，到前端開發實現）的開發時間評估文檔模板
前端工作是指售前?、
還是說開發展現層?
j2ee方向的我給你提供點信息吧:
1、JSP，HTML，CSS，JS(常用的庫，和基本語法)、ajax技術。
2、java基礎語法，常用的框架，如:struts，hibernate，spring，ibatis，mybatis
3、資料庫:MYsql，sqlserver，oracle等
4、工具:資料庫設計工工具，流程圖工具，office，郵件
5、伺服器:linux，windows
6、計算機相關:硬體，內存，操作系統相關知識等等。
太多了，你具體說說你想知道哪些?
❽ 前端項目的開發流程
前端開發流程概述
前端開發流程可分為需求分析、開發階段、測試階段、維護階段，下面分別進行敘述。
2.1 需求分析
這個環節中，首先是和客戶進行交流，了解客戶的需求，然後分析項目的可行性，撰寫項目需求文檔。如果項目可行，則起討論具體方案，分模塊分步驟進行規劃，分析項目進度安排、所需成本，進行原型設計（包括頁面布局圖，頁面邏輯流程圖，說明文檔等。通過原型設計，可以讓項目組和客戶都可以對項目有一個直觀感受，同時可以低成本高效率的復現業務場景和各模塊流程）。
可以說需求分析階段是整個前端項目的基礎，基礎不牢，地動山搖。可以試想，如果和客戶溝通不順暢，有的方面客戶沒搞清楚是什麼效果，開發完成後就可能與客戶發生糾紛；如果可行性有問題，有的模塊很難實現或成本超出預算，就很難處理。
2.2 開發階段
這個環節是前端工程師主要參與的部分，按照需求分析階段的規劃按步驟完成任務。
根據產品需求分析文檔和原型圖進行UI設計，對產品的整體美術風格、交互設計、界面結構、操作流程等做出設計。負責項目中各種交互界面、圖標、LOGO、按鈕等相關元素的設計與製作。
根據UI設計進行規劃，提取界面中可以復用的模塊方便重復利用，分析界面是否有實現難度比較困難的地方，進行溝通和功能排期，按功能大小以及難度進行功能時間的評估，和後端溝通好排期時間，保證大家能夠更有效地開發合作，針對功能復雜的地方要先理清思路。
不要盲目開發前端搭建框架。根據設計圖進行前端界面開發，以及遇到的問題及時與產品、UI、後台人員溝通，保持大家信息一致，針對不清楚的地方也要及時溝通，以免做錯功能。
根據後端介面進行欄位填充，以及部分功能開發。針對缺少的欄位或者數據結構進行提出，及時與後端反應，盡量讓大家都能以最小的改動完成後續開發工作。前後端都要按照規范進行開發，針對不規范的地方要給與提出、指正，營造出規范的工作模式，以後維護成本和溝通成本更低以及開發效率更高。如果前端的設計進度遠遠超前後端的介面和數據結構設計，也不必等後端，可以自行開發nodejs伺服器配合postman等介面軟體進行開發。
前後端功能聯調、完成自測。檢查功能完成情況，看是否有遺漏，出現問題及時溝通解決。
2.3 測試階段
發布測試、修改bug、發布上線，自測完成後提交測試，測試根據提交的項目以及需求進行測試，提出bug給相關人員修改，開發人員周期性的配合修改bug，保證今天能夠修復昨天的bug。
發布dev環境，配合測試，修復bug以及需求優化
發布test環境，修復bug以及需求優化
發布it環境，修復bug以及需求優化
發布pre環境，修復bug以及需求優化
pre驗收之後，發布線上環境，產品進行驗收
2.4 維護階段
如果客戶驗收通過，項目就進入了維護階段，程序的維護包括程序上線後後續bug的修復和程序版本的更新。
3 個人經驗總結
3.1 文檔很重要
前端項目的文檔似乎已經作為前端工程化的標准流程之一了，文檔寫的好，可以便於同事快速了解你的代碼功能和需求，便於協作。可以想像，隨之項目復雜度增加，體量越來越龐大，開發團隊人數也越來越多。這種情況下，如果像變魔術一樣隱匿中間流程而直接得出結果，後果可想而知：項目復雜度越增加就越難以管理，開發效率低，合作混亂，結果甚至導致項目死亡。
好的文檔看起來就像一個產品說明書，但作用卻遠遠超過了說明書，不僅僅告訴你如何使用，還應該告訴你項目的設計思路，用了哪些組件，哪些部分不完善，將來有什麼規劃等等。這是一份比較好的說明文檔。
3.2 與客戶及時溝通很重要
3.3 扎實的基本功很重要
盡管當下框架、函數庫、工具包等更新迭代非常快，前端工程師有很多新的知識要學，但原生JS、HTML和CSS依然是重要的基本功，在學習前沿工具的同時不能放棄基本功的訓練。
❾ 前端開發的技術文檔怎麼寫
可以從項目背景，功能模塊，目錄結構，介面列表來寫，還可以配合jsdoc自動生成各個js文件的詳細文檔
❿ 前端開發應該如何寫技術文檔
一名合格的前端開發工程師，不單單需要掌握前端必須的各種技術，同時還要掌握其它技術，需要掌握一點後台的知識，同時也要對網站構架有一定的了解，這樣才可以稱之為一個合格的Web前端開發工程師。
如果你想要快速學習Web前端技術，專業全面的學習方式比較好。適合零基礎的小白迅速成長，學習曲線先快後慢，也適合有一定基礎的學員進階學習，鞏固知識的基礎上，穩步進步突破職業瓶頸。