一個(gè)項(xiàng)目的啟動(dòng)，首先應(yīng)該是從需求分析開(kāi)始；沒(méi)有需求就沒(méi)有項(xiàng)目
這里我們先略過(guò)需求继蜡，進(jìn)行環(huán)境的構(gòu)建
需要什么
- 一個(gè)全新的環(huán)境需要的，是一個(gè)基礎(chǔ)開(kāi)發(fā)環(huán)境 + 一個(gè)包管理器 逛腿，說(shuō)的就是nodejs稀并。
- 有很多功能已經(jīng)由貢獻(xiàn)者進(jìn)行開(kāi)發(fā)并發(fā)布到 包管理器上，通過(guò)采用他們的實(shí)現(xiàn)可以節(jié)省精力单默。
- nodejs 可以突破原來(lái)Javascript腳本語(yǔ)言的局限碘举。實(shí)現(xiàn) 服務(wù)端 的開(kāi)發(fā)；進(jìn)行開(kāi)發(fā)流程搭建... 功能強(qiáng)大搁廓。
- 編輯器 VScode
1.nodejs 安裝
- 推薦使用安裝包 一鍵安裝引颈，會(huì)同時(shí)安裝包管理器 npm
node -v //查看安裝版本耕皮，確認(rèn)安裝成功
npm -v //查看 包管理器 npm 版本
2.git
- git用來(lái)進(jìn)行版本管理以及協(xié)作十分有用
- git Bash 也是十分好用
- 下載安裝包 一鍵安裝 next即可。
git --version //查看版本 確認(rèn)安裝成功
git下載
3.代碼編輯器 VScode
- 微軟開(kāi)源的一個(gè)代碼編輯器蝙场，前端開(kāi)發(fā)十分好用凌停，可集成GIT進(jìn)行版本管理
- 安裝
下載安裝包，一鍵安裝
4.試一試
- git 未配置的情況下售滤，如圖進(jìn)入鏈接下載項(xiàng)目包罚拟，解壓
圖片.png
-進(jìn)入解壓目錄，右鍵執(zhí)行 bash 命令行
//執(zhí)行
npm i
npm run dev
- git 已配置好完箩，執(zhí)行如下命令
//依次運(yùn)行下列命令赐俗，克隆項(xiàng)目到本地，進(jìn)入項(xiàng)目目錄弊知，安裝依賴(lài)秃励，運(yùn)行項(xiàng)目
git clone git@github.com:yj21world/WWWStudy.git
cd WWWStudy/
npm i
npm run dev
-
瀏覽器訪問(wèn) localhost:8080
圖片.png
有什么用
千里之行始于足下
- 前端開(kāi)發(fā)使用 nodejs 環(huán)境，能夠搭建如同工廠流水線一樣的開(kāi)發(fā)
環(huán)境吉捶。那是極好的。相比于以前的純手工生產(chǎn)是有極大的提高的皆尔。 - 包管理 npm呐舔，在于合作，好用慷蠕。能夠自動(dòng)處理管理以及處理依賴(lài)珊拼，簡(jiǎn)化我們使用別人已經(jīng)寫(xiě)好的模塊的過(guò)程。管理的對(duì)象就是貢獻(xiàn)者已經(jīng)寫(xiě)好的模塊流炕。
- git 用與版本控制澎现，協(xié)作開(kāi)發(fā)。也就是書(shū)面意思每辟。將開(kāi)發(fā)的每個(gè)版本剑辫，每個(gè)變動(dòng)儲(chǔ)存。方便A,B,C....多人有序的開(kāi)發(fā)同一個(gè)項(xiàng)目渠欺，而不至于混亂妹蔽。
簡(jiǎn)單點(diǎn)說(shuō)，就是提高效率挠将，將有限的精力注入到特定的事物上胳岂！也可以說(shuō)是懶，對(duì)舔稀，就是懶乳丰！那是極好的。内贮。产园。
工具簡(jiǎn)介入口
怎么開(kāi)發(fā)
前端開(kāi)發(fā)的基石: JavaScript & CSS & HTML
這么多年過(guò)去了汞斧；結(jié)構(gòu)，表現(xiàn)淆两，交互的架構(gòu)還是沒(méi)有變断箫。
從這三大基石上衍生了無(wú)數(shù)的新事物，
長(zhǎng)江后浪推前浪秋冰，前浪死在沙灘上盆顾。
WEB 開(kāi)發(fā)的本質(zhì)依舊沒(méi)有變阳距。更好的結(jié)構(gòu)，更好的外貌，更好的用戶(hù)體驗(yàn)捣炬。
我們需要理解 WEB 的三大基石；學(xué)會(huì)使用由此衍生出的各類(lèi)框架庫(kù)丐巫。造出一個(gè)更好的產(chǎn)品锨侯。
