前端開發流程與元件化

2022-05-28 03:33:12 字數 900 閱讀 8725

1元件化開發

元件分開發是非常重要的工程優手段。也是react開發必備技能。前端光有js/css的模組化還是不夠的。對於ui元件同樣迫切的需求

前端元件化開發理念:

如上圖所示這就是前端元件開發理念,下面我們來總結一下

1、頁面上的每個獨立的可視。可互動區域視為作乙個元件;

2、每個元件對應乙個工程目錄,元件所需的各種資源(js、image、css)都在這個目錄下就近維護;

3、由於元件具有獨立性,因此元件與元件之間可以,自由組合;

4、頁面只不過是元件的容器,負責組合元件形成功能完整的介面;

5、當不需要某個元件或者想要替換元件時,可以整個目錄刪除/替換

注:每二項中就近維護原則是工程化的體現。每個開發者都清楚知道,自己所開發維護的功能模組。因為**必須存在於對應的元件目錄,當前目錄包函 css、js、html、image

根據上述描述我們將構造乙個專案的基本流程

專案初期前端靜態頁面只包函css、html

目錄名稱:frontend

less檔案結構對應生成css檔案

前端元件化開發

乙個按鈕,乙個輸入框,都算乙個元件,只不過是系統提供給我們的,我們需要自己的元件,如自定義彈框,輪播圖 如彈框元件 定義元件 popup.css popup alert popup alert popup.js class popup handle null,hasclosebtn false op...

web前端開發流程

web前端開發流程是什麼?老闆或甲方是乙個需求的真正發起者,也是乙個基礎idea的夢想師,產品是需求專業化梳理或進行有效評估細化需求負責的,而設計是前端的上游,前端是設計的下游。設計的工作目的是把產品巨集觀的思維結果進行專業的處理,因為按一般的習慣,產品最終的結果是原型圖,而原型圖可以理解為設計的草...

轉 前端開發流程

原文 一般都是在我們開發乙個專案之前我們會進行乙個討論會,然後一起分析一下這個專案應該怎麼去做,那些地方可以用最新的一些技術,那些技術有相容問題,哪些可以實現,哪些不可以實現,這些討論完以後,然後我們前端再去和後端討論應該怎麼設計介面,因為到時候ajax傳輸資料要用到。當這些需求都確定以後,產品經理...