├── .gitignore
├── img
└── front-end-chart.png
├── bower.json
├── css
└── style.css
├── index.html
├── js
└── app.js
├── data
└── front-end.json
└── README.md
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules/
2 | *.swp
3 | .DS_Store
4 | upload/
5 | uploads/
6 | bower_components/
--------------------------------------------------------------------------------
/img/front-end-chart.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/foru17/front-end-collect/HEAD/img/front-end-chart.png
--------------------------------------------------------------------------------
/bower.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "front-end-collect-",
3 | "version": "0.0.0",
4 | "license": "MIT",
5 | "ignore": [
6 | "node_modules",
7 | "bower_components",
8 | "test",
9 | "tests"
10 | ],
11 | "dependencies": {
12 | "angular": "~1.2.19",
13 | "d3": "~3.4.9",
14 | "bootstrap": "^3.2.0"
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/css/style.css:
--------------------------------------------------------------------------------
1 | /*Dendrogram*/
2 | .node circle {
3 | fill: #fff;
4 | stroke: steelblue;
5 | stroke-width: 1.5px;
6 | }
7 |
8 | .node {
9 | font: 16px sans-serif;
10 | cursor: pointer;
11 | }
12 |
13 | .node text:hover {
14 | fill: steelblue;
15 | }
16 |
17 | .link {
18 | fill: none;
19 | stroke: #ccc;
20 | stroke-width: 1.5px;
21 | }
22 |
23 | /*tooltip*/
24 | #tooltip {
25 | position: fixed;
26 | width: 200px;
27 | height: auto;
28 | padding: 10px;
29 | background-color: #444;
30 | -webkit-border-radius: 10px;
31 | -moz-border-radius: 10px;
32 | border-radius: 10px;
33 | -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
34 | -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
35 | box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
36 | pointer-events: none;
37 | color: #fff;
38 | }
39 |
40 | #tooltip.hidden {
41 | display: none;
42 | }
43 |
44 | #tooltip p {
45 | margin: 0;
46 | font-family: sans-serif;
47 | font-size: 16px;
48 | line-height: 20px;
49 | }
50 |
51 | .title {
52 | width: 460px;
53 | position: fixed;
54 | top: 10px;
55 | right: -40px;
56 | height: auto;
57 | padding: 10px;
58 | margin: 15px;
59 | background-color: #444;
60 | -webkit-border-radius: 10px;
61 | -moz-border-radius: 10px;
62 | border-radius: 10px;
63 | -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
64 | -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
65 | box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
66 | color: #fff;
67 | }
68 |
69 | a:hover {
70 | text-decoration: none;
71 | }
72 |
73 | /*fix IE10, IE11 type=range can not display in bootstrap style*/
74 | input[type=range] {
75 | width: 200px\0;
76 | display: inline;
77 | }
78 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
17 |
20 |
21 |
22 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
--------------------------------------------------------------------------------
/js/app.js:
--------------------------------------------------------------------------------
1 | angular.module('frontEnd', [])
2 | .factory('data', ['$http', function($http) {
3 | return {
4 | getFrontEndData: function() {
5 | var url = 'data/front-end.json';
6 | return $http.get(url);
7 | }
8 | };
9 | }])
10 | .controller('frontEndCtrl', ['$scope', '$window', 'data',
11 | function($scope, $window, data) {
12 | $scope.type = 'tree';
13 | $scope.frontEndData = '';
14 | $scope.rotate = 0;
15 |
16 | $window.addEventListener('resize', function() {
17 | $scope.$broadcast('windowResize');
18 | });
19 |
20 | data.getFrontEndData()
21 | .success(function(res) {
22 | if (res.error) {
23 | throw new Error(res.message);
24 | } else {
25 | $scope.frontEndData = res
26 | }
27 | });
28 | }
29 | ]).directive('frontEndChart', ['data','$window', '$timeout', function(data, $window, $timeout) {
30 |
31 | var link = function($scope, $el, $attrs) {
32 |
33 | var radius = 960 / 2;
34 |
35 | var tree = d3.layout.tree()
36 | .size([radius*2, radius*2]);
37 |
38 | var diagonalTree = d3.svg.diagonal()
39 | .projection(function(d) { return [d.y, d.x]; });
40 |
41 | var cluster = d3.layout.cluster()
42 | .size([360, radius - 120]);
43 |
44 | var diagonalCluster = d3.svg.diagonal.radial()
45 | .projection(function(d) {
46 | return [d.y, d.x / 180 * Math.PI];
47 | });
48 |
49 | var svg = d3.select($el[0]).append("svg")
50 | .attr("width", document.documentElement.clientWidth)
51 | .attr("height", document.documentElement.clientHeight - 30)
52 | .call(
53 | d3.behavior.zoom().scaleExtent([0.6, 3]).on("zoom", zoom)
54 | );
55 |
56 | var g = svg.append("g")
57 | .attr("transform", "translate(" + radius + "," + radius + ")");
58 |
59 | function zoom () {
60 | //TODO: set translate range
61 | //TODO: after rotate, we need add rotate for zoom translate
62 | g.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")" );
63 | }
64 |
65 | var timeout;
66 |
67 | function rotate(oldValue, newValue){
68 | if (timeout) $timeout.cancel(timeout);
69 | timeout = $timeout(function() {
70 | var rotate = $scope.rotate*6;
71 | var trans = g.attr("transform");
72 | if(trans.indexOf("rotate") !== -1){
73 | trans = trans.replace(/rotate\([^()]*\)/, "rotate(" + rotate + ")");
74 | }else{
75 | trans += "rotate(" + rotate + ")";
76 | }
77 | g.transition().duration(600).attr("transform", trans);
78 | }, 350);
79 | }
80 |
81 | var update = function() {
82 | if ($scope.frontEndData === '') return;
83 |
84 | var data = $scope.frontEndData;
85 |
86 | var nodes = cluster.nodes(data);
87 | var links = cluster.links(nodes);
88 | var diagonal = diagonalCluster;
89 |
90 | g.remove();
91 |
92 | g = svg.append("g")
93 | .attr("transform", "translate(" + radius + "," + radius + ")");
94 |
95 | if($scope.type == 'tree') {
96 | nodes = tree.nodes(data);
97 | links = tree.links(nodes);
98 | diagonal = diagonalTree;
99 | g.attr("transform", "translate(" + 160 + "," + 0 + ")");
100 | }
101 |
102 | var link = g.selectAll("path.link")
103 | .data(links)
104 | .enter().append("path")
105 | .attr("class", "link")
106 | .attr("d", diagonal);
107 |
108 | var node = g.selectAll("g.node")
109 | .data(nodes)
110 | .enter().append("g")
111 | .attr("class", "node")
112 | .attr("transform", function(d) {
113 | if ($scope.type == 'tree') {
114 | return "translate(" + d.y + "," + d.x + ")";
115 | } else {
116 | return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")";
117 | }
118 |
119 | });
120 |
121 | node.append("circle")
122 | .attr("r", 4.5);
123 |
124 | node.append("text")
125 | .attr("dy", ".31em")
126 | .attr("dx", function(d) {
127 | if($scope.type == 'tree') {
128 | return d.children ? -8 : 8;
129 | } else {
130 | return 0;
131 | }
132 | })
133 | .attr("text-anchor", function(d) {
134 | if($scope.type == 'tree') {
135 | return d.children ? "end" : "start";
136 | } else {
137 | return d.x < 180 ? "start" : "end";
138 | }
139 | })
140 | .attr("transform", function(d) {
141 | if ($scope.type == 'tree') {
142 | return "";
143 | } else {
144 | return d.x < 180 ? "translate(8)" : "rotate(180)translate(-8)";
145 | }
146 | })
147 | .text(function(d) {
148 | return d.name;
149 | })
150 | .attr("fill", "#000")
151 | .on("click", function(d){
152 | if(typeof d.url !== "undefined" ){
153 | $window.open(d.url, "_blank");
154 | }
155 | }).on("mouseover", function(d) {
156 |
157 | //Update the tooltip position and value
158 | d3.select("#tooltip")
159 | .style("left", 10 + "px")
160 | .style("top", 40 + "px")
161 | .select("#desc")
162 | .text(d.description)
163 |
164 | d3.select("#name")
165 | .text(d.name);
166 |
167 | //Show the tooltip
168 | d3.select("#tooltip").classed("hidden", false);
169 | })
170 | .on("mouseout", function() {
171 | d3.select("#tooltip").classed("hidden", true);
172 | });
173 | };
174 |
175 | $scope.$watch('frontEndData', update);
176 | $scope.$watch('type', update);
177 | $scope.$watch('rotate', rotate);
178 |
179 | };
180 | return {
181 | template: '',
182 | replace: true,
183 | link: link,
184 | restrict: 'E'
185 | };
186 | }
187 | ]);
--------------------------------------------------------------------------------
/data/front-end.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "前端资料收集",
3 | "description": "在前端路上摸索前行，在这里分享自己长期关注的前端开发相关的优秀网站、博客、以及活跃开发者。",
4 | "url": "https://github.com/hjzheng/front-end-collect",
5 | "children": [{
6 | "name": "聚合&&周报订阅",
7 | "description": "无",
8 | "children": [{
9 | "name": "Html5 Weekly",
10 | "size": 5534,
11 | "url": "http://html5weekly.com/",
12 | "description": "Html相关文章"
13 | }, {
14 | "name": "CSS Weekly",
15 | "size": 5731,
16 | "url": "http://css-weekly.com/",
17 | "description": "CSS相关文章"
18 | }, {
19 | "name": "Javascript Weekly",
20 | "size": 7840,
21 | "url": "http://javascriptweekly.com/",
22 | "description": "JS相关文章，同样也有 html,css 和工具相关"
23 | }, {
24 | "name": "Web Design Weekly",
25 | "size": 7914,
26 | "url": "http://web-design-weekly.com/",
27 | "description": "设计、技术、技巧、工具聚合"
28 | }, {
29 | "name": "UX Weekly",
30 | "size": 4416,
31 | "url": "http://uxwkly.com/",
32 | "description": "用户体验、网页设计相关"
33 | }, {
34 | "name": "Web Tools Weekly",
35 | "size": 7700,
36 | "url": "http://webtoolsweekly.com/",
37 | "description": "JS, 工具推送"
38 | }, {
39 | "name": "RESPONSIVE DESIGN NEWSLETTER",
40 | "size": 8900,
41 | "url": "http://responsivedesignweekly.com/",
42 | "description": "每周推送一次响应式设计相关"
43 | }, {
44 | "name": "Tutorialzine",
45 | "size": 5000,
46 | "url": "http://tutorialzine.com/",
47 | "description": "精品教程和资源推送"
48 | }, {
49 | "name": "Sidebar",
50 | "size": 4600,
51 | "url": "http://sidebar.io/",
52 | "description": "每天、每半周、每周推送5条设计相关"
53 | }, {
54 | "name": "The Hacker News Newsletter",
55 | "size": 9600,
56 | "url": "http://www.hackernewsletter.com/",
57 | "description": "HN 每周精选"
58 | }, {
59 | "name": "Design News",
60 | "size": 5600,
61 | "url": "https://news.layervault.com/",
62 | "description": "F2类资讯聚合"
63 | }, {
64 | "name": "HACKDESIGN",
65 | "size": 4600,
66 | "url": "http://hackdesign.org/",
67 | "description": "每周发布一个设计类课程"
68 | }]
69 | }, {
70 | "name": "专业博客",
71 | "description": "无",
72 | "children": [{
73 | "name": "中文博客",
74 | "description": "无",
75 | "children": [{
76 | "name": "W3Cplus",
77 | "size": 4700,
78 | "url": "http://www.w3cplus.com/",
79 | "description": "国内最优秀的前端博客，原创居多"
80 | }, {
81 | "name": "W3Cfuns",
82 | "size": 4700,
83 | "url": "http://www.w3cfuns.com/",
84 | "description": "专注于web前端开发行业的综合性门户网站"
85 | }, {
86 | "name": "前端观察",
87 | "size": 6700,
88 | "url": "http://www.qianduan.net/",
89 | "description": "曾经最优秀，最近更新不频繁了"
90 | }, {
91 | "name": "腾讯web前端",
92 | "size": 7800,
93 | "url": "http://www.alloyteam.com/",
94 | "description": "来自于腾讯SNG(社交网络事业群)"
95 | }, {
96 | "name": "张鑫旭-鑫空间-鑫生活",
97 | "size": 8000,
98 | "url": "http://www.zhangxinxu.com/wordpress/",
99 | "description": "重构很厉害，不少经典文章经验"
100 | }, {
101 | "name": "ria之家",
102 | "size": 4000,
103 | "url": "http://www.36ria.com/",
104 | "description": "无"
105 | }, {
106 | "name": "大前端",
107 | "size": 4000,
108 | "url": "http://www.daqianduan.com/",
109 | "description": "无"
110 | }, {
111 | "name": "CSS森林",
112 | "size": 8000,
113 | "url": "http://www.cssforest.org/blog/",
114 | "description": "无"
115 | }, {
116 | "name": "设计达人",
117 | "size": 8000,
118 | "url": "http://www.shejidaren.com/",
119 | "description": "更新较频繁，但转载也较多"
120 | }, {
121 | "name": "Be For Web",
122 | "size": 5000,
123 | "url": "http://beforweb.com/",
124 | "description": "关注移动应用及互联网产品、用户体验设计、前端开发"
125 | }]
126 | }, {
127 | "name": "国外博客",
128 | "description": "无",
129 | "children": [{
130 | "name": "Smashing Magazine",
131 | "size": 6700,
132 | "url": "http://www.smashingmagazine.com/",
133 | "description": "业界权威，web 设计很赞"
134 | }, {
135 | "name": "Tuts",
136 | "size": 3200,
137 | "url": "http://tutsplus.com/tutorials",
138 | "description": "国外知名开发者网站"
139 | }, {
140 | "name": "Developer Drive",
141 | "size": 5600,
142 | "url": "http://www.developerdrive.com/",
143 | "description": "优质前端技术信息"
144 | }, {
145 | "name": "CSS-TRICKS",
146 | "size": 5000,
147 | "url": "http://css-tricks.com/",
148 | "description": "无"
149 | }, {
150 | "name": "Web Designer Wall",
151 | "size": 7000,
152 | "url": "http://webdesignerwall.com/",
153 | "description": "优质 Html5,CSS3等教程"
154 | }, {
155 | "name": "Tutorialzine",
156 | "size": 5200,
157 | "url": "http://tutorialzine.com/",
158 | "description": "大量 web 教程和资源"
159 | }, {
160 | "name": "Inspect Element",
161 | "size": 6302,
162 | "url": "http://inspectelement.com/",
163 | "description": "CSS,wordpress 相关教程挺多"
164 | }, {
165 | "name": "Codrops",
166 | "size": 4100,
167 | "url": "http://tympanus.net/codrops/",
168 | "description": "设计、交互、CSS"
169 | }, {
170 | "name": "Jake Rutter",
171 | "size": 4700,
172 | "url": "http://www.onerutter.com/",
173 | "description": "Jquery 作者，不解释了"
174 | }, {
175 | "name": "Paul Irish",
176 | "size": 4600,
177 | "url": "http://www.paulirish.com/",
178 | "description": "大神,Google Chrome团队,Yeoman"
179 | }, {
180 | "name": "Krasimir Tsonev",
181 | "size": 5600,
182 | "url": "http://krasimirtsonev.com/blog",
183 | "description": "html5,css3,javascript"
184 | }, {
185 | "name": "NCZOnline",
186 | "size": 4500,
187 | "url": "http://www.nczonline.net/",
188 | "description": "html5,css3,javascript"
189 | }]
190 | }]
191 | }, {
192 | "name": "活跃微博",
193 | "description": "无",
194 | "children": [{
195 | "name": "@w3c中国",
196 | "size": 3600,
197 | "url": "http://weibo.com/w3cchina",
198 | "description": "万维网联盟中国办事处官方微博"
199 | }, {
200 | "name": "@TheFrontEnd",
201 | "size": 3800,
202 | "url": "http://weibo.com/javascriptdev",
203 | "description": "JavaScript技术资讯、新闻、教程、深度文章。"
204 | }, {
205 | "name": "@前端快爆",
206 | "size": 4600,
207 | "url": "http://weibo.com/fekb",
208 | "description": "爆前端资讯，谈中外技术"
209 | }, {
210 | "name": "@HTML5中国",
211 | "size": 4200,
212 | "url": "http://weibo.com/html5cn",
213 | "description": "html5学习、实战、交流平台html5中国www.html5cn.org官方微博"
214 | }, {
215 | "name": "@developerWorks",
216 | "size": 4700,
217 | "url": "http://weibo.com/developerworks",
218 | "description": "码农周刊（manong.io）& 开发者头条（toutiao.io）"
219 | }]
220 | }, {
221 | "name": "开发者",
222 | "description": "微博微信流行后，明显感觉到写博客的人还是越来越少了，下面推荐的这些开发者属于在网上比较活跃的，或者博客积累了大量优质资源的。",
223 | "children": [ {
224 | "name": "阮一峰",
225 | "size": 2600,
226 | "url": "http://www.ruanyifeng.com/blog/",
227 | "description": "阮一峰，70后，英文名Frank。他原是上海财经大学世界经济博士研究生。主要研究宏观金融、货币政策与美国经济。"
228 | }, {
229 | "name": "老赵",
230 | "size": 2700,
231 | "url": "http://blog.zhaojie.me/",
232 | "description": "赵劼，网名老赵，洋名Jeffrey Zhao，花名赵姐夫，金融行业程序员，目前就职于摩根大通（香港）。"
233 | }, {
234 | "name": "玉伯",
235 | "size": 2800,
236 | "url": "https://github.com/lifesinger",
237 | "description": "seajs作者"
238 | }, {
239 | "name": "kejun",
240 | "size": 2600,
241 | "url": "http://hikejun.com/",
242 | "description": "张克军，豆瓣前端工程师"
243 | }, {
244 | "name": "winter",
245 | "size": 2900,
246 | "url": "http://winter-cn.cnblogs.com/",
247 | "description": "无"
248 | }, {
249 | "name": "左耳朵耗子",
250 | "size": 3400,
251 | "url": "http://coolshell.cn/",
252 | "description": "陈皓（@左耳朵耗子），酷壳coolshell.cn博主。14年软件开发相关工作经验，8年以上项目和团队管理经验，6年的软件行业咨询经验。"
253 | }, {
254 | "name": "朴灵",
255 | "size": 2500,
256 | "url": "https://github.com/JacksonTian",
257 | "description": "淘宝数据平台产品部资深前端开发工程师 朴灵"
258 | }, {
259 | "name": "陈广琛",
260 | "size": 3000,
261 | "url": "http://catchen.biz/home.zh-CN.html",
262 | "description": "陈广琛（网名 Cat Chen），前端工程师，现就职于 Facebook。"
263 | }, {
264 | "name": "BYVod",
265 | "size": 3200,
266 | "url": "https://www.byvoid.com/",
267 | "description": "就职于Facebook(英国)"
268 | }, {
269 | "name": "郭宇",
270 | "size": 2800,
271 | "url": "http://blog.guoyu.me/",
272 | "description": "就职于支付宝"
273 | }, {
274 | "name": "大猫",
275 | "size": 2600,
276 | "url": "http://bigc.at/",
277 | "description": "无"
278 | }, {
279 | "name": "C7120",
280 | "size": 2700,
281 | "url": "http://beforweb.com/",
282 | "description": "UX玩家、交互设计师、猫奴、guitar fucker，现就职于腾讯ISUX(上海)"
283 | }, {
284 | "name": "lucifr",
285 | "size": 3000,
286 | "url": "",
287 | "description": "Geek | 拖延症患者 | 间歇性话痨 | 爱 Google | 爱 Mac | Hackintosher | Octopressor | Nikon D90 | Bookmarker | and more."
288 | }, {
289 | "name": "Smallni",
290 | "size": 3200,
291 | "url": "http://www.smallni.com",
292 | "description": "本名丁小倪，小名小倪，英文名Smallni，混迹于互联网，目前在南极洲企鹅村打杂，崇尚简单一目了然的设计风格，注重代码的性能和易维护性，也关注信息无障碍和用户心理学。有点不自信，所以正在努力学习，为早日成为祖国的可树之才而努力。目前同时兼职于W3C CSS工作组和HTML工作组，致力于为WEB标准贡献自己的绵薄之力。"
293 | }, {
294 | "name": "TQ",
295 | "size": 2700,
296 | "url": "http://targetkiller.net/",
297 | "description": "Hi，我是TQ，刚毕业小前端，现就职腾讯ISUX。喜欢折腾前端技术，关注互联网前沿资讯，崇尚简洁至上的设计和交互。"
298 | }, {
299 | "name": "LOO2K",
300 | "size": 3400,
301 | "url": "http://loo2k.com/blog/",
302 | "description": "无"
303 | }, {
304 | "name": "周爱民",
305 | "size": "3200",
306 | "url": "http://blog.csdn.net/aimingoo/",
307 | "description": "国内软件开发界资深软件工程师，从1996年开始涉足商业软件开发，历任部门经理、区域总经理、高级软件工程师、平台架构师等职。周爱民先生在软件开发、软件工程、团队建设以及部门管理方面经验丰富，是Borland Delphi产品技术专家，也是Qomo开源项目（JavaScript）的发起者。在JavaScript开发方面，有超过9年的实践经验。"
308 | }, {
309 | "name": "司徒正美",
310 | "size": 3500,
311 | "url": "http://www.cnblogs.com/rubylouvre",
312 | "description": "无"
313 | }, {
314 | "name": "安记",
315 | "size": 2200,
316 | "url": "http://cssha.com/",
317 | "description": "Hi，我是阿安,双子座，宅男，喜欢编程，更爱足球。现居北京，就职于去哪儿网，前端开发工程师。"
318 | }]
319 | }, {
320 | "name": "社区",
321 | "description": "",
322 | "children": [{
323 | "name": "V2EX",
324 | "size": 3000,
325 | "url": "http://v2ex.com/",
326 | "description": "小众活跃社区"
327 | }, {
328 | "name": "Node.js 中文社区",
329 | "size": 6000,
330 | "url": "http://cnodejs.org/",
331 | "description": "Node.js 国内最活跃的社区"
332 | }]
333 | }, {
334 | "name": "企业博客",
335 | "description": "",
336 | "children": [{
337 | "name": "ISUX 社交用户体验设计",
338 | "size": 9000,
339 | "url": "http://isux.tencent.com/",
340 | "description": "负责腾讯的社交网络相关产品的用户体验设计与研究。"
341 | }, {
342 | "name": "腾讯 CDC",
343 | "size": 4700,
344 | "url": "http://cdc.tencent.com/",
345 | "description": "CDC成立于2006年5月18日,全称是Customer Research & User Experience Design Center（即用户研究与体验设计中心）作为腾讯的核心部门之一。CDC自成立以来，就一直向着“做世界一流的互联网设计团队，为用户创造优质‘在线生活’体验”这一愿景努力，致力于不断提升腾讯全线产品的用户体验。"
346 | }, {
347 | "name": "TID",
348 | "size": 7000,
349 | "url": "http://tid.tenpay.com/",
350 | "description": "腾讯财付通设计中心"
351 | }, {
352 | "name": "MXD",
353 | "size": 7000,
354 | "url": "http://mxd.tencent.com/",
355 | "description": "腾讯MXD移动互联网设计中心"
356 | }, {
357 | "name": "新浪UED",
358 | "size": 5000,
359 | "url": "http://ued.sina.com.cn/",
360 | "description": "无"
361 | }, {
362 | "name": "网易UED",
363 | "size": 4000,
364 | "url": "http://uedc.163.com/",
365 | "description": "网易用户体验设计中心（User Experience Design Center），简称“设计中心（UEDC）”，成立于2008年底。"
366 | }, {
367 | "name": "阿里巴巴（中国站）UED",
368 | "size": 6000,
369 | "url": "http://www.aliued.cn/",
370 | "description": "阿里巴巴中国站UED成立于1999年，全称是用户体验设计部（User Experience Design Department），花名为“有一点”，是阿里巴巴集团最资深的部门之一。"
371 | }, {
372 | "name": "携程UED",
373 | "size": 6000,
374 | "url": "http://ued.ctrip.com/blog/",
375 | "description": "携程UED,携程前端开发团队,UED,Javascript,重构,ux"
376 | }, {
377 | "name": "百度FEX",
378 | "size": 6000,
379 | "url": "http://fex.baidu.com/",
380 | "description": "百度前端团队Blog,关注前端技术，还更重视全端及全栈的能力"
381 | }]
382 | }, {
383 | "name": "书籍",
384 | "description": "",
385 | "children": [{
386 | "name": "JavaScript语言精粹",
387 | "size": 3000,
388 | "url": "http://book.douban.com/subject/3590768/",
389 | "description": "绝对经典，相信看完后，对Javascript这门语言有了重新认识，原来这个语言是这么的美丽！"
390 | }]
391 | }]
392 | }
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | 前端收集
2 | =================
3 |
4 | 在前端路上摸索前行，在这里分享自己长期关注的前端开发相关的优秀网站、博客、以及活跃开发者。欢迎更新，以下各排名不分先后顺序。
5 |
6 | 自己 RSS 长期订阅了一些IT 和技术相关博客，这里是我Feedly 输出的opml，可直接导入一些RSS 阅读器:
7 | [https://github.com/foru17/luolei-dotfiles/blob/master/feedly.opml](https://github.com/foru17/luolei-dotfiles/blob/master/feedly.opml)
8 |
9 | #### [前端收集图谱](http://get-set.cn/front-end-collect/)
10 |
11 | 此部分为[@jikeytang ](https://github.com/jikeytang)贡献
12 |
13 | - clone https://github.com/foru17/front-end-collect
14 | - cd front-end-collect
15 | - bower install
16 | - 放入你喜欢的web容器,访问index.html即可
17 | - 你也直接可以访问: [https://front-end-collect.is26.com](https://front-end-collect.is26.com)
18 | - 支持Chrome, Firefox and IE10&11以上浏览器
19 |
20 | #### 聚合&&周报订阅
21 |
22 | |名称 |订阅地址 | 介绍 |
23 | | ----- | ----- | ------ |
24 | |**英文推送**|||
25 | |Html5 Weekly|http://html5weekly.com/| Html 技术类|
26 | |CSS Weekly|http://css-weekly.com/| |
27 | |Javascript Weekly|http://javascriptweekly.com/|JS相关，同样有 html,css 和工具相关|
28 | |Web Design Weekly| http://web-design-weekly.com/ | 设计、技术、技巧、工具聚合|
29 | |UX Weekly|http://uxwkly.com/|用户体验、网页设计推送|
30 | |Web Tools Weekly|http://webtoolsweekly.com/|Js，工具推送|
31 | |RESPONSIVE DESIGN NEWSLETTER|http://responsivedesignweekly.com/|每周推送一次响应式设计相关|
32 | |Tutorialzine|http://tutorialzine.com/|精品教程和资源推送|
33 | |Sidebar|http://sidebar.io/|每天、每半周、每周推送5条设计相关|
34 | |The Hacker News Newsletter|http://www.hackernewsletter.com/|HN 每周精选|
35 | |Design News|https://news.layervault.com/|F2类资讯聚合|
36 | |Css Animations|http://cssanimation.rocks/|关于CSS动画的订阅
37 | |HACKDESIGN|http://hackdesign.org/|每周发布一个设计类课程|
38 | |**中文推送**|||
39 | |稀土:掘金|http://gold.xitu.io/|国内十分用心的开发者技术分享、交流平台|
40 | |SegmentFault精选 |http://segmentfault.com/|国内开发者技术问答社区每周精选问答|
41 | |FE Weekly|http://www.feweekly.com/|每周一次，内容主要是英文的，不过有中文导读
42 | |EchoJs_News|http://www.echojs.com/|每天推送若干好文，都是英文的，JS技术类|
43 | | 碼天狗週刊 |http://weekly.codetengu.com/|台湾的，一份開發者導向的IT 技術週刊，適合所有患有資訊焦慮症、氣血循環不順以及性受挫的軟體工程師們。|
44 | |Github Issue Blog Reader|https://gitissue.com|Github Issue 博客聚合平台，每天更新内容，可及时关注阅读|
45 |
46 |
47 | ## 专业博客
48 |
49 | 注:此处`活跃度`为博客更新频率，`原创度`指的是作者原创或者翻译的文章所占博文比例。请尊重原创，大量转载其他网站资讯的网站和聚合类网站不做推荐。
50 |
51 | #### 中文博客
52 | |名称 |活跃度 | 原创度 | 维护者|其他|
53 | | ----- | ----- | ------ |----- |-----|
54 | |[W3Cplus](http://www.w3cplus.com/)|★★★★★|★★★★★|携程 @大漠 |国内最优秀的前端博客，原创居多|
55 | |[W3Cfuns](http://www.w3cfuns.com/)|★★★★★|★★★★☆|[#](http://www.w3cfuns.com/misc.php?mod=faq&action=faq&id=1) |专注于web前端开发行业的综合性门户网站|
56 | |[前端观察](http://www.qianduan.net/)|★★★★☆|★★★★☆|腾讯 ISUX @神飞|曾经最优秀，最近更新不频繁了|
57 | |[腾讯web前端 AlloyTeam 团队](http://www.alloyteam.com/)|★★★★|★★★★|[@腾讯AlloyTeam](http://t.qq.com/AlloyTeam)|来自于腾讯SNG(社交网络事业群)|
58 | |[张鑫旭-鑫空间-鑫生活](http://www.zhangxinxu.com/wordpress/)|★★★★☆|★★★★★|张鑫旭|重构很厉害，不少经典文章经验|
59 | |[ria之家](http://www.36ria.com/)|★★★★☆|★★★★☆|淘宝 @明河|#|
60 | |[大前端](http://www.daqianduan.com/)|★★★★☆|★★★★☆|[#](http://www.cssforest.org/blog/index.php?s=about)|#|
61 | |[CSS森林](http://www.cssforest.org/blog/)|★★★★☆|★★★★☆|[关于](http://www.cssforest.org/blog/index.php?s=about)|#|
62 | |[设计达人](http://www.shejidaren.com/)|★★★★☆|★★★☆☆|[#](http://www.cssforest.org/blog/index.php?s=about)|更新较频繁，但转载也较多|
63 | |[阮一峰博客](http://www.ruanyifeng.com/blog/)|★★★★☆|★★★☆☆|[#](http://www.ruanyifeng.com/about.html)|牛人一个|
64 | |[Be For Web - 为网而生 - 原创译文博客](http://beforweb.com/)|★★★★☆|★★★★☆|[@C7210](http://weibo.com/c7210)|关注移动应用及互联网产品、用户体验设计、前端开发|
65 |
66 | #### 国外博客
67 |
68 | |名称 |活跃度 | 原创度 | 维护者|其他|
69 | | ----- | ----- | ------ |----- |------|
70 | |[Smashing Magazine](http://www.smashingmagazine.com/)|★★★★★|★★★★★| # |业界权威，web 设计很赞|
71 | |[Tuts](http://hub.tutsplus.com/)|★★★★★|★★★★★| - |国外知名开发者网站|
72 | |[DeveloperDrive](http://www.developerdrive.com/)|★★★★★|★★★★★| - |优质前端技术信息|
73 | |[CSS-TRICKS](http://css-tricks.com/)|★★★★★|★★★★★| Chris Coyier |左边这位是大神|
74 | |[Web Designer Wall](http://webdesignerwall.com/)|★★★★★|★★★★★| Nick La.|优质 Html5,CSS3等教程|
75 | |[Tutorialzine](http://tutorialzine.com/)|★★★★★|★★★★★| #|大量 web 教程和资源|
76 | |[Inspect Element](http://inspectelement.com/)|★★★★★|★★★★★| #|CSS,wordpress 相关教程挺多|
77 | |[Codrops](http://tympanus.net/codrops/)|★★★★★|★★★★★| #|设计、交互、CSS|
78 | |[Jake Rutter](http://www.onerutter.com/)|★★★★★|★★★★★| Jake Rutter|Jquery 作者，不解释了|
79 | |[Paul Irish](http://www.paulirish.com/)|★★★★★|★★★★★| Paul Irish|大神,Google Chrome团队,Yeoman|
80 | |[Krasimir Tsonev](http://krasimirtsonev.com/blog)|★★★★★|★★★★★| Krasimir Tsonev|html5,ccs3,javascript|
81 | |[NCZOnline](http://www.nczonline.net/)|★★★★★|★★★★★| Nicholas C. Zakas |html5,ccs3,javascript|
82 | |[HTML5 Rocks](http://www.html5rocks.com/en/)|★★★★★|★★★★★| # |html5权威网站|
83 | |[A List Apart](http://alistapart.com/)|★★★★★|★★★★★| # |可以改变世界的文章|
84 | |[hakim](http://hakim.se/)|★★★★★|★★★★★| HAKIM EL HATTAB|ccs3,javascript|
85 | |[DailyJS](http://dailyjs.com/) | ★★★★★ | ★★★★★ | # | javascript |
86 |
87 | #### 活跃微博
88 | |ID |公司 | 简介 |
89 | |-----|------|------|
90 | |[@稀土圈](http://weibo.com/xitucircle)|#|强烈推荐，分享一些技术文章和Github项目|
91 | |[@w3c中国](http://weibo.com/w3cchina)|#|万维网联盟中国办事处官方微博|
92 | |[@TheFrontEnd](http://weibo.com/javascriptdev)|#|JavaScript技术资讯、新闻、教程、深度文章。|
93 | |[@前端快爆](http://weibo.com/fekb)|阿里巴巴|有HTML5、CSS3、JS |
94 | |[@HTML5中国](http://e.weibo.com/html5cn)|#|中国www.html5cn.org官方微博|
95 | |[@GitHubDaily](http://e.weibo.com/githubdaily)|#|专注于分享 GitHub 最新的优质开源项目:sparkles:|
96 |
97 | #### 开发者博客
98 |
99 | 微博微信流行后，明显感觉到写博客的人还是越来越少了，下面推荐的这些开发者属于在网上比较活跃的，或者博客积累了大量优质资源的。
100 |
101 | ##### 国内开发者
102 |
103 | 国内开发者一块欢迎大家 `Fork`提交推荐，最好能推荐一些在前端界较活跃的的开发者。
104 |
105 | |ID |博客 |微博 |Github|Twitter| 公司 |关键字|
106 | |-----|-----|------|------|-----|-----|------|
107 | |阮一峰|[阮一峰博客](http://www.ruanyifeng.com/blog/)|[@ruanyf](http://weibo.com/ruanyf)|[@ruanyf](https://github.com/ruanyf)|[@ruanyf](https://twitter.com/ruanyf)|上海金融学院国际金融学院| 教师，博客写作人，翻译人，《黑客与画家》的译者|
108 | |老赵| http://blog.zhaojie.me/|[@老赵](http://weibo.com/jeffz)|#|[#]()|摩根大通（香港）| 资深码农|
109 | |玉伯|[岁月如歌](http://lifesinger.wordpress.com/)|[@玉伯也叫射雕](http://weibo.com/lifesinger)|[@lifesinger](https://github.com/lifesinger)|[@lifesinger](https://twitter.com/lifesinger)| 支付宝|大牛|
110 | | kejun |http://hikejun.com/|[@kejunz](http://weibo.com/kejunz)|[@kejunz](https://github.com/kejun)|#| 豆瓣|前端大神|
111 | |寒冬winter|[winter-cn](http://winter-cn.cnblogs.com/)|[@寒冬winter](http://weibo.com/wintercn)|#|#|#|#|
112 | |左耳朵耗子|[酷壳](http://coolshell.cn/)|[@左耳朵耗子](http://weibo.com/haoel)|#|[@haoel](https://twitter.com/haoel)|淘宝|#|
113 | |fool2fish|#|[@fool2fish](http://weibo.com/fool2fish)|#|#|支付宝|#|
114 | |朴灵|[Html5fiy](http://html5ify.com/)|[@朴灵](http://weibo.com/shyvo)|[JacksonTian](https://github.com/JacksonTian)|#|阿里巴巴|《深入浅出Node.js》作者,大牛|
115 | |Cat Chen|[陈广琛](https://catchen.me/)|[@CatChen](http://weibo.com/u/1640352230)|[@CatChen](https://github.com/CatChen)|[@CatChen](https://twitter.com/CatChen)|Facebook |大牛|
116 | |BYVoid|[Beyond the Void](https://www.byvoid.com/)|[@BYVoid](http://weibo.com/byvoid)|[@BYVoid](https://github.com/BYVoid)|[@BYVoid](https://twitter.com/byvoid)|Facebook 英国|《Node.js 开发指南》作者,大牛|
117 | |勾三股四|#|[@勾三股四](http://weibo.com/mx006)|#|#|淘宝|#|
118 | |cnberg|[冰山一角](http://cnberg.com)|[@berg](http://weibo.com/berg)|@cnberg|[@cnberg]()| 百度| 骑行|
119 | |小胡子哥|[barretlee](http://www.barretlee.com/)|[@Barret李靖](http://weibo.com/173248656)|[@barretlee](https://github.com/barretlee)|#|#|阿里巴巴|
120 | |小鱼|[sofish](http://sofish.de/)|[@sofish](http://weibo.com/sofish)|#|#|#|饿了么前端|
121 | |屈光宇|[Jerry Qu的小站](https://imququ.com/)|[屈光宇](http://weibo.com/jerryqu)|#|#|#|奇虎360前端,HTTP,Node。js|
122 | |郭宇|[Einmal ist keinmal](http://blog.guoyu.me/)|[@郭宇](http://weibo.com/137601206)|[@guo-yu](https://github.com/guo-yu)|[@turingou](https://twitter.com/turingou)|今日头条 | Node.js|
123 | | 张鑫旭 |[张鑫旭博客](http://www.zhangxinxu.com/wordpress/)|[@张鑫旭](http://weibo.com/zhangxinxu)|[@zhangxinxu](https://github.com/zhangxinxu)|[@zhangxinxu](https://twitter.com/zhangxinxu)| 阅文(腾讯文学) YUED |前端开发|
124 | |罗磊|[罗磊的独立博客](https://luolei.org)|[@罗罗磊磊](http://weibo.com/foru17)|[@foru17](https://github.com/foru17)|[@foru17](https://twitter.com/luoleiorg)|阅文(腾讯文学) YUED |
125 | | hzlzh |[自力博客](https://zlz.im)|[@hzlzh](http://weibo.com/hzlzh)|[@hzlzh](http://github.com/hzlzh)|[@hzlzh](http://twitter.com/hzlzh)| 腾讯|前端开发|
126 | | TQ |http://targetkiller.net/|[@Piser-TQ](http://weibo.com/targetkiller)|[@tqtan](https://twitter.com/tqtan/)|[@targetkiller](https://github.com/targetkiller)| 腾讯 微信 | 前端|
127 | |LOO2K|[LOO2K](http://loo2k.com/blog/)|[@LOO2K](http://weibo.com/loo2k)|[LOO2K](https://github.com/loo2k)|[LOO2K](https://twitter.com/loo2k/)|腾讯 CDC | 前端 |
128 | |大猫| [意淫笔记](http://bigc.at)|[@daemao](http://weibo.com/daemao)|[@Damao](https://github.com/Damao)|[@13igcat](https://twitter.com/13igcat)|腾讯 |[知乎](http://www.zhihu.com/people/13igcat)|
129 | | C7210 |beforweb.com/|[@C7210](http://weibo.com/c7210)|[@C7210](http://twittercom/hzlzh)|[@C7210](http://github.com/hzlzh)|#|UX、交互设计师、视觉与前端|
130 | | kejun |http://hikejun.com/|[#](http://weibo.com/kejun)|[#](http://twittercom/kejun)|[#](http://github.com/hzlzh)| 腾讯|前端开发|
131 | | lucifr |http://lucifr.com/|[@lucifr](http://weibo.com/lucifr)|[@lucifr](http://twittercom/lucifr)|[@lucifr](http://github.com/lucifr)| #|Mac,ios|
132 | | smallni |http://www.smallni.com/|[#](http://weibo.com/hzlzh)|[@Smallni](https://twitter.com/smallniding/)|[#](http://github.com/hzlzh)| 腾讯|前端开发|
133 | |qiqiboy|[qiqiboy](http://www.qiqiboy.com/)|[@qiqiboy](http://weibo.com/qiqiboy)|#|#|老虎证券 |吐槽清理大师开发者|
134 | |周爱民|[aimingoo专栏](http://blog.csdn.net/aimingoo/)|#|#|#|支付宝|JavaScript语言精髓与编程实践作者|
135 | |李松峰|[为之漫笔](http://www.cn-cuckoo.com)|#|#|#|#|高程2等书的译者|
136 | |99css|[99css](http://www.99css.com/)|[@ytzong](http://weibo.com/ytzong)|#|#|#|腾讯一牛|
137 | |秦歌|[Kaven](http://dancewithnet.com/)|#|[@kavenyan](http://twitter.com/kavenyan)|#|#|js语言精粹译者|
138 | |linxz|[linxz](http://www.linxz.de/)|#|#|#|#|css那些事儿的作者|
139 | |Along|[Along's Blog](http://jinlong.github.io/)|[@newwave](http://weibo.com/newwave)|#|#|#|Opera 欧朋一牛|
140 | |安记|[cssha](http://www.cssha.com/)|[@hanan321](http://weibo.com/hanan321)|[hanan198501](https://github.com/hanan198501)|#|#|去哪网一牛|
141 | | 余弦 | [EVILCOS](http://evilcos.me/) | [余弦](http://weibo.com/evilcos) | [evilcos](https://github.com/evilcos) | # | [知道创宇](http://www.knownsec.com/) | 安全（黑客）、架构、团队的各种观点与分享 | # | [冯大辉](http://dbanotes.net/) | 现在就职于丁香园 (http://dxy.cn) ，担任技术团队负责人.
142 |
143 |
144 | #### 一些社区
145 |
146 | |名称 |地址 |介绍 |
147 | |-----|-----|------|
148 | |V2EX|http://v2ex.com/|小众活跃社区|
149 | |稀土掘金|https://juejin.im/|程序员同性交友社区|
150 | |知乎|http://www.zhihu.com/|综合问答社区|
151 | |前端乱炖|http://www.html-js.com/|专业的前端知识平台|
152 | |segmentfault|http://segmentfault.com/|综合问答社区|
153 | |果壳问答|http://www.guokr.com/ask/pending/|综合问答社区|
154 | |Ruby|http://ruby-china.org/|同 V2EX 氛围类似，不局限于Ruby|
155 | |Node.js 中文社区|http://cnodejs.org/|Node.js 国内最活跃的社区|
156 | |Code Wall|https://coderwall.com/|国外技术社区|
157 | | DIV.IO | http://div.io/ | 国内前端技术社区 |
158 | | w3ctech | http://www.w3ctech.com/ | 国内前端技术社区，常有一些线下活动发布 |
159 |
160 |
161 | #### 企业官方博客
162 |
163 | 在开头我的 Feedly 订阅 opml 文件里比较全面。
164 |
165 | |名称 |公司 | 部门|活跃度 | 简介|微博|
166 | | ----- | ----- | ------ | ------ |-----|-----|
167 | | [ISUX 社交用户体验设计](http://isux.tencent.com/) | 腾讯 | ISUX| ★★★★☆|负责腾讯的社交网络相关产品的用户体验设计与研究。|#|
168 | | [腾讯 CDC](http://cdc.tencent.com/) | 腾讯 | CDC| ★★★★☆| 简介 |#|
169 | | [腾讯Web前端 Alloy 团队 Blog](http://www.alloyteam.com/) | 腾讯 | SNG| ★★★★☆|主要负责手机QQ、QQ互联、腾讯Q+、WebQQ项目的团队。 |[alloyteam](http://weibo.com/alloyteam)|
170 | | [TID-财付通设计中心](http://tid.tenpay.com/) | 腾讯 | TID| ★★★★☆|简介 |#|
171 | | [腾讯MXD移动互联网设计中心](http://mxd.tencent.com/) | 腾讯 | MXD| ★★★★☆|简介 |[@腾讯MXD](http://e.t.qq.com/tencent_mxd)|
172 | | [凹凸实验室](https://aotu.io/) | 京东 | FED| ★★★★★|简凹凸实验室(Aotu.io，英文简称O2) 始建于2015年10月，是一个年轻基情的技术团队。 |#|
173 | | [微博UDC](http://udc.weibo.com/) | 新浪 | UDC| ★★★★☆|简介 |[@微博UDC设计中心](http://weibo.com/sudc)|
174 | | [新浪UED](http://ued.sina.com.cn/) | 新浪 | UED| ★★★★☆|简介 |[#](http://weibo.com/sudc)|
175 | | [网易用户体验设计中心](http://uedc.163.com/) | 网易 | UED| ★★★★☆|简介 |[#](http://weibo.com/sudc)|
176 | | [阿里巴巴（中国站）用户体验设计部博客](http://www.aliued.cn/) | 阿里巴巴 | UED| ★★★★☆|简介 |[@Alibaba-UED](http://weibo.com/aliued)|
177 | | [携程UED-携程旅行前端开发团队](http://ued.ctrip.com/blog/) | 携程网 | UED| ★★★☆☆|携程UED,携程前端开发团队,UED,Javascript,重构,ux|#|
178 | | [百度FEX](http://fex.baidu.com/) | 百度 | FEX| ★★★★☆| 百度前端团队Blog,关注前端技术，还更重视全端及全栈的能力。|#|
179 | |[淘宝UED](http://ued.taobao.org/blog/)|淘宝网|UED|★★★★☆|用户体验、交互设计、视觉设计、前端技术博客|[@淘宝UED](http://weibo.com/taobaoued)|
180 |
181 |
182 | #### 书籍
183 |
184 | |名称 | 作者 | 价格 | 出版社|简评 |
185 | | ----- | ----- | ------ |----- |------|
186 | | [Web标准设计](http://book.douban.com/subject/3327829/) | 刘杰（嗷嗷） | RMB 60.00 | 清华大学出版社 |基础入门|
187 | | [大巧不工 : Web前端设计修炼之道](http://book.douban.com/subject/4914146/) | 赖定清 / 林坚 | RMB 59.00 | 机械工业出版社|适合入门，了解前端全局|
188 | |[高性能网站建设指南:前端工程师技能精髓](http://book.douban.com/subject/3132277/)|Steve Souders |RMB 35.00|电子工业出版社|能从原理层理解各种方法|
189 | |[高性能网站建设指南:Web开发者性能优化最佳实践](http://book.douban.com/subject/4719162/)|Steve Souders |RMB 49.80|电子工业出版社|#|
190 | |[Web站点优化 : Web站点优化](http://book.douban.com/subject/4124141/)|金 |RMB 55.00|#|#|
191 | |[Node.js开发指南](http://book.douban.com/subject/10789820/)| 郭家寶 |RMB 45.00|#|作者很牛|
192 | |[JavaScript高级程序设计](http://book.douban.com/subject/10546125/)| Nicholas C. Zakas |RMB 99.00|人民邮电出版社|适合没事就翻翻|
193 | |[JavaScript权威指南](http://book.douban.com/subject/2228378/)| 弗拉纳根 |RMB 109.00|机械工业出版社|犀牛书|
194 | |[JavaScript语言精粹](http://book.douban.com/subject/3590768/)| Douglas Crockford |RMB 35.00| 电子工业出版社|绝对经典，相信看完后，对Javascript这门语言有了重新认识，原来这个语言是这么的美丽！|
195 | |[深入浅出node.js](http://book.douban.com/subject/25768396/)|朴灵|RMB 69.00|人民邮电出版社|一本从前端通往全端的好书|
196 | |[CSS开发王](http://book.douban.com/subject/3137282/)|张亚飞|RMB 49.00|电子工业出版社|适合有一定基础后CSS进阶用|
197 | |[JavaScript DOM编程艺术](http://book.douban.com/subject/6038371/)|Jeremy Keith /Jeffrey Sambells|RMB 49.00|人民邮电出版社|适合Javascript入门看|
198 |
199 |
200 | #### 线上文档参考
201 |
202 | |书名|地址|作者|译者|介绍|
203 | |----|----|----|----|----|
204 | |JavaScript秘密花园|http://bonsaiden.github.io/JavaScript-Garden/zh/|伊沃·韦特泽尔&张易江|[三生石上](http://sanshi.me/)|完整书籍，界面美观，有详细demo|
205 | | Material Design 中文版 | http://design.1sters.com/ | Google设计手册 | 协同翻译 | Google I/O 2014 发布的 Material Design 官方手册的中文翻译 |
206 |
207 |
208 | ## 关于
209 |
210 | 本 repo 会不断更新，感谢推荐和分享新资源的朋友。
211 |
212 |
213 |
--------------------------------------------------------------------------------