Web開發(fā)技術(shù)-思維導(dǎo)圖.png

Web 后端知識(shí)體系

API 服務(wù)

• Restful API

網(wǎng)絡(luò)傳輸協(xié)議

• http
• https

Web服務(wù)框架(Java / NodeJs)

數(shù)據(jù)緩存

數(shù)據(jù)庫

• 基礎(chǔ)sql

• 關(guān)系型數(shù)據(jù)庫

  • SqlServer
  • MySQL
  • Oracle

• 非關(guān)系型數(shù)據(jù)庫(NoSQL)

  • Mongodb
  • Redis

服務(wù)器

• Tomcat
• Jetty
• Nginx
• Apache

前端開發(fā)知識(shí)體系

Web開發(fā)中，前端開發(fā)從狹義上講吊奢，是前端工程師使用 HTML糕韧、CSS寺滚、JavaScript 等專業(yè)技能和工具將產(chǎn)品UI設(shè)計(jì)稿實(shí)現(xiàn)成網(wǎng)站產(chǎn)品丁寄，涵蓋用戶PC端氨淌、移動(dòng)端網(wǎng)頁，處理視覺和交互問題伊磺。從廣義上來講盛正，所有用戶終端產(chǎn)品與視覺和交互有關(guān)的部分，都是前端開發(fā)的專業(yè)領(lǐng)域屑埋。

核心技術(shù).png

HTML

HTML的英文全稱是 Hypertext Marked Language豪筝，即超文本標(biāo)記語言。HTML 使用標(biāo)記標(biāo)簽來描述網(wǎng)頁摘能。

• HTML
  行內(nèi)元素：a span img input select
  塊級(jí)元素：div ul ol li dl dt dd h1 p
  空元素：br hr link meta

• HTML5
  • 標(biāo)簽語義化 (nav/section/artical/...):
    標(biāo)簽 “見名知意”续崖，可以通過標(biāo)簽名稱直接鑒別標(biāo)簽的用途和內(nèi)部內(nèi)容；同時(shí)極大的增加了SEO識(shí)別效率徊哑，而且減少了開發(fā)成員之間的溝通袜刷。
• Canvas

• video & radio
• svg

CSS 樣式

CSS...

• CSS(2)
  • 選擇器
• CSS3
  • 新增樣式選擇器
  • 新增樣式屬性
  • flex
  • 動(dòng)畫
• CSS 預(yù)處理語言
  • Sass
  • Less

JavaScript

JavaScript（簡稱“JS”） 是一種具有函數(shù)優(yōu)先的輕量級(jí)，解釋型或即時(shí)編譯型的編程語言墩蔓。

• JS基礎(chǔ)
  • 數(shù)據(jù)類型
    • 基礎(chǔ)數(shù)據(jù)類型
    • 引用數(shù)據(jù)類型
  • this關(guān)鍵字
  • JS原型
  • 繼承
  • Event
    • 事件監(jiān)聽
    • 自定義事件
  • ES6

MV*框架

目前最流行的三大前端框架 Vue奸披、React、Angular

• Angular(泛指)

Vue目前最活躍的前端框架轻局，漸進(jìn)式前端框架。
+ AngularJS(1.^)
+ Angular(2.^)

• React

Vue目前最活躍的前端框架览爵，漸進(jìn)式前端框架镇饮。
+ React
+ React hocks 生命周期
+ React Redux
+ React Native

Vue

Vue目前最活躍的前端框架储藐，漸進(jìn)式前端框架。

Vue 插件

• vue-router
• vuex
• axios

瀏覽器緩存

• Cookie
• localStorage
• sessionStorage
• IndexDB

自動(dòng)化構(gòu)建工具

• Webpack
• Gulp
• Grunt

主流瀏覽器

主流瀏覽器及其內(nèi)核蛛碌，下圖是來自statcounter統(tǒng)計(jì) 2018/11 ～ 2019/11 的世界瀏覽器市場份額占比左医。除圖中所示之外同木，當(dāng)然還有大家熟知的IE和Edge彤路，分別占比1.66%，2.11%远豺。

瀏覽器市場份額.png

• 組成架構(gòu)
  參考
  

  image.png

• 瀏覽器渲染過程

  
  
  瀏覽器渲染過程.png

工作原理

EvenLoop

UI

PS(photoshop)

切圖

配色

簡單頁面UI修改

代碼管理

Git

管理平臺(tái): gitlab丽涩、github