原创 redux —— 入門實例 TodoList

redux —— 入門實例 TodoList Tip 前端技術真是日新月異,搞完 React 不搭配個數據流都不好意思了。 滿懷期待的心去翻了翻 flux,簡直被官方那意識流的文檔折服了,真是又臭又長還是我智商問題?

原创 一些容易混淆的屬性

CSS 1、offsetTop、offsetLeft與scrollTop、scrollLeft 區別在於有沒有滾動條,有滾動條用後者,沒有滾動條用前者 2、offsetWidth、offsetHeight與scrollWidth、s

原创 用 React.js 寫一個最簡單的 To-do List 應用

最近在學 React.js,也寫了一些練習的項目,之前參考網上的一些代碼寫了一個很簡單的 to-do list。對於初學者來說,寫個基本的 to-do list 對於理解 React 中的一些概念及語法倒是挺有幫助的。 現在很多的 R

原创 徹底解決Webpack打包慢的問題

轉載自:https://segmentfault.com/a/1190000006087638?utm_source=weekly&utm_medium=email&utm_campaign=email_weekly 這幾天寫騰訊實習

原创 React和Redux的連接react-redux

原文鏈接:http://leozdgao.me/reacthe-reduxde-qiao-jie-react-redux/ 之前一直在探索React相關的東西,手上有個SPA項目,於是準備上Redux試試水。Redux本身和Reac

原创 React Router 使用教程

真正學會 React 是一個漫長的過程。 你會發現,它不是一個庫,也不是一個框架,而是一個龐大的體系。想要發揮它的威力,整個技術棧都要配合它改造。你要學習一整套解決方案,從後端到前端,都是全新的做法。 舉例來說,Rea

原创 使用 webpack + react + redux + es6 開發組件化前端項目

因爲最近在工作中嘗試了 webpack、react、redux、es6 技術棧,所以總結出了一套 boilerplate,以便下次做項目時可以快速開始,並進行持續優化。對應的項目地址:webpack-react-redux-es6-

原创 Web Components 是個什麼樣的東西

前端組件化這個主題相關的內容已經火了很久很久,angular 剛出來時的 Directive 到 angular2 的 components,還有 React 的components 等等,無一不是前端組件化的一種實現和探索,但是提上

原创 JS原型題集

本文收集JS原型相關問題,會不斷跟新! 1、題目如下: var fun = function(){} fun.prototype = { name : 'peter', age : 25 }

原创 JavaScript基於時間的動畫算法

目錄 前言基於幀的動畫算法(Frame-based)基於時間的動畫算法(Time-based)改良基於時間的動畫算法總結 前言 前段時間無聊或有聊地做了幾個移動端的HTML5遊戲。放在不同的移動端平臺上進行測試後有了詭異的發現,有些手

原创 20個編寫現代 CSS 代碼的建議

明白何謂Margin Collapse 不同於其他很多屬性,盒模型中垂直方向上的Margin會在相遇時發生崩塌,也就是說當某個元素的底部Margin與另一個元素的頂部Margin相鄰時,只有二者中的較大值會被保留下來,可以從下面這

原创 工具武裝的前端開發工程師

Awesome Mac  這個倉庫主要是收集非常好用的Mac應用程序、軟件以及工具,主要面向開發者和設計師。有這個想法是因爲我最近發了一篇較爲火爆的漲粉兒微信公衆號文章《工具武裝的前端開發工程師》,於是建了這麼一個倉庫,持續更新作爲補

原创 前端雜記

本博客記錄前端學習過程中雜七雜八的知識點,會持續更新…. 1. escape,encodeURI和encodeURIComponent區別 escape不編碼字符有69個:*,+,-,.,/,@,_,0-9,a-z,A-Z;

原创 前端技術棧

        前端的一大特點和一大難點,就是跟上時俱進的各種技術和庫的發展。無論你是不知道到底學React好還是Angular好的初學者,還是總是在糾結Grunt還是Gulp的老鳥,總是會面臨這樣那樣的各種在前端領域中的選擇。以下

原创 深度剖析:如何實現一個 Virtual DOM 算法

轉載自:戴嘉華 目錄: 1 前言2 對前端應用狀態管理思考3 Virtual DOM 算法4 算法實現 4.1 步驟一:用JS對象模擬DOM樹4.2 步驟二:比較兩棵虛擬DOM樹的差異4.3 步驟三:把差異應用到真正的DOM樹上5 結