這兩天要把公司以前的觸屏設(shè)備的客戶端應(yīng)用做成h5的web應(yīng)用,而且有針對(duì)不同設(shè)備和同一設(shè)備下的不同狀態(tài)(有windows豎屏和橫屏和android的平板),而且都有設(shè)計(jì)師為其針對(duì)的不同設(shè)計(jì)標(biāo)準(zhǔn)包括字體大小和不同ui組件的大小,雖然當(dāng)時(shí)經(jīng)過(guò)討論,公司老員工建議就按照這個(gè)標(biāo)準(zhǔn)去做,不用考慮自適應(yīng),因?yàn)樵O(shè)備就這幾種,但是我是一直不甘心,總想把它做成能適配不同設(shè)備分辨率的東西,所以來(lái)研究這個(gè)問(wèn)題(在了解rem之前,我會(huì)做自適應(yīng),但只是在做了布局上的自適應(yīng),不包括字體)。
因?yàn)樵谥暗墓咀鲞^(guò)的項(xiàng)目中的某些模塊參照過(guò)別的產(chǎn)品,發(fā)現(xiàn)過(guò)有用rem和em的,然后就來(lái)網(wǎng)上研究學(xué)習(xí)了解了下這幾種相對(duì)單位。其中就找到了這篇文章:http://isux.tencent.com/web-app-rem.html,發(fā)現(xiàn)這篇文章對(duì)除了rem來(lái)設(shè)計(jì)界面的其他方法做了介紹和總結(jié)。文章總結(jié)了rem相對(duì)于其他幾種設(shè)計(jì)方法的好處,其他幾種方法的壞處,具體那些壞處朋友可以去看下這篇文章。
之所以之前沒(méi)有去研究學(xué)習(xí)rem,包括之前沒(méi)有去研究接受其他的新技術(shù),比如es6,前端mvvm框架、模塊化開(kāi)發(fā)、項(xiàng)目構(gòu)建,編譯,打包發(fā)布工具等等。是因?yàn)樵谥暗乃诠?,公司任?wù)比較充實(shí),每天都有任務(wù)要做,那時(shí)用的基本都是老技術(shù),單純的用html,css,js,jq,easyui,bootstrap開(kāi)發(fā),雖然有點(diǎn)厭倦,寫(xiě)的代碼比較low,但還好業(yè)務(wù)邏輯這方面比較有趣,有些界面實(shí)現(xiàn)也比較有趣(一直很喜歡做界面),加上我本身工作責(zé)任心強(qiáng),所以那時(shí)每天還算過(guò)得充實(shí)。充實(shí)的結(jié)果導(dǎo)致我每天都在做任務(wù),幾乎每天晚上7,8點(diǎn)下班回家,然后吃飯,再洗涑,再搞會(huì)其他的,基本上就9點(diǎn)過(guò),10點(diǎn)了,這樣下來(lái)一天也比較疲倦,就經(jīng)常導(dǎo)致我無(wú)心再學(xué)習(xí)其他新技術(shù),只想休息放松下,那時(shí)我周6加班還是比較頻繁,然后就基本只有周日了,但是由于想睡懶覺(jué)和要洗衣服,打游戲,所以學(xué)習(xí)時(shí)間也變得比較少了,總得意思就是學(xué)習(xí)時(shí)間變少了(但是我不是完全不學(xué)習(xí),但那時(shí)主要學(xué)習(xí)js和css去了,那本es5我看了好多遍,每次都有新收獲。),當(dāng)然這其中很大原因還是我懶,其實(shí)我還是寫(xiě)了好些博客草稿,只不過(guò)都因?yàn)檫@個(gè)懶的原因沒(méi)有去整理發(fā)布(10篇沒(méi)有發(fā)布)。。。。。
但是那段時(shí)間還是過(guò)得很有價(jià)值的,鍛煉了我編程的思維邏輯(我是后臺(tái)出身,還是有點(diǎn)面向?qū)ο蟮母拍?,學(xué)習(xí)js也不是那么吃力。在學(xué)校學(xué)習(xí)了一年C#.NET,然后當(dāng)初應(yīng)聘的第一份工作是.net,但是公司框架已成熟,對(duì)前端需求大,我就去做了前端,然后愛(ài)上了前端,但是公司的幾個(gè)簡(jiǎn)單常用的小接口還是我寫(xiě)的,雖然借鑒了些百度。到了現(xiàn)在的公司,由于公司需要,我也會(huì)偶爾負(fù)責(zé)后端開(kāi)發(fā),比如公司現(xiàn)在的一個(gè)小型cms,我獨(dú)立開(kāi)發(fā),完全獨(dú)立開(kāi)發(fā),從數(shù)據(jù)庫(kù)到c#.net的數(shù)據(jù)層,業(yè)務(wù)層(業(yè)務(wù)層很少,業(yè)務(wù)主要在前端,除了通用的數(shù)據(jù)接口,后端的業(yè)務(wù)層主要是一些安全驗(yàn)證,比如對(duì)前端編碼過(guò)的where條件解碼,過(guò)濾sql,避免sql注入;所有的一般處理程序只是作為一個(gè)入口,具體的代碼編譯進(jìn)dll,雖然作用可能小,但是總比沒(méi)有好)等等(后臺(tái)用三層架構(gòu),沒(méi)用mvc),通用的數(shù)據(jù)接口和比較常用的接口是自己參照之前公司接口思想寫(xiě)的(包括樹(shù),grid分頁(yè)等),沒(méi)有用第三方框架。當(dāng)然我的C#.NET還是只是皮毛,數(shù)據(jù)庫(kù)設(shè)計(jì)也是會(huì)相對(duì)比較簡(jiǎn)單的的東西,表創(chuàng)建和視圖自己寫(xiě),存儲(chǔ)過(guò)程用的別個(gè)現(xiàn)成的稍微改了一點(diǎn)點(diǎn)(主要是分頁(yè)存儲(chǔ)過(guò)程等通用的,只是加了個(gè)where條件參數(shù)。等我把前端想學(xué)的學(xué)完了,我可能會(huì)去學(xué)sql,學(xué)存儲(chǔ)過(guò)程),當(dāng)然我主要喜歡前端,以后也會(huì)一直向前端發(fā)展,后臺(tái)我只需要懂點(diǎn)皮毛就可以了,有后臺(tái)那個(gè)概念就OK,主要就是了解B&S的前后端的交互,即瀏覽器http和服務(wù)器的交互,以及前后端的生命周期。)。因?yàn)闃I(yè)務(wù)邏輯復(fù)雜好玩,任務(wù)多,當(dāng)業(yè)務(wù)邏輯多到我覺(jué)得我的代碼是垃圾,不堪入目,當(dāng)時(shí)一直沒(méi)有好的方法去解決這些痛點(diǎn),現(xiàn)在才體會(huì)到原來(lái)這些新技術(shù)就是解決這些痛點(diǎn)的,并且這些技術(shù)會(huì)規(guī)范你的項(xiàng)目開(kāi)發(fā)邏輯,深深的體會(huì)到mvvm設(shè)計(jì)模式很適合web前端(這里我很推崇vue,漸進(jìn)式的前端框架,組件化的思想,相對(duì)其他框架來(lái)說(shuō),它做模塊化開(kāi)發(fā),開(kāi)發(fā)大型應(yīng)用會(huì)比較簡(jiǎn)單,環(huán)境搭建也很簡(jiǎn)單,有官方的腳手架工具vue-cli(安裝cli之前,先安裝webpack,最好是用淘寶鏡像cnpm安裝),地址:http://cn.vuejs.o