摘要:以下知識(shí)點(diǎn)是前輩師兄總結(jié)基礎(chǔ)語(yǔ)義化標(biāo)簽引進(jìn)了一些新的標(biāo)簽,特別注意等,注意的標(biāo)題結(jié)構(gòu)理解瀏覽器解析的過(guò)程,理解的樹形結(jié)構(gòu),及相應(yīng)理解標(biāo)簽在各個(gè)瀏覽器上的默認(rèn)樣式代理樣式,理解中的重置樣式表的概念理解等功能性標(biāo)簽理解標(biāo)簽,理解文件提交過(guò)程推薦
1、HTML/HTML5基礎(chǔ):以下知識(shí)點(diǎn)是前輩師兄總結(jié)
1.0、語(yǔ)義化H5標(biāo)簽
1.1、H5引進(jìn)了一些新的標(biāo)簽,特別注意article、header、footer、aside、nav等,注意HTML的標(biāo)題結(jié)構(gòu)
1.2、理解瀏覽器解析HTML的過(guò)程,理解DOM的樹形結(jié)構(gòu),及相應(yīng)API
1.3、理解HTML標(biāo)簽在各個(gè)瀏覽器上的默認(rèn)樣式(代理樣式),理解CSS中的重置樣式表的概念
1.4、理解Canvas、SVG、video等功能性標(biāo)簽
1.5、理解form、iframe標(biāo)簽,理解文件提交過(guò)程
推薦書籍:
A、《HTML5秘籍》
2.1、學(xué)習(xí)基礎(chǔ)知識(shí),包括大部分常用屬性、選擇器的用法,要對(duì)大多數(shù)標(biāo)簽有個(gè)基礎(chǔ)概念,在日常使用的基礎(chǔ)上,嘗試學(xué)習(xí)瀏覽器兼容性問(wèn)題,要知道兼容性的主要問(wèn)題及解決方法
2.2、深入理解盒子模型,區(qū)分塊級(jí)元素、行內(nèi)元素,有幾個(gè)比較重要的屬性:display、float、position,一定要弄清楚區(qū)分盒子、行內(nèi)盒子的概念另外可以考慮學(xué)一些預(yù)編譯語(yǔ)言:sass、less,都很簡(jiǎn)單
2.3、學(xué)習(xí)常用框架,可以使用bootstrap構(gòu)建項(xiàng)目
2.4、學(xué)習(xí)框架的代碼組織方式包括:12格柵系統(tǒng)、組件化、組件的風(fēng)格化等
2.5、學(xué)習(xí)CSS3的新功能,特別是動(dòng)畫效果、選擇器
2.6、認(rèn)真學(xué)習(xí)一些CSS對(duì)象化思想,學(xué)習(xí)編寫簡(jiǎn)潔性、高復(fù)用性、高健壯性的CSS
2.7、有空的話,可以看看所謂的扁平化設(shè)計(jì),還有簡(jiǎn)潔性
2.8、理解CSSOM、render、reflow、CSS性能、CSS阻塞概念
學(xué)習(xí)方法:
1、多看別人的代碼,一些設(shè)計(jì)的不錯(cuò)的網(wǎng)站就是很好的學(xué)習(xí)素材,比如拉勾網(wǎng)
2、一定要學(xué)會(huì)使用grunt、gulp壓縮CSS
3、display + position + float 可以組合出很復(fù)雜的效果,多想想盒子模型
4、嘗試在不用float,且position不為absolute的情況下實(shí)現(xiàn)等高、等寬等布局
推薦書籍:
1、《圖靈程序設(shè)計(jì)叢書:HTML5與CSS3設(shè)計(jì)模式》
2、《Web開發(fā)技術(shù)叢書:深入理解Bootstrap》
3、《高流量網(wǎng)站CSS開發(fā)技術(shù)》
4、《CSS設(shè)計(jì)徹底研究》 這個(gè)一定要
5、《Web開發(fā)技術(shù)叢書:深入理解Bootstrap》
6、可以找一些專門講SASS的書,但是我沒找到
7、《CSS權(quán)威指南(第3版)》
3.1、重新學(xué)習(xí)JS語(yǔ)法,注意:表達(dá)式(特別是函數(shù)訪問(wèn)表達(dá)式)、語(yǔ)句、類型(包括類型判斷)注意,這個(gè)時(shí)候主要傾向于“原生”JS哦,不要使用框架
3.2、深入理解JS的“一級(jí)函數(shù)”、對(duì)象、類的概念,學(xué)會(huì)使用函數(shù)來(lái)構(gòu)造類、閉包,學(xué)會(huì)用面向?qū)ο蟮姆绞浇M織代碼
3.3、深入理解JS的作用域、作用域鏈、this對(duì)象(在各種調(diào)用形式中,this的指向)理解函數(shù)的各種調(diào)用方法(call、apply、bind等)
3.4、理解對(duì)象、數(shù)組的概念
理解對(duì)象的“[]”調(diào)用,理解對(duì)象是一種“特殊數(shù)組”
理解for語(yǔ)句的用法
深入理解JS中原始值、包裝對(duì)象的概念(重要)
3.5、學(xué)習(xí)一些常用框架的使用方法,包括:JQUERY、underscore、EXTJS,加分點(diǎn)有:backbone、angularjs、ejs、jade
通過(guò)比較多個(gè)框架的使用方法,想清楚“JS語(yǔ)言極其靈活”這一事實(shí)
總結(jié)常見用法,提高學(xué)習(xí)速度
學(xué)習(xí)模塊化開發(fā)(使用require.js、sea.js等)
3.6、適當(dāng)看一些著名框架的源碼,比如jQuery(不建議看angularjs,太復(fù)雜了)
重要的是學(xué)習(xí)框架中代碼的組織形式,即設(shè)計(jì)模式
3.7、了解JS解釋、運(yùn)行過(guò)程,理解JS的單線程概念
深入理解JS事件、異步、阻塞概念
3.8、理解瀏覽器組成部件,理解V8的概念
學(xué)習(xí)V8的解釋-運(yùn)行過(guò)程
在V8基礎(chǔ)上,學(xué)會(huì)如何提高JS性能
學(xué)會(huì)使用chrome的profile進(jìn)行內(nèi)存泄露分析
學(xué)習(xí)方法:
1、提高對(duì)自己的要求,要有代碼潔癖
2、適當(dāng)?shù)臅r(shí)候看看優(yōu)秀框架的源碼,特別是框架的架構(gòu)模式、設(shè)計(jì)模式
3、多學(xué)學(xué)設(shè)計(jì)模式
4、學(xué)習(xí)原生JS、DOM、BOM、Ajax
推薦書籍:
1、《O"Reilly精品圖書系列:?JavaScript權(quán)威指南(?第6版)》 必看
2、《JavaScript設(shè)計(jì)模式》
3、《WebKit技術(shù)內(nèi)幕》
4、《JavaScript框架高級(jí)編?程:應(yīng)用Prototype YUI Ext JS Dojo MooTools》
5、《用AngularJS開發(fā)下一代Web應(yīng)用》
6、跨終端
6.1、理解混合APP的概念
6.2、理解網(wǎng)頁(yè)在各類終端上的表現(xiàn)
6.3、理解網(wǎng)頁(yè)與原生app的區(qū)同,重在約束
6.4、理解單頁(yè)網(wǎng)站,特別要規(guī)避頁(yè)面的內(nèi)存泄露問(wèn)題
6.5、入門nodejs,對(duì)其有個(gè)基礎(chǔ)概念,知道它能做什么,缺點(diǎn)是什么
推薦書籍:
1、《單頁(yè)Web應(yīng)用:JavaScript從前端到后端 》
2、《Web 2.0界面設(shè)計(jì)模式》
3、《響應(yīng)式Web設(shè)計(jì):HTML5和?CSS3實(shí)戰(zhàn)》
5、工具
學(xué)會(huì)使用grunt進(jìn)行JS、CSS、HTML 壓縮,特別是模塊化js開發(fā)時(shí)候的壓縮
會(huì)用PS進(jìn)行切圖、保存icon
入手sublime、webstorm
學(xué)會(huì)使用chrome調(diào)試面板,特別是:console、network、profile、element
進(jìn)階:
4、性能1.1、理解資源加載的過(guò)程
包括:TCP握手連接、HTTP請(qǐng)求報(bào)文、HTTP回復(fù)報(bào)文
1.2、理解資源加載的性能約束,包括:TCP連接限制、TCP慢啟動(dòng)
1.3、理解CSS文件、JS文件壓縮,理解不同文件放在頁(yè)面不同位置后對(duì)性能的影響
1.4、理解CDN加速
1.5、學(xué)會(huì)使用HTTP頭控制資源緩存,理解cache-control、expire、max-age、ETag對(duì)緩存的影響
1.6、深入理解瀏覽器的render過(guò)程
推薦書籍:
1、《Web性能權(quán)威指南》
2、雅虎網(wǎng)站頁(yè)面性能優(yōu)化的34條黃金守則
2.1、學(xué)習(xí)http協(xié)議,理解http請(qǐng)求-響應(yīng)模式
2.2、理解http是應(yīng)用層協(xié)議,它是構(gòu)建在TCP/IP協(xié)議上的
2.3、理解http報(bào)文(請(qǐng)求-響應(yīng)報(bào)文)
2.4、理解http代理、緩存、網(wǎng)關(guān)等概念,指定如何控制緩存
2.5、理解http協(xié)議內(nèi)容,包括:狀態(tài)碼、http頭、長(zhǎng)連接(http1.1)
2.6、學(xué)習(xí)http服務(wù)器的工作模型,對(duì)靜態(tài)文件、CGI、DHTML的處理流程有個(gè)大致概念
推薦書籍:
1、《HTTP權(quán)威指南》
2、《TCP/IP詳解》
3、《圖解TCP/IP(第5版)》
XSS、SQL注入
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/85548.html
摘要:以下知識(shí)點(diǎn)是前輩師兄總結(jié)基礎(chǔ)語(yǔ)義化標(biāo)簽引進(jìn)了一些新的標(biāo)簽,特別注意等,注意的標(biāo)題結(jié)構(gòu)理解瀏覽器解析的過(guò)程,理解的樹形結(jié)構(gòu),及相應(yīng)理解標(biāo)簽在各個(gè)瀏覽器上的默認(rèn)樣式代理樣式,理解中的重置樣式表的概念理解等功能性標(biāo)簽理解標(biāo)簽,理解文件提交過(guò)程推薦 以下知識(shí)點(diǎn)是前輩師兄總結(jié) 1、HTML/HTML5基礎(chǔ): 1.0、語(yǔ)義化H5標(biāo)簽1.1、H5引進(jìn)了一些新的標(biāo)簽,特別注意article...
摘要:我的書簽我的書簽謹(jǐn)慎導(dǎo)入,小心覆蓋工具類版本管理快速切換源配置教程指南可視化工具前端工具集前端助手網(wǎng)絡(luò)封包截取工具格式化工具標(biāo)注工具模擬請(qǐng)求類深入淺出布局你所不知道的動(dòng)畫技巧與細(xì)節(jié)常用代碼黑魔法小技巧,讓你少寫不必要的,代碼更優(yōu)雅一勞永 我的書簽 我的書簽(謹(jǐn)慎導(dǎo)入,小心覆蓋) 工具類 nvm: node版本管理 nrm: 快速切換npm源 shell: zsh+on-my-zsh配...
摘要:我的書簽我的書簽謹(jǐn)慎導(dǎo)入,小心覆蓋工具類版本管理快速切換源配置教程指南可視化工具前端工具集前端助手網(wǎng)絡(luò)封包截取工具格式化工具標(biāo)注工具模擬請(qǐng)求類深入淺出布局你所不知道的動(dòng)畫技巧與細(xì)節(jié)常用代碼黑魔法小技巧,讓你少寫不必要的,代碼更優(yōu)雅一勞永 我的書簽 我的書簽(謹(jǐn)慎導(dǎo)入,小心覆蓋) 工具類 nvm: node版本管理 nrm: 快速切換npm源 shell: zsh+on-my-zsh配...
摘要:學(xué)習(xí)路線圖建議最后買一個(gè)域名和阿里云服務(wù)器,真正的將代碼部署到云服務(wù)器上去,走一次上線流程,用一下管理一下代碼會(huì)更棒。建議學(xué)習(xí)路線圖這個(gè)時(shí)候使用寫一個(gè)大并發(fā)的多服務(wù)器的秒殺出來(lái)。 PHP學(xué)習(xí)路線圖 在網(wǎng)上很多人公布了太多的PHP學(xué)習(xí)路線圖,本人在互聯(lián)網(wǎng)公司工作十余年,也帶了很多PHP入門的新手,將他們的一些問(wèn)題和學(xué)習(xí)路線圖為大家整理出來(lái),希望很多小白少走彎路。 一、 網(wǎng)上某些錯(cuò)誤的學(xué)習(xí)...
閱讀 1467·2021-11-24 09:39
閱讀 3641·2021-09-29 09:47
閱讀 1584·2021-09-29 09:34
閱讀 3087·2021-09-10 10:51
閱讀 2552·2019-08-30 15:54
閱讀 3230·2019-08-30 15:54
閱讀 883·2019-08-30 11:07
閱讀 1022·2019-08-29 18:36