diff --git a/README.es-es.md b/README.es-es.md new file mode 100644 index 0000000..5e81c10 --- /dev/null +++ b/README.es-es.md @@ -0,0 +1,337 @@ +# Overflow Stack +The overflow stack family (Web Front End Stack, Database Stack, .NET Stack etc.): +http://overflowstack.github.io + +# Localization +English: +https://github.com/unruledboy/WebFrontEndStack/ + +中文: +https://github.com/unruledboy/WebFrontEndStack/blob/master/README.zh-cn.md + +Español: +https://github.com/unruledboy/WebFrontEndStack/blob/master/README.es-es.md + + +# WebFrontEndStack +Web front-end stack: navegadores, plataformas, librerías, frameworks, herramientas etc. + +![Image of Web Front End Stack](Web Front End Stack.png) + +# Genera la imagen + +## Prepara el entorno +Tienes que tener instalado el Visual Studio 2010+ en Windows. + +1. Instalar [nodejs](https://nodejs.org). + +2. Instalar [Phantomjs](http://phantomjs.org). + +3. Instalar [Python 2.7](https://www.python.org/). + +4. ``npm install`` + +Si aparece algún error, comprueba las dependencias de [phantomjs-node](https://github.com/sgentle/phantomjs-node/wiki), [node-gyp](https://github.com/TooTallNate/node-gyp#installation). + +## Ejecución de comandos +``npm start`` para lanzar un servidor done ver el html. + +``npm run build`` para generar la imagen. + + +## Opciones +### Uso + node index task1 \[task2\] \[task3\] .. \[--option=value\] \[--option=value\] ... +#### Tareas +##### phantomjs + Genera la imagen +##### readme + Reconstruye los README. +##### updatestargazers + Actualiza los contadores de estrellas de los proyectos github. +#### Opciones +#### port + Default: 3000 +#### update_existed_stargazers + Default: false + +# ¿Por qué realizar esta tabla? +Alguna vez te has preguntado: +* ¿Cuantas tecnologías se incluyen en el desarrollo Front end? +* ¿Cuantas conozco? + + +No pude encontrar un diagrama muy completo que mostrase la pila de tecnologías involucradas en el desarrollo web front end, así realicé mi propia versión. + +Puede que haya errores, en categorías, enlaces o en nombres de +librerías, o puede que falte alguna que consideres importante, pero +bonito es que puedes modificarlo y arreglarlo como quieras. + +Puedes encontrar una vista previa del gráfico aquí (usa el ratón para +moverte / hacer zoom): + +https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm + + +# The Web Front End Stack + + +- Web Front End + - Navegadores + - [Internet Explorer](http://windows.microsoft.com/en-us/internet-explorer/download-ie) + - [Chrome](http://www.google.com/chrome/) + - [Firefox](https://www.mozilla.org/) + - [Safari](http://www.apple.com/safari/) + - [Opera](http://www.opera.com/) + - [Edge](https://www.microsoft.com/en-us/windows/microsoft-edge) + - [Netscape ;-)](https://en.wikipedia.org/wiki/Netscape) + - Protocolos + - [HTTP/1.1](https://www.ietf.org/rfc/rfc2616.txt) + - URI + - Sesión + - Autenticación + - Petición + - Respuesta + - [HTTP/2](https://en.wikipedia.org/wiki/HTTP/2) + - Compresión + - Minificación + - Server Push + - WebSocket + - The 3 Pillars + - HTML (HyperText Markup Language) + - CSS (Cascading Style Sheets) + - JavaScript + - Estándares + - W3C + - HTML + - CSS + - XHTML + - XML + - Conceptons principales + - HTML + - [DOM](https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model) + - [Element](https://developer.mozilla.org/en-US/docs/Web/API/Element) + - Attribute + - JavaScript + - [Prototype](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype) + - [Scope](https://developer.mozilla.org/en-US/docs/Glossary/Scope) + - [Closure](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures) + - [JSON (JavaSript Object Notation)](https://developer.mozilla.org/en-US/docs/Glossary/JSON) + - [AJAX (Asynchronous JavaScript and XML)](https://developer.mozilla.org/en-US/docs/AJAX) + - CSS + - Selector + - Priority + - Specificity + - Box Model + - Motores de renderizado + - [Trident (IE)](https://en.wikipedia.org/wiki/Trident_(layout_engine)) + - [Blink / prev. WebKit (Chrome)](http://www.chromium.org/blink) + - [Gecko (Firefox)](https://developer.mozilla.org/en-us/docs/Mozilla/Gecko) + - [WebKit (Safari)](http://www.webkit.org/) + - [Blink / prev. Presto (Opera)](http://www.chromium.org/blink) + - [EdgeHTML (Edge)](https://en.wikipedia.org/wiki/EdgeHTML) + - Motores JavaScript + - [JScript (IE8- / ASP)](https://en.wikipedia.org/wiki/JScript) + - [Chakra (IE9+ / Edge)](https://en.wikipedia.org/wiki/Chakra_(JScript_engine)) + - [V8 (Chrome / Opera / Nodejs / MongoDB)](https://developers.google.com/v8/?hl=zh-CN) [[GitHub]](https://github.com/v8/v8/) + - [SpiderMonkey (Firefox)]( https://developer.mozilla.org/en-us/docs/Mozilla/Projects/SpiderMonkey) + - [JavaScriptCore (Safari)](https://en.wikipedia.org/wiki/WebKit#JavaScriptCore) + - Tiempo de ejecución + - Cookie + - Local Cache + - Session Storage + - Local Storage + - Componentes + - Extensiones + - Plugins + - Resources + - Images + - Icons + - Fonts + - Audios + - Videos + - Editores de texto + - [Sublime Text](http://www.sublimetext.com/) + - [WebStorm](https://www.jetbrains.com/webstorm/) + - [Atom](https://atom.io/) [[GitHub]](https://github.com/atom/atom/) + - [Vim](http://www.vim.org/) + - [Emacs](https://www.gnu.org/software/emacs/) + - [Brackets](http://brackets.io/) [[GitHub]](https://github.com/adobe/brackets/) + - [Light Table](http://lighttable.com/) [[GitHub]](https://github.com/LightTable/LightTable/) + - [Visual Studio](https://www.visualstudio.com/) + - [Visual Studio Code (Linux & Mac)](https://code.visualstudio.com/) [[GitHub]](https://github.com/Microsoft/vscode) + - Dreamweaver ;-) + - FrontPage / SharePoint Designer ;-) + - Build Tasks + - Minificación + - Compilación + - Concatenación + - Uglification + - Optimización de imágenes + - Tests unitarios + - Herramientas de tareas + - [Grunt](http://www.gruntjs.com/) [[GitHub]](https://github.com/cowboy/jquery-tiny-pubsub/) + - [Gulp](http://gulpjs.com/) [[GitHub]](https://github.com/gulpjs/gulp/) + - [Brunch](http://brunch.io/) [[GitHub]](https://github.com/brunch/brunch/) + - [Yeoman](http://yeoman.io/) + - Broccoli [[GitHub]](https://github.com/broccolijs/broccoli/) + - Depuración + - [Developer Tools](https://developer.chrome.com/devtools) + - [Firebug](http://getfirebug.com/) [[GitHub]](https://github.com/firebug/firebug/) + - Herramientas base + - [Node.js](https://nodejs.org/) [[GitHub]](https://github.com/joyent/node/) + - [Phantom.js](http://phantomjs.org/) [[GitHub]](https://github.com/ariya/phantomjs/) + - [SpiderMonkey](https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey) + - Calidad + - [JSLint](http://www.jslint.com/) [[GitHub]](https://github.com/douglascrockford/JSLint/) + - [JSHint](http://jshint.com/) [[GitHub]](https://github.com/jshint/jshint/) + - [jscs](http://jscs.info/) [[GitHub]](https://github.com/jscs-dev/node-jscs) + - [Closure Linter](https://developers.google.com/closure/utilities/) + - Gestores de paquetes + - [npm](https://www.npmjs.com/) [[GitHub]](https://github.com/npm/npm/) + - [Bower](http://bower.io/) [[GitHub]](https://github.com/bower/bower/) + - Test + - Herramientas + - [QUnit](https://qunitjs.com/) [[GitHub]](https://github.com/jquery/qunit/) + - [Jasmine](http://jasmine.github.io/) [[GitHub]](https://github.com/jasmine/jasmine/) + - [Mocha](https://mochajs.org/) [[GitHub]](https://github.com/mochajs/mocha/) + - [Selenium](http://www.seleniumhq.org/) [[GitHub]](https://github.com/SeleniumHQ/selenium/) + - [WebDriverIO](http://webdriver.io/) [[GitHub]](https://github.com/webdriverio/webdriverio/) + - [Protractor](http://www.protractortest.org/) + - [Chai](http://chaijs.com/) [[GitHub]](https://github.com/jfirebaugh/konacha/) + - [Sinon.JS](http://sinonjs.org/) [[GitHub]](https://github.com/cjohansen/Sinon.JS/) + - [Karma](http://karma-runner.github.io/) [[GitHub]](https://github.com/karma-runner/karma/) + - nodeunit [[GitHub]](https://github.com/caolan/nodeunit/) + - tape [[GitHub]](http://github.com/substack/tape) + - [nightmare](http://nightmarejs.org/) [[GitHub]](https://github.com/segmentio/nightmare) + - Composite + - [Sauce Labs](https://saucelabs.com/) + - [Browser Stack](https://www.browserstack.com/) + - [Browser Shots](http://browsershots.org/) + - [Browserling](https://www.browserling.com/) + - [Browser Sandbox](https://spoon.net/browsers/) + - [Cross Browser Testing](https://crossbrowsertesting.com/) + - [Browsera](http://www.browsera.com/) + - [SortSite](http://www.powermapper.com/products/sortsite/checks/browser-compatibility/) + - Librerías y frameworks + - JavaScript base library + - [jQuery](https://jquery.com/) [[GitHub]](https://github.com/jquery/jquery/) + - [Prototype](http://prototypejs.org/) [[GitHub]](https://github.com/sstephenson/prototype/) + - [Zepto](http://zeptojs.com/) [[GitHub]](https://github.com/madrobby/zepto/) + - [MooTool](http://mootools.net/) [[GitHub]](https://github.com/mootools/mootools-core/) + - Módulos + - ES6 Module + - CommonJS + - [webpack](http://webpack.github.io/) [[GitHub]](https://github.com/webpack/webpack/) + - [browserify](http://browserify.org/) [[GitHub]](https://github.com/substack/node-browserify/) + - AMD + - [RequireJS](http://requirejs.org/) [[GitHub]](https://github.com/jrburke/requirejs/) + - UMD + - umd [[GitHub]](https://github.com/umdjs/umd/) + - JavaScript Framework + - [AngularJS](https://angularjs.org/) [[GitHub]](https://github.com/angular/angular.js/) + - [Backbone](http://backbonejs.org/) [[GitHub]](https://github.com/jashkenas/backbone/) + - [Knockout](http://knockoutjs.com/) [[GitHub]](https://github.com/SteveSanderson/knockout/) + - [Ember](http://emberjs.com/) [[GitHub]](https://github.com/emberjs/ember.js/) + - [React](http://facebook.github.io/react/) [[GitHub]](https://github.com/facebook/react/) + - [polymer](https://www.polymer-project.org/) [[GitHub]](https://github.com/polymer/polymer/) + - [Deft.js](http://deftjs.org/) [[GitHub]](https://github.com/deftjs/DeftJS/) + - [Vue](http://vuejs.org/) [[GitHub]](https://github.com/yyx990803/vue/) + - [Riot](http://riotjs.com/) [[GitHub]](https://github.com/riot/riot) + - UI framework + - [Bootstrap](http://getbootstrap.com/) [[GitHub]](https://github.com/twbs/bootstrap/) + - [Semantic UI](http://semantic-ui.com/) [[GitHub]](https://github.com/Semantic-Org/Semantic-UI/) + - [Foundation](http://foundation.zurb.com/) [[GitHub]](https://github.com/zurb/foundation/) + - [Material UI](http://material-ui.com/) [[GitHub]](https://github.com/callemall/material-ui/) + - [WinJS](https://dev.windows.com/en-us/develop/winjs) [[GitHub]](https://github.com/winjs/winjs) + - [Pure](http://purecss.io/) [[GitHub]](https://github.com/yahoo/pure/) + - [Amaze UI](http://amazeui.org/) [[GitHub]](https://github.com/allmobilize/amazeui) + - WebSocket + - [Socket.io](http://socket.io/) [[GitHub]](https://github.com/Automattic/socket.io/) + - web-socket-js [[GitHub]](https://github.com/gimite/web-socket-js/) + - Visualización de datos + - [D3](http://d3js.org/) [[GitHub]](https://github.com/mbostock/d3/wiki/Gallery/) + - [Echarts](http://echarts.baidu.com) [[GitHub]](https://github.com/ecomfe/esl/) + - [HighCharts](http://www.highcharts.com/) [[GitHub]](https://github.com/highslide-software/highcharts.com/) + - [Vis.js](http://visjs.org/) [[GitHub]](https://github.com/almende/vis/) + - [Flot](http://www.flotcharts.org/) [[GitHub]](https://github.com/flot/flot/) + - WebGL + - [Three.js](http://threejs.org/) [[GitHub]](https://github.com/mrdoob/three.js/) + - [Babylon.js](http://www.babylonjs.com/) [[GitHub]](https://github.com/BabylonJS/Babylon.js/) + - [Pixi.js](http://www.pixijs.com/) [[GitHub]](https://github.com/GoodBoyDigital/pixi.js/) + - CSS3 Animation + - [Animate.css](https://daneden.github.io/animate.css/) [[GitHub]](https://github.com/daneden/animate.css/) + - [bounce.js](http://bouncejs.com/) [[GitHub]](https://github.com/tictail/bounce.js/) + - [Effeckt.css](https://h5bp.github.io/Effeckt.css/) [[GitHub]](https://github.com/h5bp/Effeckt.css/) + - [move.js](https://visionmedia.github.io/move.js/) [[GitHub]](https://github.com/visionmedia/move.js/) + - Control de flujo + - ES6 + - Promise + - Generator + - ES7 + - yield + - await + - async [[GitHub]](https://github.com/caolan/async/) + - co [[GitHub]](https://github.com/tj/co/) + - Promise + - Bluebird [[GitHub]](https://github.com/petkaantonov/bluebird/) + - q [[GitHub]](https://github.com/kriskowal/q/) + - when.js [[GitHub]](https://github.com/cujojs/when/) + - Funcional + - [bacon.js](http://baconjs.github.io/) [[GitHub]](https://github.com/baconjs/bacon.js/) + - [immutable.js](https://facebook.github.io/immutable-js/) [[GitHub]](https://github.com/facebook/immutable-js/) + - [ramda](http://ramdajs.com/) [[GitHub]](http://github.com/ramda/ramda) + - [underscore.js](http://underscorejs.org/) [[GitHub]](https://github.com/jashkenas/underscore) + - [lodash](https://lodash.com/) [[GitHub]](https://github.com/lodash/lodash) + - [ReactiveX](http://reactivex.io/) [[GitHub]](https://github.com/Reactive-Extensions/RxJS) + - Mobile UI + - [jQuery Mobile](https://jquerymobile.com/) [[GitHub]](https://github.com/jquery/jquery-mobile/) + - [Jo](http://joapp.com/) [[GitHub]](https://github.com/davebalmer/jo/) + - [Dojo Mobile](https://dojotoolkit.org/reference-guide/1.10/dojox/mobile.html) + - [Lungo](http://lungo.tapquo.com/) [[GitHub]](https://github.com/tapquo/Lungo.js/) + - Pre-procesadores CSS + - LESS + - [LESS](http://lesscss.org/) [[GitHub]](https://github.com/less/less.js/) + - [Hat](http://lesshat.madebysource.com/) [[GitHub]](https://github.com/csshat/lesshat/) + - Sass(SCSS) + - [Compass](http://compass-style.org/) [[GitHub]](https://github.com/chriseppstein/compass/) + - [Bourbon](http://bourbon.io/) [[GitHub]](https://github.com/thoughtbot/bourbon/) + - [Gumby](http://www.gumbyframework.com/) [[GitHub]](https://github.com/GumbyFramework/Gumby/) + - Stylus + - nib [[GitHub]](https://github.com/tj/nib/) + - Future Standards + - [babel](https://babeljs.io/) [[GitHub]](https://github.com/babel/babel) + - Plantillas + - [Handlebars](http://handlebarsjs.com/) [[GitHub]](https://github.com/wycats/handlebars.js/) + - [Haml](http://haml.info/) [[GitHub]](https://github.com/haml/haml/) + - [Slim](http://slim-lang.com/) [[GitHub]](https://github.com/slim-template/slim/) + - [Jade](http://jade-lang.com/) [[GitHub]](https://github.com/jadejs/jade/) + - [Ejs](http://www.embeddedjs.com/) + - [Spacebars](http://meteorcapture.com/spacebars/) + - [mustache](http://mustache.github.io/) [[GitHub]](https://github.com/janl/mustache.js/) + - Modernisation + - [Normalize](http://necolas.github.io/normalize.css/) [[GitHub]](https://github.com/necolas/normalize.css/) + - Reset + - Buenas prácticas + - [SEO](https://en.wikipedia.org/wiki/Search_engine_optimization) + - Responsiveness + - [CDN](https://en.wikipedia.org/wiki/Content_delivery_network) + - Seguridad + - Sandbox + - [XSS](https://en.wikipedia.org/wiki/Cross-site_scripting) + - [CORS](http://www.w3.org/TR/cors/) + - Lenguajes intermedios + - [CoffeeScript](http://coffeescript.org/) [[GitHub]](https://github.com/jashkenas/coffeescript/) + - [TypeScript](http://www.typescriptlang.org/) [[GitHub]](https://github.com/Microsoft/TypeScript/) + - ClojureScript [[GitHub]](https://github.com/clojure/clojurescript/) + - [JSX (Facebook)](http://facebook.github.io/react/docs/jsx-in-depth.html) + - Empaquetadores de Apps para móvil + - [PhoneGap / Cordova](https://cordova.apache.org/) [[GitHub]](https://github.com/apache/cordova-android/) + - [MUI](http://dev.dcloud.net.cn/mui/) [[GitHub]](https://github.com/dcloudio/mui/) + - [React Native](https://facebook.github.io/react-native/) [[GitHub]](https://github.com/facebook/react-native/) + - [Ionic](http://ionicframework.com/) [[GitHub]](https://github.com/driftyco/ionic/) + - Desktop Application Development + - [Electron](http://electron.atom.io/) [[GitHub]](https://github.com/atom/electron) + - [NW.js](http://nwjs.io/) [[GitHub]](https://github.com/nwjs/nw.js) + + diff --git a/README.md b/README.md index 902ce9c..8a15b0a 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,9 @@ http://overflowstack.github.io 中文: https://github.com/unruledboy/WebFrontEndStack/blob/master/README.zh-cn.md +Español: +https://github.com/unruledboy/WebFrontEndStack/blob/master/README.es-es.md + # WebFrontEndStack Web front-end stack: browsers, platforms, libraries, frameworks, tools etc. @@ -17,7 +20,7 @@ Web front-end stack: browsers, platforms, libraries, frameworks, tools etc. ## Prepare for environment You should have Visual Studio 2010+ installed in Windows. -1. Install [nodejs](https://nodejs.org). +1. Install [nodejs](https://nodejs.org). (Shoule be >= iojs 1.8.0) 2. Install [Phantomjs](http://phantomjs.org). @@ -34,20 +37,17 @@ If the error occurs, you can check the dependence of [phantomjs-node](https://gi ## Options -### Usage - node index task1 \[task2\] \[task3\] .. \[--option=value\] \[--option=value\] ... -#### Tasks -##### phantomjs - For generate the image. -##### readme - For rebuild the readme. -##### updatestargazers - For Update the count of the Stargazers. -#### Options -#### port - Default: 3000 -#### update_existed_stargazers - Default: false +```bash + + -h, --help Display help message. + -p, --port number (Default: 3000) Set the port what express listening. + -ues, --update_existed_stargazers (Default: false) Update project's stargazers including existed. + --phantomjs The task to generate the image. + --readme The task to update readme. + --updatestargazers The task to update the count of the stargazers. + +``` + # What and why? Have you ever wondered: @@ -57,7 +57,7 @@ Have you ever wondered: I could not find a really comprehensive diagram that shows the web front end technology stack, so I come up with my own version. -There might be issues here and there, like the category, the individual ones, but the beautity is you can modify it as you want. +There might be issues here and there, like the category, the individual ones, but the beauty is you can modify it as you want. You can have a graphical preview here (use mouse to move / zoom): @@ -126,7 +126,7 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - [Chakra (IE9+ / Edge)](https://en.wikipedia.org/wiki/Chakra_(JScript_engine)) - [V8 (Chrome / Opera / Nodejs / MongoDB)](https://developers.google.com/v8/?hl=zh-CN) [[GitHub]](https://github.com/v8/v8/) - [SpiderMonkey (Firefox)]( https://developer.mozilla.org/en-us/docs/Mozilla/Projects/SpiderMonkey) - - [Nitro (Safari)](https://en.wikipedia.org/wiki/WebKit#JavaScriptCore) + - [JavaScriptCore (Safari)](https://en.wikipedia.org/wiki/WebKit#JavaScriptCore) - Runtime - Cookie - Local Cache @@ -150,9 +150,9 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - [Brackets](http://brackets.io/) [[GitHub]](https://github.com/adobe/brackets/) - [Light Table](http://lighttable.com/) [[GitHub]](https://github.com/LightTable/LightTable/) - [Visual Studio](https://www.visualstudio.com/) - - [Visual Studio Code](https://code.visualstudio.com/) + - [Visual Studio Code (Linux & Mac)](https://code.visualstudio.com/) [[GitHub]](https://github.com/Microsoft/vscode) - Dreamweaver ;-) - - FrontPage ;-) + - FrontPage / SharePoint Designer ;-) - Build Tasks - Minification - Compilation @@ -172,6 +172,7 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - Base Tools - [Node.js](https://nodejs.org/) [[GitHub]](https://github.com/joyent/node/) - [Phantom.js](http://phantomjs.org/) [[GitHub]](https://github.com/ariya/phantomjs/) + - [SpiderMonkey](https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey) - Quality - [JSLint](http://www.jslint.com/) [[GitHub]](https://github.com/douglascrockford/JSLint/) - [JSHint](http://jshint.com/) [[GitHub]](https://github.com/jshint/jshint/) @@ -180,6 +181,7 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - Package - [npm](https://www.npmjs.com/) [[GitHub]](https://github.com/npm/npm/) - [Bower](http://bower.io/) [[GitHub]](https://github.com/bower/bower/) + - [yarn](https://yarnpkg.com/) [[GitHub]](https://github.com/yarnpkg/yarn/) - Test - Tools - [QUnit](https://qunitjs.com/) [[GitHub]](https://github.com/jquery/qunit/) @@ -192,6 +194,9 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - [Sinon.JS](http://sinonjs.org/) [[GitHub]](https://github.com/cjohansen/Sinon.JS/) - [Karma](http://karma-runner.github.io/) [[GitHub]](https://github.com/karma-runner/karma/) - nodeunit [[GitHub]](https://github.com/caolan/nodeunit/) + - tape [[GitHub]](http://github.com/substack/tape) + - [nightmare](http://nightmarejs.org/) [[GitHub]](https://github.com/segmentio/nightmare) + - [Enzyme](http://airbnb.io/enzyme/) [[GitHub]](https://github.com/airbnb/enzyme) - Composite - [Sauce Labs](https://saucelabs.com/) - [Browser Stack](https://www.browserstack.com/) @@ -207,7 +212,6 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - [Prototype](http://prototypejs.org/) [[GitHub]](https://github.com/sstephenson/prototype/) - [Zepto](http://zeptojs.com/) [[GitHub]](https://github.com/madrobby/zepto/) - [MooTool](http://mootools.net/) [[GitHub]](https://github.com/mootools/mootools-core/) - - [Underscore](http://underscorejs.org/) [[GitHub]](https://github.com/jashkenas/underscore/) - Modular - ES6 Module - CommonJS @@ -226,12 +230,16 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - [polymer](https://www.polymer-project.org/) [[GitHub]](https://github.com/polymer/polymer/) - [Deft.js](http://deftjs.org/) [[GitHub]](https://github.com/deftjs/DeftJS/) - [Vue](http://vuejs.org/) [[GitHub]](https://github.com/yyx990803/vue/) + - [Riot](http://riotjs.com/) [[GitHub]](https://github.com/riot/riot) - UI framework - [Bootstrap](http://getbootstrap.com/) [[GitHub]](https://github.com/twbs/bootstrap/) - - [Semantic UI ](http://semantic-ui.com/) [[GitHub]](https://github.com/Semantic-Org/Semantic-UI/) + - [Semantic UI](http://semantic-ui.com/) [[GitHub]](https://github.com/Semantic-Org/Semantic-UI/) - [Foundation](http://foundation.zurb.com/) [[GitHub]](https://github.com/zurb/foundation/) - [Material UI](http://material-ui.com/) [[GitHub]](https://github.com/callemall/material-ui/) - - [jQuery UI](http://jqueryui.com/) [[GitHub]](https://github.com/jquery/jquery-ui/) + - [WinJS](https://dev.windows.com/en-us/develop/winjs) [[GitHub]](https://github.com/winjs/winjs) + - [Pure](http://purecss.io/) [[GitHub]](https://github.com/yahoo/pure/) + - [Amaze UI](http://amazeui.org/) [[GitHub]](https://github.com/allmobilize/amazeui) + - [Onsne UI](https://onsen.io/) [[GitHub]](https://github.com/OnsenUI/OnsenUI) - WebSocket - [Socket.io](http://socket.io/) [[GitHub]](https://github.com/Automattic/socket.io/) - web-socket-js [[GitHub]](https://github.com/gimite/web-socket-js/) @@ -264,8 +272,12 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - q [[GitHub]](https://github.com/kriskowal/q/) - when.js [[GitHub]](https://github.com/cujojs/when/) - Functional - - backon.js [[GitHub]](https://github.com/baconjs/bacon.js/) + - [bacon.js](http://baconjs.github.io/) [[GitHub]](https://github.com/baconjs/bacon.js/) - [immutable.js](https://facebook.github.io/immutable-js/) [[GitHub]](https://github.com/facebook/immutable-js/) + - [ramda](http://ramdajs.com/) [[GitHub]](http://github.com/ramda/ramda) + - [underscore.js](http://underscorejs.org/) [[GitHub]](https://github.com/jashkenas/underscore) + - [lodash](https://lodash.com/) [[GitHub]](https://github.com/lodash/lodash) + - [ReactiveX](http://reactivex.io/) [[GitHub]](https://github.com/Reactive-Extensions/RxJS) - Mobile UI - [jQuery Mobile](https://jquerymobile.com/) [[GitHub]](https://github.com/jquery/jquery-mobile/) - [Jo](http://joapp.com/) [[GitHub]](https://github.com/davebalmer/jo/) @@ -281,6 +293,8 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - [Gumby](http://www.gumbyframework.com/) [[GitHub]](https://github.com/GumbyFramework/Gumby/) - Stylus - nib [[GitHub]](https://github.com/tj/nib/) + - Future Standards + - [babel](https://babeljs.io/) [[GitHub]](https://github.com/babel/babel) - Template - [Handlebars](http://handlebarsjs.com/) [[GitHub]](https://github.com/wycats/handlebars.js/) - [Haml](http://haml.info/) [[GitHub]](https://github.com/haml/haml/) @@ -288,9 +302,9 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - [Jade](http://jade-lang.com/) [[GitHub]](https://github.com/jadejs/jade/) - [Ejs](http://www.embeddedjs.com/) - [Spacebars](http://meteorcapture.com/spacebars/) - - mustache [[GitHub]](https://github.com/janl/mustache.js/) + - [mustache](http://mustache.github.io/) [[GitHub]](https://github.com/janl/mustache.js/) - Modernisation - - Normalize + - [Normalize](http://necolas.github.io/normalize.css/) [[GitHub]](https://github.com/necolas/normalize.css/) - Reset - Best Practices - [SEO](https://en.wikipedia.org/wiki/Search_engine_optimization) @@ -303,13 +317,15 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm - Intermediate Languages - [CoffeeScript](http://coffeescript.org/) [[GitHub]](https://github.com/jashkenas/coffeescript/) - [TypeScript](http://www.typescriptlang.org/) [[GitHub]](https://github.com/Microsoft/TypeScript/) - - [Dart](https://www.dartlang.org/) [[GitHub]](https://github.com/dart-lang/sdk/) - - [LiveScript](http://livescript.net/) [[GitHub]](https://github.com/gkz/LiveScript/) - ClojureScript [[GitHub]](https://github.com/clojure/clojurescript/) - - Mobile App Builders + - [JSX (Facebook)](http://facebook.github.io/react/docs/jsx-in-depth.html) + - Mobile Application Development - [PhoneGap / Cordova](https://cordova.apache.org/) [[GitHub]](https://github.com/apache/cordova-android/) - [MUI](http://dev.dcloud.net.cn/mui/) [[GitHub]](https://github.com/dcloudio/mui/) - [React Native](https://facebook.github.io/react-native/) [[GitHub]](https://github.com/facebook/react-native/) - [Ionic](http://ionicframework.com/) [[GitHub]](https://github.com/driftyco/ionic/) + - Desktop Application Development + - [Electron](http://electron.atom.io/) [[GitHub]](https://github.com/atom/electron) + - [NW.js](http://nwjs.io/) [[GitHub]](https://github.com/nwjs/nw.js) - \ No newline at end of file + diff --git a/README.zh-cn.md b/README.zh-cn.md index 2fec21d..1153031 100644 --- a/README.zh-cn.md +++ b/README.zh-cn.md @@ -1,14 +1,17 @@ -# 爆栈 +# 爆栈 系统开发技术栈、Web前端开发技术栈、数据库技术栈、.NET技术栈! http://overflowstack.github.io # 本地化 -English: +English: https://github.com/unruledboy/WebFrontEndStack/ -中文博客: +中文博客: http://www.cnblogs.com/unruledboy/p/WebFrontEndStack.html +Español: +https://github.com/unruledboy/WebFrontEndStack/blob/master/README.es-es.md + # Web前端技术栈 比较全面的浏览器、平台、类库、框架、工具等。 @@ -37,20 +40,16 @@ http://www.cnblogs.com/unruledboy/p/WebFrontEndStack.html ## 选项 -### 用法 - node index task1 \[task2\] \[task3\] .. \[--option=value\] \[--option=value\] ... -#### 任务 -##### phantomjs - 用于生成预览图。 -##### readme - 用于重新生成readme。 -##### updatestargazers - 用于更新Stargazers计数。 -#### 选项 -#### port - 默认: 3000 -#### update_existed_stargazers - 默认: false +``` + + -h, --help Display this message. + -p, --port number (Default: 3000) Set the port what express listening. + -ues, --update_existed_stargazers (Default: false) Update project's stargazers including existed. + --phantomjs The task to generate the image. + --readme The task to update readme. + --updatestargazers The task to update the count of the stargazers. + +``` # 为什么? 大家是否想过: @@ -133,7 +132,7 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - [Chakra (IE9+ / Edge)](https://en.wikipedia.org/wiki/Chakra_(JScript_engine)) - [V8 (Chrome / Opera / Nodejs / MongoDB)](https://developers.google.com/v8/?hl=zh-CN) [[GitHub]](https://github.com/v8/v8/) - [SpiderMonkey (Firefox)]( https://developer.mozilla.org/en-us/docs/Mozilla/Projects/SpiderMonkey) - - [Nitro (Safari)](https://en.wikipedia.org/wiki/WebKit#JavaScriptCore) + - [JavaScriptCore (Safari)](https://en.wikipedia.org/wiki/WebKit#JavaScriptCore) - 运行时 - Cookie - Local Cache @@ -157,9 +156,9 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - [Brackets](http://brackets.io/) [[GitHub]](https://github.com/adobe/brackets/) - [Light Table](http://lighttable.com/) [[GitHub]](https://github.com/LightTable/LightTable/) - [Visual Studio](https://www.visualstudio.com/) - - [Visual Studio Code](https://code.visualstudio.com/) + - [Visual Studio Code (Linux & Mac)](https://code.visualstudio.com/) [[GitHub]](https://github.com/Microsoft/vscode) - Dreamweaver ;-) - - FrontPage ;-) + - FrontPage / SharePoint Designer ;-) - 编译任务 - 精简 - 编译 @@ -179,6 +178,7 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - 基础工具 - [Node.js](https://nodejs.org/) [[GitHub]](https://github.com/joyent/node/) - [Phantom.js](http://phantomjs.org/) [[GitHub]](https://github.com/ariya/phantomjs/) + - [SpiderMonkey](https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey) - 质量控制 - [JSLint](http://www.jslint.com/) [[GitHub]](https://github.com/douglascrockford/JSLint/) - [JSHint](http://jshint.com/) [[GitHub]](https://github.com/jshint/jshint/) @@ -199,6 +199,8 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - [Sinon.JS](http://sinonjs.org/) [[GitHub]](https://github.com/cjohansen/Sinon.JS/) - [Karma](http://karma-runner.github.io/) [[GitHub]](https://github.com/karma-runner/karma/) - nodeunit [[GitHub]](https://github.com/caolan/nodeunit/) + - tape [[GitHub]](http://github.com/substack/tape) + - [nightmare](http://nightmarejs.org/) [[GitHub]](https://github.com/segmentio/nightmare) - 在线工具 - [Sauce Labs](https://saucelabs.com/) - [Browser Stack](https://www.browserstack.com/) @@ -214,7 +216,6 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - [Prototype](http://prototypejs.org/) [[GitHub]](https://github.com/sstephenson/prototype/) - [Zepto](http://zeptojs.com/) [[GitHub]](https://github.com/madrobby/zepto/) - [MooTool](http://mootools.net/) [[GitHub]](https://github.com/mootools/mootools-core/) - - [Underscore](http://underscorejs.org/) [[GitHub]](https://github.com/jashkenas/underscore/) - 模块化 - ES6 Module - CommonJS @@ -233,12 +234,15 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - [polymer](https://www.polymer-project.org/) [[GitHub]](https://github.com/polymer/polymer/) - [Deft.js](http://deftjs.org/) [[GitHub]](https://github.com/deftjs/DeftJS/) - [Vue](http://vuejs.org/) [[GitHub]](https://github.com/yyx990803/vue/) + - [Riot](http://riotjs.com/) [[GitHub]](https://github.com/riot/riot) - UI框架 - [Bootstrap](http://getbootstrap.com/) [[GitHub]](https://github.com/twbs/bootstrap/) - - [Semantic UI ](http://semantic-ui.com/) [[GitHub]](https://github.com/Semantic-Org/Semantic-UI/) + - [Semantic UI](http://semantic-ui.com/) [[GitHub]](https://github.com/Semantic-Org/Semantic-UI/) - [Foundation](http://foundation.zurb.com/) [[GitHub]](https://github.com/zurb/foundation/) - [Material UI](http://material-ui.com/) [[GitHub]](https://github.com/callemall/material-ui/) - - [jQuery UI](http://jqueryui.com/) [[GitHub]](https://github.com/jquery/jquery-ui/) + - [WinJS](https://dev.windows.com/en-us/develop/winjs) [[GitHub]](https://github.com/winjs/winjs) + - [Pure](http://purecss.io/) [[GitHub]](https://github.com/yahoo/pure/) + - [Amaze UI](http://amazeui.org/) [[GitHub]](https://github.com/allmobilize/amazeui) - WebSocket - [Socket.io](http://socket.io/) [[GitHub]](https://github.com/Automattic/socket.io/) - web-socket-js [[GitHub]](https://github.com/gimite/web-socket-js/) @@ -271,8 +275,12 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - q [[GitHub]](https://github.com/kriskowal/q/) - when.js [[GitHub]](https://github.com/cujojs/when/) - 函数式编程 - - backon.js [[GitHub]](https://github.com/baconjs/bacon.js/) + - [bacon.js](http://baconjs.github.io/) [[GitHub]](https://github.com/baconjs/bacon.js/) - [immutable.js](https://facebook.github.io/immutable-js/) [[GitHub]](https://github.com/facebook/immutable-js/) + - [ramda](http://ramdajs.com/) [[GitHub]](http://github.com/ramda/ramda) + - [underscore.js](http://underscorejs.org/) [[GitHub]](https://github.com/jashkenas/underscore) + - [lodash](https://lodash.com/) [[GitHub]](https://github.com/lodash/lodash) + - [ReactiveX](http://reactivex.io/) [[GitHub]](https://github.com/Reactive-Extensions/RxJS) - 手机 UI 框架 - [jQuery Mobile](https://jquerymobile.com/) [[GitHub]](https://github.com/jquery/jquery-mobile/) - [Jo](http://joapp.com/) [[GitHub]](https://github.com/davebalmer/jo/) @@ -288,6 +296,8 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - [Gumby](http://www.gumbyframework.com/) [[GitHub]](https://github.com/GumbyFramework/Gumby/) - Stylus - nib [[GitHub]](https://github.com/tj/nib/) + - 未来标准 + - [babel](https://babeljs.io/) [[GitHub]](https://github.com/babel/babel) - 模板引擎 - [Handlebars](http://handlebarsjs.com/) [[GitHub]](https://github.com/wycats/handlebars.js/) - [Haml](http://haml.info/) [[GitHub]](https://github.com/haml/haml/) @@ -295,9 +305,9 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - [Jade](http://jade-lang.com/) [[GitHub]](https://github.com/jadejs/jade/) - [Ejs](http://www.embeddedjs.com/) - [Spacebars](http://meteorcapture.com/spacebars/) - - mustache [[GitHub]](https://github.com/janl/mustache.js/) + - [mustache](http://mustache.github.io/) [[GitHub]](https://github.com/janl/mustache.js/) - 统一化 - - Normalize + - [Normalize](http://necolas.github.io/normalize.css/) [[GitHub]](https://github.com/necolas/normalize.css/) - Reset - 最佳实践 - [SEO](https://en.wikipedia.org/wiki/Search_engine_optimization) @@ -310,13 +320,15 @@ https://rawgit.com/unruledboy/WebFrontEndStack/master/ux/WebFrontEndStack.htm?lo - 中间语言 - [CoffeeScript](http://coffeescript.org/) [[GitHub]](https://github.com/jashkenas/coffeescript/) - [TypeScript](http://www.typescriptlang.org/) [[GitHub]](https://github.com/Microsoft/TypeScript/) - - [Dart](https://www.dartlang.org/) [[GitHub]](https://github.com/dart-lang/sdk/) - - [LiveScript](http://livescript.net/) [[GitHub]](https://github.com/gkz/LiveScript/) - ClojureScript [[GitHub]](https://github.com/clojure/clojurescript/) + - [JSX (Facebook)](http://facebook.github.io/react/docs/jsx-in-depth.html) - 移动应用开发 - [PhoneGap / Cordova](https://cordova.apache.org/) [[GitHub]](https://github.com/apache/cordova-android/) - [MUI](http://dev.dcloud.net.cn/mui/) [[GitHub]](https://github.com/dcloudio/mui/) - [React Native](https://facebook.github.io/react-native/) [[GitHub]](https://github.com/facebook/react-native/) - [Ionic](http://ionicframework.com/) [[GitHub]](https://github.com/driftyco/ionic/) + - 桌面应用开发 + - [Electron](http://electron.atom.io/) [[GitHub]](https://github.com/atom/electron) + - [NW.js](http://nwjs.io/) [[GitHub]](https://github.com/nwjs/nw.js) - \ No newline at end of file + diff --git a/Web Front End Stack.es-es.png b/Web Front End Stack.es-es.png new file mode 100644 index 0000000..58809ce Binary files /dev/null and b/Web Front End Stack.es-es.png differ diff --git a/Web Front End Stack.png b/Web Front End Stack.png index b5dca10..172b9d0 100644 Binary files a/Web Front End Stack.png and b/Web Front End Stack.png differ diff --git a/Web Front End Stack.zh-cn.png b/Web Front End Stack.zh-cn.png index fea050d..da4aa92 100644 Binary files a/Web Front End Stack.zh-cn.png and b/Web Front End Stack.zh-cn.png differ diff --git a/index.js b/index.js index 9fcd4cd..e99f91d 100644 --- a/index.js +++ b/index.js @@ -1,270 +1,294 @@ +/* global require, setTimeout, console, __dirname, process*/ /** * Builder * @author zsx */ -var express = require('express'); -var path = require('path'); -var Promise = require("bluebird"); -var request = require("request"); -var async = require("async"); -var fs = Promise.promisifyAll(require('fs')); +(function () { + "use strict"; -var app = new express(); -var queueReady = ["server"]; + const pageWidth = 2000; // Magic number! + const pageHeight = 3800; -var pageWidth = 1900; // Magic number! -var pageHeight = 3800; + let Express = require('express'); + let path = require('path'); + let phantom = require("phantomjs-promise"); + let request = require("request"); + let async = require("async"); + let fs = require('fs'); + let commandLineArgs = require("command-line-args"); -var config = { - port: 3000, - update_existed_stargazers: false, - locale: process.env.locale || '', - rawLocale: process.env.locale || '' -} -var httpServer = "http://127.0.0.1:" + config.port + "/"; + let app = new Express(); -if (config.locale) - config.locale = '.' + config.locale; + let cli = commandLineArgs([{ + name: "help", + alias: "h", + type: Boolean, + defaultOption: true, + description: "Display this message." + }, { + name: "port", + alias: "p", + type: Number, + defaultValue: 3000, + description: "(Default: 3000) Set the port what express listening." + }, { + name: "update_existed_stargazers", + alias: "ues", + type: Boolean, + defaultValue: false, + description: "(Default: false) Update project's stargazers including existed." + }, { + name: "phantomjs", + type: Boolean, + defaultValue: false, + description: "The task to generate the image." + }, { + name: "readme", + type: Boolean, + defaultValue: false, + description: "The task to update readme." + }, { + name: "updatestargazers", + type: Boolean, + defaultValue: false, + description: "The task to update the count of the stargazers." + }]); + let options = cli.parse(); + let httpServer = "http://127.0.0.1:" + options.port + "/"; -String.prototype.repeat = function(count) { - return new Array(count + 1).join(this); -} + let languages = []; + let jsonData = JSON.parse(fs.readFileSync('./ux/WebFrontEndStack.json', "utf-8")); // Require will lock the file. -/** - * Use to build a promise for some fucking async api. - * @param object object - **/ -var promisify = function promisify(object) { - for (var key in object) { - (function(key, asyncKey) { - object[asyncKey] = function() { - var resolver = Promise.defer(); - var len = arguments.length; - var argu = new Array(len + 1); - for (var i = 0; i < len; i++) { // I think a Array.from is more convenient. - argu[i] = arguments[i]; - } - argu[len] = function() { - resolver.resolve.apply(resolver, arguments); // Callback arguments - }; - object[key].apply(object, argu); - return resolver.promise; - } - })(key, key + "Async"); - } -} + /** + * Tiemout + * @param int ms + * @return Promise + */ + function timeout(ms) { + return new Promise((resolve, reject) => { + setTimeout(resolve, ms, 'done'); + }); + } + /** + * Recursion to generate readme + * @param object object + * @param string language + * @param int deep + * @return string + */ + function buildReadme(object, language, deep) { + let deeper = deep + 1; + let deepString = new Array(deeper).join("\t") + "- "; + let ret = []; + let lang = ""; + if (object.languages) { + lang = object.languages[language]; + } + lang = lang || object.name; -/** - * Recursion to generate readme - * @param object object - * @param string language - * @param int deep - * @return string - */ -var buildReadme = function buildReadme(object, language, deep) { - var deeper = deep + 1; - var deepString = "\t".repeat(deep) + "- "; - var ret = []; - var lang = typeof object.languages == "undefined" ? object.name : object.languages[language]; - lang = lang || object.name; + ret.push((function (deepString, name, url, github) { + let haveUrl = !!url; + let haveGitHub = !!github; + let ret = []; + ret.push(deepString); + ret.push((haveUrl ? "[" : "") + name + (haveUrl ? "](" + url + ")" : "")); + ret.push((haveGitHub ? " [\[GitHub\]](" + github + ")" : "")); + return ret.join(""); + })(deepString, lang, object.url, object.github)); + + if (object.children) { + object.children.map((value, index) => { + ret.push(buildReadme(value, language, deeper)); + }); + } + return ret.join("\n"); + } + + /** + * Update the stargazers of the GitHub repo + * Be careful! There have the rate limit! + * @see https://developer.github.com/v3/#increasing-the-unauthenticated-rate-limit-for-oauth-applications + * @return Promise + */ + function updatestargazers() { + return new Promise((resolve, reject) => { + + function getGitHubApi(github) { + let githubArray = github.split("/"); + // I want a sprintf T_T + return "https://api.github.com/repos/" + githubArray[3] + "/" + githubArray[4]; + } + + + let q = async.queue(function (object, callback) { + if (!object.github || (!options.update_existed_stargazers && object.stargazers)) { + callback(false); + return; + } + let githubUrl = getGitHubApi(object.github); + console.log("Getting " + githubUrl); + request({ + url: githubUrl, + headers: { + "User-Agent": "https://github.com/unruledboy/WebFrontEndStack" // GitHub required user-agent + } + }, (err, res, body) => { + if (!err && res.statusCode == 200) { + let json = JSON.parse(body); + if (json === null) { + callback(false); + return; + } + object.stargazers = json.stargazers_count; + callback(true); + } else { + if (res.statusCode == 403) { // Out of API limit! + console.error("Out of GitHub API limit!"); + console.error("The limit will be reset when " + new Date(res.headers['x-ratelimit-reset'] * 1000)); + q.kill(); + reject("Out of GitHub API limit!"); + } + callback(false); + } + }); + + }, 5); + q.drain = function () { + fs.writeFileSync('./ux/WebFrontEndStack.json', JSON.stringify(jsonData), "utf-8"); + resolve(); + }; + function addQueue(object) { + q.push(object, (noErr) => { + if (noErr) console.log(object.name + " = " + object.stargazers); + }); + if (object.children) { + object.children.forEach((val) => { + addQueue(val); + }); + } + } + addQueue(jsonData); + + return q; + }); + } + /** + * For running phantomjs to take a screenshot for the webpage + * @return Promise + */ + function phantomjs(language) { + let displayLanguage = language === "" ? "en" : language; + let promise = new Promise((resolve, reject) => { + return phantom.createAsync().then((phantom) => { + return phantom.createPageAsync(); + }).then((objects) => { + console.log("Setting viewportSize.."); + return objects.page.setAsync('viewportSize', { + width: pageWidth, + height: pageHeight + }); + }).then((objects) => { + console.log("Opening " + httpServer + "?locale=" + language + " for " + displayLanguage); + return objects.page.openAsync(httpServer + "?locale=" + language); + }).then((objects) => { + console.log("Rendered HTML, the image will be saved after 2 seconds."); + if (objects.ret[0] != "success") { + throw objects.ret[0]; + } + return timeout(2000).then(() => { + return objects.page.renderAsync(path.join(__dirname, 'Web Front End Stack' + (language === "" ? "" : ".") + language + '.png')); + }); + }).then((objects) => { + console.log("The image(" + displayLanguage + ") saved successfully!"); + objects.page.close(); + objects.phantom.exit(); + resolve(); + }); + }); + return promise; + + } + + + /** + * To rebuild the README.md + * @return Promise + */ + function readme(language) { + let extension = (language === "" ? "" : ".") + language; + let promise = new Promise((resolve, reject) => { + fs.readFile('./README' + extension + '.md', "utf-8", (err, content) => { + if (err) return reject(err); + resolve(content); + }); + }); + return promise.then((fileContent) => { + let ret = buildReadme(jsonData, language, 0); + fileContent = fileContent.replace(/<\!--BUILD_START-->[\d\D]+?<\!--BUILD_END-->/, "{%BuildStart%}"); + fs.writeFileSync('./README' + extension + '.md', fileContent.replace("{%BuildStart%}", "\n\n" + ret + "\n\n", "utf-8")); + console.log('Readme (' + language + ') built successfully!'); + }); + } + + + /** + * To start an express server + * @return Promise + */ + function server() { + return new Promise((resolve, reject) => { + return app + .set('port', options.port) + .set('view engine', 'html') + .use(Express.static(path.join(__dirname, '/ux'))) + .use('/', function (req, res) { + res.redirect('/WebFrontEndStack.htm?locale=' + req.query.locale); + }) + .listen(options.port, function () { + console.info('Express started on: http://127.0.0.1:' + options.port); + resolve(app); + }); + }); + } + + if (options.help) { + let usage = cli.getUsage({ + title: "Generator" + }); + console.log(usage); + return; + } + + let queue = []; + queue.push(server()); - ret.push((function(deepString, name, url, github) { - var haveUrl = !!url; - var haveGitHub = !!github; - return deepString + (haveUrl ? "[" : "") + name + (haveUrl ? "](" + url + ")" : "") + (haveGitHub ? " [\[GitHub\]](" + github + ")" : ""); - })(deepString, lang, object.url, object.github)); - if (object.children) { - object.children.map(function(value, index) { - ret.push(buildReadme(value, language, deeper)); - }); - } - return ret.join("\n"); -} + // Firstly, check languages. -var actions = { - /** - * Update the stargazers of the GitHub repo - * Be careful! There have the rate limit! - * @see https://developer.github.com/v3/#increasing-the-unauthenticated-rate-limit-for-oauth-applications - * @return Promise - */ - updatestargazers: function updatestargazers() { - return new Promise(function(resolve, reject) { - var originalData = JSON.parse(fs.readFileSync('./ux/WebFrontEndStack.json', "utf-8")); // Require will lock the file. - var getGitHubApi = function(github) { - var githubArray = github.split("/"); - // I want a sprintf T_T - return "https://api.github.com/repos/" + githubArray[3] + "/" + githubArray[4]; - }; - var q = async.queue(function(object, callback) { - if (!object.github || (!config.update_existed_stargazers && object.stargazers)) { - callback(false); - return; - } - var githubUrl = getGitHubApi(object.github); - console.log("Getting " + githubUrl); - request({ - url: githubUrl, - headers: { - "User-Agent": "https://github.com/unruledboy/WebFrontEndStack" // GitHub required user-agent - } - }, function(err, res, body) { - if (!err && res.statusCode == 200) { - var json = JSON.parse(body); - if (json === null) { - callback(false); - return; - } - object.stargazers = json.stargazers_count; - callback(true); - } else { - if (res.statusCode == 403) { // Out of API limit! - console.error("Out of GitHub API limit!"); - console.error("The limit will be reset when " + new Date(res.headers['x-ratelimit-reset'] * 1000)); - q.kill(); - reject("Out of GitHub API limit!"); - } - callback(false); - } - }); + languages.push(""); + for (let item in jsonData.languages) { + languages.push(item); + } - }, 5); - var addQueue = function addQueue(object) { - q.push(object, function(err) { - if (err) console.log(object.name + " = " + object.stargazers); - }); - if (object.children) { - object.children.forEach(function(val) { - addQueue(val); - }); - } - }; - addQueue(originalData); - q.push({ // For some reason, the ``drain`` will not be called. - noRequest: true - }, function() { - fs.writeFileAsync('./ux/WebFrontEndStack.json', JSON.stringify(originalData), "utf-8").then(function() { - resolve(); - }); - }); - return q; - }) - }, - /** - * For running phantomjs to take a screenshot for the webpage - * @return Promise - */ - phantomjs: function phantomjs() { - var json = require('./ux/WebFrontEndStack.json'); - var phantom = require('phantom'); - promisify(phantom); - // What the fucking API - var resolver = Promise.defer(); - var buildByLanguage = function(language) { - var displayLanguage = language == "" ? "en" : language; - var ph; - var page; - return phantom.createAsync().then(function(phantom) { - ph = phantom; - promisify(ph); - console.log("Created Phantomjs for " + displayLanguage); - return ph.createPageAsync(); - }).then(function(pg) { - page = pg; - promisify(pg); - return page.setAsync('viewportSize', { - width: pageWidth, - height: pageHeight - }); - }).then(function() { - console.log("Set viewportSize"); - console.log("Opening " + httpServer + "?locale=" + language + " for " + displayLanguage); - return page.openAsync(httpServer + "?locale=" + language); - }).then(function(status) { - console.log("Rendered HTML, the image will be saved after 2 seconds."); - if (status == "success") { - return Promise.delay(2000); - } else { - throw status; - } - }).then(function() { - return page.renderAsync(path.join(__dirname, 'Web Front End Stack' + (language == "" ? "" : ".") + language + '.png')); - }).then(function() { - console.log("The image(" + displayLanguage + ") saved successfully!"); - page.close(); - ph.exit(); - }); - }; - resolver.promise.then(buildByLanguage("")); - for (var item in json.languages) { - resolver.promise.then(buildByLanguage(item)); - } - return resolver.promise; - }, + languages.map((val) => { + if (options.phantomjs) { + queue.push(phantomjs(val)); + } + if (options.readme) { + queue.push(readme(val)); + } + }); - /** - * To rebuild the README.md - * @return Promise - */ - readme: function readme() { - var json = require('./ux/WebFrontEndStack.json'); - var resolver = Promise.defer(); - var buildByLanguage = function(language) { - return Promise.resolve().then(function() { - return fs.readFileAsync('./README' + (language == "" ? "" : ".") + language + '.md', "utf-8"); - }).then(function(fileContent) { - var ret = buildReadme(json, language, 0); - fileContent = fileContent.replace(/<\!--BUILD_START-->[\d\D]+?<\!--BUILD_END-->/, "{%BuildStart%}") - return fs.writeFileAsync('./README' + (language == "" ? "" : ".") + language + '.md', fileContent.replace("{%BuildStart%}", "\n\n" + ret + "\n\n", "utf-8")); - }).then(function() { - console.log('Readme' + (language == "" ? "" : ":") + language + ' built successfully!'); - }) - }; - resolver.promise.then(buildByLanguage("")); - for (var item in json.languages) { - resolver.promise.then(buildByLanguage(item)); - } - return resolver.promise; - }, - /** - * To start an express server - * @return Promise - */ - server: function server() { - return new Promise(function(resolver, reject) { - return app - .set('port', config.port) - .set('view engine', 'html') - .use(express.static(path.join(__dirname, '/ux'))) - .use('/', function(req, res) { - res.redirect('/WebFrontEndStack.htm?locale=' + req.query.locale); - }) - .listen(config.port, function() { - console.info('Express started on: http://127.0.0.1:' + config.port); - resolver(app); - }); - }); - } -}; + if (options.updatestargazers) { + queue.push(updatestargazers()); + } -var queue = [actions.server()]; -process.argv.forEach(function(val) { - if (val in actions) { - console.info("Task: " + val); - queue.push(actions[val]()); - } else if (val[0] == "-" && val.indexOf("=") >= 0) { - var obj = val.split("="); - var name = obj[0].split("--")[1]; - var value = obj[1]; - config[name] = value; - } -}); + let promise = Promise.all(queue); -var promise = Promise.all(queue); -if (queue.length > 1) { // for somebody who only want to start the server. - console.log("You can press Ctrl+C to exit if tasks finished.") - promise.then(function() { - console.log("OK!"); - process.exit(0); - }); -} + if (queue.length > 1) { // for somebody who only want to start the server. + console.log("You can press Ctrl+C to exit if tasks finished."); + promise.then(() => { + console.log("OK!"); + process.exit(0); + }); + } +})(); diff --git a/package.json b/package.json index 810c389..c01eba2 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "description": "Generate a image for web front-end stack.", "main": "index.js", "scripts": { - "build": "node index phantomjs readme", + "build": "node index --phantomjs --readme", "start": "node index" }, "repository": { @@ -27,9 +27,13 @@ "homepage": "https://github.com/unruledboy/WebFrontEndStack", "dependencies": { "async": "^1.4.2", - "bluebird": "^2.9.34", + "command-line-args": "^1.0.1", "express": "^4.13.3", - "phantom": "^0.7.2", + "phantomjs-promise": "0.0.1", "request": "^2.61.0" + }, + "devDependencies": { + "phantomjs": "^1.9.18", + "weak": "^1.0.0" } } diff --git a/ux/WebFrontEndStack.htm b/ux/WebFrontEndStack.htm index ae06e6f..26ded2c 100644 --- a/ux/WebFrontEndStack.htm +++ b/ux/WebFrontEndStack.htm @@ -54,7 +54,7 @@ body { float: left; - font-family: 'PT Sans', sans-serif; + font-family: 'PT Sans', '微软雅黑 Light', '方正兰亭纤黑', '微软雅黑', '新宋体', sans-serif; } .container { @@ -86,8 +86,8 @@ } - - + + @@ -95,7 +95,7 @@

Wilson Chen (twitter@unruleboy) - unruledboy@gmail.com

diff --git a/ux/WebFrontEndStack.json b/ux/WebFrontEndStack.json index 23cc3b2..f2e9017 100644 --- a/ux/WebFrontEndStack.json +++ b/ux/WebFrontEndStack.json @@ -1,1003 +1,1119 @@ { - "name": "Web Front End", - "languages": { - "zh-cn": "Web前端开发技术栈" - }, - "children": [{ - "name": "Browser", - "languages": { - "zh-cn": "浏览器" - }, - "children": [{ - "name": "Internet Explorer", - "url": "http://windows.microsoft.com/en-us/internet-explorer/download-ie" - }, { - "name": "Chrome", - "url": "http://www.google.com/chrome/" - }, { - "name": "Firefox", - "url": "https://www.mozilla.org/" - }, { - "name": "Safari", - "url": "http://www.apple.com/safari/" - }, { - "name": "Opera", - "url": "http://www.opera.com/" - }, { - "name": "Edge", - "url": "https://www.microsoft.com/en-us/windows/microsoft-edge" - }, { - "name": "Netscape ;-)", - "url": "https://en.wikipedia.org/wiki/Netscape" - }] - }, { - "name": "Protocol", - "languages": { - "zh-cn": "协议" - }, - "children": [{ - "name": "HTTP/1.1", - "url": "https://www.ietf.org/rfc/rfc2616.txt", - "children": [{ - "name": "URI", - "languages": { - "zh-cn": "链接" - } - }, { - "name": "Session", - "languages": { - "zh-cn": "会话" - } - }, { - "name": "Authentication", - "languages": { - "zh-cn": "授权" - } - }, { - "name": "Request", - "languages": { - "zh-cn": "请求" - } - }, { - "name": "Response", - "languages": { - "zh-cn": "响应" - } - }] - }, { - "name": "HTTP/2", - "url": "https://en.wikipedia.org/wiki/HTTP/2", - "children": [{ - "name": "Compression", - "languages": { - "zh-cn": "压缩" - } - }, { - "name": "Minification", - "languages": { - "zh-cn": "打包" - } - }, { - "name": "Server Push", - "languages": { - "zh-cn": "服务器端推送" - } - }] - }, { - "name": "WebSocket" - }] - }, { - "name": "The 3 Pillars", - "languages": { - "zh-cn": "Web三剑客" - }, - "children": [{ - "name": "HTML (HyperText Markup Language)" - }, { - "name": "CSS (Cascading Style Sheets)" - }, { - "name": "JavaScript" - }] - }, { - "name": "Standards", - "languages": { - "zh-cn": "标准" - }, - "children": [{ - "name": "W3C", - "children": [{ - "name": "HTML" - }, { - "name": "CSS" - }, { - "name": "XHTML" - }, { - "name": "XML" - }] - }] - }, { - "name": "Core Concepts", - "languages": { - "zh-cn": "核心概念" - }, - "children": [{ - "name": "HTML", - "children": [{ - "name": "DOM", - "url": "https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model" - }, { - "name": "Element", - "url": "https://developer.mozilla.org/en-US/docs/Web/API/Element" - }, { - "name": "Attribute" - }] - }, { - "name": "JavaScript", - "children": [{ - "name": "Prototype", - "url": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype" - }, { - "name": "Scope", - "url": "https://developer.mozilla.org/en-US/docs/Glossary/Scope" - }, { - "name": "Closure", - "url": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures" - }, { - "name": "JSON (JavaSript Object Notation)", - "url": "https://developer.mozilla.org/en-US/docs/Glossary/JSON" - }, { - "name": "AJAX (Asynchronous JavaScript and XML)", - "url": "https://developer.mozilla.org/en-US/docs/AJAX" - }] - }, { - "name": "CSS", - "children": [{ - "name": "Selector" - }, { - "name": "Priority" - }, { - "name": "Specificity" - }, { - "name": "Box Model" - }] - }] - }, { - "name": "Rendering Engine", - "languages": { - "zh-cn": "渲染引擎" - }, - "children": [{ - "name": "Trident (IE)", - "url": "https://en.wikipedia.org/wiki/Trident_(layout_engine)" - }, { - "name": "Blink / prev. WebKit (Chrome)", - "url": "http://www.chromium.org/blink", - "github": "" - }, { - "name": "Gecko (Firefox)", - "url": "https://developer.mozilla.org/en-us/docs/Mozilla/Gecko" - }, { - "name": "WebKit (Safari)", - "url": "http://www.webkit.org/" - }, { - "name": "Blink / prev. Presto (Opera)", - "url": "http://www.chromium.org/blink", - "github": "" - }, { - "name": "EdgeHTML (Edge)", - "url": "https://en.wikipedia.org/wiki/EdgeHTML" - }] - }, { - "name": "JavaScript Engine", - "languages": { - "zh-cn": "脚本引擎" - }, - "children": [{ - "name": "JScript (IE8- / ASP)", - "url": "https://en.wikipedia.org/wiki/JScript" - }, { - "name": "Chakra (IE9+ / Edge)", - "url": "https://en.wikipedia.org/wiki/Chakra_(JScript_engine)" - }, { - "name": "V8 (Chrome / Opera / Nodejs / MongoDB)", - "url": "https://developers.google.com/v8/?hl=zh-CN", - "github": "https://github.com/v8/v8/", - "stargazers": 2577 - }, { - "name": "SpiderMonkey (Firefox)", - "url": " https://developer.mozilla.org/en-us/docs/Mozilla/Projects/SpiderMonkey" - }, { - "name": "Nitro (Safari)", - "url": "https://en.wikipedia.org/wiki/WebKit#JavaScriptCore" - }] - }, { - "name": "Runtime", - "languages": { - "zh-cn": "运行时" - }, - "children": [{ - "name": "Cookie" - }, { - "name": "Local Cache" - }, { - "name": "Session Storage" - }, { - "name": "Local Storage" - }, { - "name": "Components", - "children": [{ - "name": "Extensions" - }, { - "name": "Plugins" - }] - }, { - "name": "Resources", - "children": [{ - "name": "Images" - }, { - "name": "Icons" - }, { - "name": "Fonts" - }, { - "name": "Audios" - }, { - "name": "Videos" - }] - }] - }, { - "name": "Editors", - "languages": { - "zh-cn": "编辑器" - }, - "children": [{ - "name": "Sublime Text", - "url": "http://www.sublimetext.com/" - }, { - "name": "WebStorm", - "url": "https://www.jetbrains.com/webstorm/" - }, { - "name": "Atom", - "url": "https://atom.io/", - "github": "https://github.com/atom/atom/", - "stargazers": 19510 - }, { - "name": "Vim", - "url": "http://www.vim.org/" - }, { - "name": "Emacs", - "url": "https://www.gnu.org/software/emacs/" - }, { - "name": "Brackets", - "url": "http://brackets.io/", - "github": "https://github.com/adobe/brackets/", - "stargazers": 23091 - }, { - "name": "Light Table", - "url": "http://lighttable.com/", - "github": "https://github.com/LightTable/LightTable/", - "stargazers": 7926 - }, { - "name": "Visual Studio", - "url": "https://www.visualstudio.com/" - }, { - "name": "Visual Studio Code", - "url": "https://code.visualstudio.com/" - }, { - "name": "Dreamweaver ;-)" - }, { - "name": "FrontPage ;-)" - }] - }, { - "name": "Build Tasks", - "languages": { - "zh-cn": "编译任务" - }, - "children": [{ - "name": "Minification", - "languages": { - "zh-cn": "精简" - } - }, { - "name": "Compilation", - "languages": { - "zh-cn": "编译" - } - }, { - "name": "Concatenation", - "languages": { - "zh-cn": "合并" - } - }, { - "name": "Uglification", - "languages": { - "zh-cn": "混淆" - } - }, { - "name": "Image Optimization", - "languages": { - "zh-cn": "图像优化" - } - }, { - "name": "Unit Testing", - "languages": { - "zh-cn": "单元测试" - } - }] - }, { - "name": "Build Tools", - "languages": { - "zh-cn": "编译工具" - }, - "children": [{ - "name": "Grunt", - "url": "http://www.gruntjs.com/", - "github": "https://github.com/cowboy/jquery-tiny-pubsub/", - "stargazers": 662 - }, { - "name": "Gulp", - "url": "http://gulpjs.com/", - "github": "https://github.com/gulpjs/gulp/", - "stargazers": 15661 - }, { - "name": "Brunch", - "url": "http://brunch.io/", - "github": "https://github.com/brunch/brunch/", - "stargazers": 4472 - }, { - "name": "Yeoman", - "url": "http://yeoman.io/" - }, { - "name": "Broccoli", - "github": "https://github.com/broccolijs/broccoli/", - "stargazers": 2391 - }] - }, { - "name": "Debug", - "languages": { - "zh-cn": "调试" - }, - "children": [{ - "name": "Developer Tools", - "url": "https://developer.chrome.com/devtools" - }, { - "name": "Firebug", - "url": "http://getfirebug.com/", - "github": "https://github.com/firebug/firebug/", - "stargazers": 924 - }] - }, { - "name": "Base Tools", - "languages": { - "zh-cn": "基础工具" - }, - "children": [{ - "name": "Node.js", - "url": "https://nodejs.org/", - "github": "https://github.com/joyent/node/", - "stargazers": 37851 - }, { - "name": "Phantom.js", - "url": "http://phantomjs.org/", - "github": "https://github.com/ariya/phantomjs/", - "stargazers": 14950 - }] - }, { - "name": "Quality", - "languages": { - "zh-cn": "质量控制" - }, - "children": [{ - "name": "JSLint", - "url": "http://www.jslint.com/", - "github": "https://github.com/douglascrockford/JSLint/", - "stargazers": 2382 - }, { - "name": "JSHint", - "url": "http://jshint.com/", - "github": "https://github.com/jshint/jshint/", - "stargazers": 5384 - }, { - "name": "jscs", - "url": "http://jscs.info/", - "github": "https://github.com/jscs-dev/node-jscs", - "stargazers": 3982 - }, { - "name": "Closure Linter", - "url": "https://developers.google.com/closure/utilities/" - }] - }, { - "name": "Package", - "languages": { - "zh-cn": "包管理" - }, - "children": [{ - "name": "npm", - "url": "https://www.npmjs.com/", - "github": "https://github.com/npm/npm/", - "stargazers": 6816 - }, { - "name": "Bower", - "url": "http://bower.io/", - "github": "https://github.com/bower/bower/", - "stargazers": 12747 - }] - }, { - "name": "Test", - "languages": { - "zh-cn": "测试" - }, - "children": [{ - "name": "Tools", - "languages": { - "zh-cn": "工具" - }, - "children": [{ - "name": "QUnit", - "url": "https://qunitjs.com/", - "github": "https://github.com/jquery/qunit/", - "stargazers": 3228 - }, { - "name": "Jasmine", - "url": "http://jasmine.github.io/", - "github": "https://github.com/jasmine/jasmine/", - "stargazers": 9303 - }, { - "name": "Mocha", - "url": "https://mochajs.org/", - "github": "https://github.com/mochajs/mocha/", - "stargazers": 7226 - }, { - "name": "Selenium", - "url": "http://www.seleniumhq.org/", - "github": "https://github.com/SeleniumHQ/selenium/", - "stargazers": 1563 - }, { - "name": "WebDriverIO", - "url": "http://webdriver.io/", - "github": "https://github.com/webdriverio/webdriverio/", - "stargazers": 1073 - }, { - "name": "Protractor", - "url": "http://www.protractortest.org/" - }, { - "name": "Chai", - "url": "http://chaijs.com/", - "github": "https://github.com/jfirebaugh/konacha/", - "stargazers": 977 - }, { - "name": "Sinon.JS", - "url": "http://sinonjs.org/", - "github": "https://github.com/cjohansen/Sinon.JS/", - "stargazers": 2230 - }, { - "name": "Karma", - "url": "http://karma-runner.github.io/", - "github": "https://github.com/karma-runner/karma/", - "stargazers": 5550 - }, { - "name": "nodeunit", - "github": "https://github.com/caolan/nodeunit/", - "stargazers": 1608 - }] - }, { - "name": "Composite", - "languages": { - "zh-cn": "在线工具" - }, - "children": [{ - "name": "Sauce Labs", - "url": "https://saucelabs.com/" - }, { - "name": "Browser Stack", - "url": "https://www.browserstack.com/" - }, { - "name": "Browser Shots", - "url": "http://browsershots.org/" - }, { - "name": "Browserling", - "url": "https://www.browserling.com/" - }, { - "name": "Browser Sandbox", - "url": "https://spoon.net/browsers/" - }, { - "name": "Cross Browser Testing", - "url": "https://crossbrowsertesting.com/" - }, { - "name": "Browsera", - "url": "http://www.browsera.com/" - }, { - "name": "SortSite", - "url": "http://www.powermapper.com/products/sortsite/checks/browser-compatibility/" - }] - }] - }, { - "name": "Frameworks / Libraries", - "languages": { - "zh-cn": "库 / 框架" - }, - "children": [{ - "name": "JavaScript base library", - "languages": { - "zh-cn": "基础库" - }, - "children": [{ - "name": "jQuery", - "url": "https://jquery.com/", - "github": "https://github.com/jquery/jquery/", - "stargazers": 35652 - }, { - "name": "Prototype", - "url": "http://prototypejs.org/", - "github": "https://github.com/sstephenson/prototype/", - "stargazers": 3022 - }, { - "name": "Zepto", - "url": "http://zeptojs.com/", - "github": "https://github.com/madrobby/zepto/", - "stargazers": 9109 - }, { - "name": "MooTool", - "url": "http://mootools.net/", - "github": "https://github.com/mootools/mootools-core/", - "stargazers": 2168 - }, { - "name": "Underscore", - "url": "http://underscorejs.org/", - "github": "https://github.com/jashkenas/underscore/", - "stargazers": 15538 - }] - }, { - "name": "Modular", - "languages": { - "zh-cn": "模块化" - }, - "children": [{ - "name": "ES6 Module" - }, { - "name": "CommonJS", - "children": [{ - "name": "webpack", - "url": "http://webpack.github.io/", - "github": "https://github.com/webpack/webpack/", - "stargazers": 7271 - }, { - "name": "browserify", - "url": "http://browserify.org/", - "github": "https://github.com/substack/node-browserify/", - "stargazers": 8004 - }] - }, { - "name": "AMD", - "children": [{ - "name": "RequireJS", - "url": "http://requirejs.org/", - "github": "https://github.com/jrburke/requirejs/", - "stargazers": 8002 - }] - }, { - "name": "UMD", - "children": [{ - "name": "umd", - "github": "https://github.com/umdjs/umd/", - "stargazers": 2764 - }] - }] - }, { - "name": "JavaScript Framework", - "languages": { - "zh-cn": "框架" - }, - "children": [{ - "name": "AngularJS", - "url": "https://angularjs.org/", - "github": "https://github.com/angular/angular.js/", - "stargazers": 41780 - }, { - "name": "Backbone", - "url": "http://backbonejs.org/", - "github": "https://github.com/jashkenas/backbone/", - "stargazers": 22720 - }, { - "name": "Knockout", - "url": "http://knockoutjs.com/", - "github": "https://github.com/SteveSanderson/knockout/", - "stargazers": 6660 - }, { - "name": "Ember", - "url": "http://emberjs.com/", - "github": "https://github.com/emberjs/ember.js/", - "stargazers": 14555 - }, { - "name": "React", - "url": "http://facebook.github.io/react/", - "github": "https://github.com/facebook/react/", - "stargazers": 26617 - }, { - "name": "polymer", - "url": "https://www.polymer-project.org/", - "github": "https://github.com/polymer/polymer/", - "stargazers": 12217 - }, { - "name": "Deft.js", - "url": "http://deftjs.org/", - "github": "https://github.com/deftjs/DeftJS/", - "stargazers": 308 - }, { - "name": "Vue", - "url": "http://vuejs.org/", - "github": "https://github.com/yyx990803/vue/", - "stargazers": 6261 - }] - }, { - "name": "UI framework", - "languages": { - "zh-cn": "UI框架" - }, - "children": [{ - "name": "Bootstrap", - "url": "http://getbootstrap.com/", - "github": "https://github.com/twbs/bootstrap/", - "stargazers": 84763 - }, { - "name": "Semantic UI ", - "url": "http://semantic-ui.com/", - "github": "https://github.com/Semantic-Org/Semantic-UI/", - "stargazers": 19552 - }, { - "name": "Foundation", - "url": "http://foundation.zurb.com/", - "github": "https://github.com/zurb/foundation/", - "stargazers": 20711 - }, { - "name": "Material UI", - "url": "http://material-ui.com/", - "github": "https://github.com/callemall/material-ui/", - "stargazers": 10048 - }, { - "name": "jQuery UI", - "url": "http://jqueryui.com/", - "github": "https://github.com/jquery/jquery-ui/", - "stargazers": 9034 - }] - }, { - "name": "WebSocket", - "children": [{ - "name": "Socket.io", - "url": "http://socket.io/", - "github": "https://github.com/Automattic/socket.io/", - "stargazers": 19169 - }, { - "name": "web-socket-js", - "github": "https://github.com/gimite/web-socket-js/", - "stargazers": 2115 - }] - }, { - "name": "Data Visualization", - "languages": { - "zh-cn": "数据可视化" - }, - "children": [{ - "name": "D3", - "url": "http://d3js.org/", - "github": "https://github.com/mbostock/d3/wiki/Gallery/", - "stargazers": 40794 - }, { - "name": "Echarts", - "url": "http://echarts.baidu.com", - "github": "https://github.com/ecomfe/esl/", - "stargazers": 396 - }, { - "name": "HighCharts", - "url": "http://www.highcharts.com/", - "github": "https://github.com/highslide-software/highcharts.com/", - "stargazers": 4041 - }, { - "name": "Vis.js", - "url": "http://visjs.org/", - "github": "https://github.com/almende/vis/", - "stargazers": 2993 - }, { - "name": "Flot", - "url": "http://www.flotcharts.org/", - "github": "https://github.com/flot/flot/", - "stargazers": 4531 - }] - }, { - "name": "WebGL", - "children": [{ - "name": "Three.js", - "url": "http://threejs.org/", - "github": "https://github.com/mrdoob/three.js/", - "stargazers": 20758 - }, { - "name": "Babylon.js", - "url": "http://www.babylonjs.com/", - "github": "https://github.com/BabylonJS/Babylon.js/", - "stargazers": 2349 - }, { - "name": "Pixi.js", - "url": "http://www.pixijs.com/", - "github": "https://github.com/GoodBoyDigital/pixi.js/", - "stargazers": 8361 - }] - }, { - "name": "CSS3 Animation", - "languages": { - "zh-cn": "CSS3 动画" - }, - "children": [{ - "name": "Animate.css", - "url": "https://daneden.github.io/animate.css/", - "github": "https://github.com/daneden/animate.css/", - "stargazers": 24549 - }, { - "name": "bounce.js", - "url": "http://bouncejs.com/", - "github": "https://github.com/tictail/bounce.js/", - "stargazers": 3727 - }, { - "name": "Effeckt.css", - "url": "https://h5bp.github.io/Effeckt.css/", - "github": "https://github.com/h5bp/Effeckt.css/", - "stargazers": 9777 - }, { - "name": "move.js", - "url": "https://visionmedia.github.io/move.js/", - "github": "https://github.com/visionmedia/move.js/", - "stargazers": 2830 - }] - }, { - "name": "Flow Controller", - "languages": { - "zh-cn": "流程控制" - }, - "children": [{ - "name": "ES6", - "children": [{ - "name": "Promise" - }, { - "name": "Generator" - }] - }, { - "name": "ES7", - "children": [{ - "name": "yield" - }, { - "name": "await" - }] - }, { - "name": "async", - "github": "https://github.com/caolan/async/", - "stargazers": 14156 - }, { - "name": "co", - "github": "https://github.com/tj/co/", - "stargazers": 3502 - }, { - "name": "Promise", - "children": [{ - "name": "Bluebird", - "github": "https://github.com/petkaantonov/bluebird/", - "stargazers": 7530 - }, { - "name": "q", - "github": "https://github.com/kriskowal/q/", - "stargazers": 9460 - }, { - "name": "when.js", - "github": "https://github.com/cujojs/when/", - "stargazers": 2579 - }] - }] - }, { - "name": "Functional", - "languages": { - "zh-cn": "函数式编程" - }, - "children": [{ - "name": "backon.js", - "github": "https://github.com/baconjs/bacon.js/", - "stargazers": 4498 - }, { - "name": "immutable.js", - "url": "https://facebook.github.io/immutable-js/", - "github": "https://github.com/facebook/immutable-js/", - "stargazers": 7999 - }] - }, { - "name": "Mobile UI", - "languages": { - "zh-cn": "手机 UI 框架" - }, - "children": [{ - "name": "jQuery Mobile", - "url": "https://jquerymobile.com/", - "github": "https://github.com/jquery/jquery-mobile/", - "stargazers": 9654 - }, { - "name": "Jo", - "url": "http://joapp.com/", - "github": "https://github.com/davebalmer/jo/", - "stargazers": 1227 - }, { - "name": "Dojo Mobile", - "url": "https://dojotoolkit.org/reference-guide/1.10/dojox/mobile.html" - }, { - "name": "Lungo", - "url": "http://lungo.tapquo.com/", - "github": "https://github.com/tapquo/Lungo.js/", - "stargazers": 2457 - }] - }] - }, { - "name": "CSS Pre-processors", - "languages": { - "zh-cn": "CSS 预处理器" - }, - "children": [{ - "name": "LESS", - "children": [{ - "name": "LESS", - "url": "http://lesscss.org/", - "github": "https://github.com/less/less.js/", - "stargazers": 12679 - }, { - "name": "Hat", - "url": "http://lesshat.madebysource.com/", - "github": "https://github.com/csshat/lesshat/", - "stargazers": 2057 - }] - }, { - "name": "Sass(SCSS)", - "children": [{ - "name": "Compass", - "url": "http://compass-style.org/", - "github": "https://github.com/chriseppstein/compass/", - "stargazers": 6406 - }, { - "name": "Bourbon", - "url": "http://bourbon.io/", - "github": "https://github.com/thoughtbot/bourbon/", - "stargazers": 6178 - }, { - "name": "Gumby", - "url": "http://www.gumbyframework.com/", - "github": "https://github.com/GumbyFramework/Gumby/", - "stargazers": 2920 - }] - }, { - "name": "Stylus", - "children": [{ - "name": "nib", - "github": "https://github.com/tj/nib/", - "stargazers": 1520 - }] - }] - }, { - "name": "Template", - "languages": { - "zh-cn": "模板引擎" - }, - "children": [{ - "name": "Handlebars", - "url": "http://handlebarsjs.com/", - "github": "https://github.com/wycats/handlebars.js/", - "stargazers": 8808 - }, { - "name": "Haml", - "url": "http://haml.info/", - "github": "https://github.com/haml/haml/", - "stargazers": 2778 - }, { - "name": "Slim", - "url": "http://slim-lang.com/", - "github": "https://github.com/slim-template/slim/", - "stargazers": 3480 - }, { - "name": "Jade", - "url": "http://jade-lang.com/", - "github": "https://github.com/jadejs/jade/", - "stargazers": 8958 - }, { - "name": "Ejs", - "url": "http://www.embeddedjs.com/" - }, { - "name": "Spacebars", - "url": "http://meteorcapture.com/spacebars/" - }, { - "name": "mustache", - "github": "https://github.com/janl/mustache.js/", - "stargazers": 8139 - }] - }, { - "name": "Modernisation", - "languages": { - "zh-cn": "统一化" - }, - "children": [{ - "name": "Normalize" - }, { - "name": "Reset" - }] - }, { - "name": "Best Practices", - "languages": { - "zh-cn": "最佳实践" - }, - "children": [{ - "name": "SEO", - "url": "https://en.wikipedia.org/wiki/Search_engine_optimization" - }, { - "name": "Responsiveness" - }, { - "name": "CDN", - "url": "https://en.wikipedia.org/wiki/Content_delivery_network" - }] - }, { - "name": "Security", - "languages": { - "zh-cn": "安全" - }, - "children": [{ - "name": "Sandbox" - }, { - "name": "XSS", - "url": "https://en.wikipedia.org/wiki/Cross-site_scripting" - }, { - "name": "CORS", - "url": "http://www.w3.org/TR/cors/" - }] - }, { - "name": "Intermediate Languages", - "languages": { - "zh-cn": "中间语言" - }, - "children": [{ - "name": "CoffeeScript", - "url": "http://coffeescript.org/", - "github": "https://github.com/jashkenas/coffeescript/", - "stargazers": 11755 - }, { - "name": "TypeScript", - "url": "http://www.typescriptlang.org/", - "github": "https://github.com/Microsoft/TypeScript/", - "stargazers": 6379 - }, { - "name": "Dart", - "url": "https://www.dartlang.org/", - "github": "https://github.com/dart-lang/sdk/", - "stargazers": 322 - }, { - "name": "LiveScript", - "url": "http://livescript.net/", - "github": "https://github.com/gkz/LiveScript/", - "stargazers": 1514 - }, { - "name": "ClojureScript", - "github": "https://github.com/clojure/clojurescript/", - "stargazers": 4876 - }] - }, { - "name": "Mobile App Builders", - "languages": { - "zh-cn": "移动应用开发" - }, - "children": [{ - "name": "PhoneGap / Cordova", - "url": "https://cordova.apache.org/", - "github": "https://github.com/apache/cordova-android/" - }, { - "name": "MUI", - "url": "http://dev.dcloud.net.cn/mui/", - "github": "https://github.com/dcloudio/mui/" - }, { - "name": "React Native", - "url": "https://facebook.github.io/react-native/", - "github": "https://github.com/facebook/react-native/" - }, { - "name": "Ionic", - "url": "http://ionicframework.com/", - "github": "https://github.com/driftyco/ionic/" - }] - }] + "name": "Web Front End", + "languages": { + "zh-cn": "Web前端开发技术栈", + "es-es": "Web Front End" + }, + "children": [{ + "name": "Browser", + "languages": { + "zh-cn": "浏览器", + "es-es": "Navegadores" + }, + "children": [{ + "name": "Internet Explorer", + "url": "http://windows.microsoft.com/en-us/internet-explorer/download-ie" + }, { + "name": "Chrome", + "url": "http://www.google.com/chrome/" + }, { + "name": "Firefox", + "url": "https://www.mozilla.org/" + }, { + "name": "Safari", + "url": "http://www.apple.com/safari/" + }, { + "name": "Opera", + "url": "http://www.opera.com/" + }, { + "name": "Edge", + "url": "https://www.microsoft.com/en-us/windows/microsoft-edge" + }, { + "name": "Netscape ;-)", + "url": "https://en.wikipedia.org/wiki/Netscape" + }] + }, { + "name": "Protocol", + "languages": { + "zh-cn": "协议", + "es-es": "Protocolos" + }, + "children": [{ + "name": "HTTP/1.1", + "url": "https://www.ietf.org/rfc/rfc2616.txt", + "children": [{ + "name": "URI", + "languages": { + "zh-cn": "链接" + } + }, { + "name": "Session", + "languages": { + "zh-cn": "会话", + "es-es": "Sesión" + } + }, { + "name": "Authentication", + "languages": { + "zh-cn": "授权", + "es-es": "Autenticación" + } + }, { + "name": "Request", + "languages": { + "zh-cn": "请求", + "es-es": "Petición" + } + }, { + "name": "Response", + "languages": { + "zh-cn": "响应", + "es-es": "Respuesta" + } + }] + }, { + "name": "HTTP/2", + "url": "https://en.wikipedia.org/wiki/HTTP/2", + "children": [{ + "name": "Compression", + "languages": { + "zh-cn": "压缩", + "es-es": "Compresión" + } + }, { + "name": "Minification", + "languages": { + "zh-cn": "打包", + "es-es": "Minificación" + } + }, { + "name": "Server Push", + "languages": { + "zh-cn": "服务器端推送" + } + }] + }, { + "name": "WebSocket" + }] + }, { + "name": "The 3 Pillars", + "languages": { + "zh-cn": "Web三剑客" + }, + "children": [{ + "name": "HTML (HyperText Markup Language)" + }, { + "name": "CSS (Cascading Style Sheets)" + }, { + "name": "JavaScript" + }] + }, { + "name": "Standards", + "languages": { + "zh-cn": "标准", + "es-es": "Estándares" + }, + "children": [{ + "name": "W3C", + "children": [{ + "name": "HTML" + }, { + "name": "CSS" + }, { + "name": "XHTML" + }, { + "name": "XML" + }] + }] + }, { + "name": "Core Concepts", + "languages": { + "zh-cn": "核心概念", + "es-es": "Conceptons principales" + }, + "children": [{ + "name": "HTML", + "children": [{ + "name": "DOM", + "url": "https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model" + }, { + "name": "Element", + "url": "https://developer.mozilla.org/en-US/docs/Web/API/Element" + }, { + "name": "Attribute" + }] + }, { + "name": "JavaScript", + "children": [{ + "name": "Prototype", + "url": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype" + }, { + "name": "Scope", + "url": "https://developer.mozilla.org/en-US/docs/Glossary/Scope" + }, { + "name": "Closure", + "url": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures" + }, { + "name": "JSON (JavaSript Object Notation)", + "url": "https://developer.mozilla.org/en-US/docs/Glossary/JSON" + }, { + "name": "AJAX (Asynchronous JavaScript and XML)", + "url": "https://developer.mozilla.org/en-US/docs/AJAX" + }] + }, { + "name": "CSS", + "children": [{ + "name": "Selector" + }, { + "name": "Priority" + }, { + "name": "Specificity" + }, { + "name": "Box Model" + }] + }] + }, { + "name": "Rendering Engine", + "languages": { + "zh-cn": "渲染引擎", + "es-es": "Motores de renderizado" + }, + "children": [{ + "name": "Trident (IE)", + "url": "https://en.wikipedia.org/wiki/Trident_(layout_engine)" + }, { + "name": "Blink / prev. WebKit (Chrome)", + "url": "http://www.chromium.org/blink", + "github": "" + }, { + "name": "Gecko (Firefox)", + "url": "https://developer.mozilla.org/en-us/docs/Mozilla/Gecko" + }, { + "name": "WebKit (Safari)", + "url": "http://www.webkit.org/" + }, { + "name": "Blink / prev. Presto (Opera)", + "url": "http://www.chromium.org/blink", + "github": "" + }, { + "name": "EdgeHTML (Edge)", + "url": "https://en.wikipedia.org/wiki/EdgeHTML" + }] + }, { + "name": "JavaScript Engine", + "languages": { + "zh-cn": "脚本引擎", + "es-es": "Motores JavaScript" + }, + "children": [{ + "name": "JScript (IE8- / ASP)", + "url": "https://en.wikipedia.org/wiki/JScript" + }, { + "name": "Chakra (IE9+ / Edge)", + "url": "https://en.wikipedia.org/wiki/Chakra_(JScript_engine)" + }, { + "name": "V8 (Chrome / Opera / Nodejs / MongoDB)", + "url": "https://developers.google.com/v8/?hl=zh-CN", + "github": "https://github.com/v8/v8/", + "stargazers": 2577 + }, { + "name": "SpiderMonkey (Firefox)", + "url": " https://developer.mozilla.org/en-us/docs/Mozilla/Projects/SpiderMonkey" + }, { + "name": "JavaScriptCore (Safari)", + "url": "https://en.wikipedia.org/wiki/WebKit#JavaScriptCore" + }] + }, { + "name": "Runtime", + "languages": { + "zh-cn": "运行时", + "es-es": "Tiempo de ejecución" + }, + "children": [{ + "name": "Cookie" + }, { + "name": "Local Cache" + }, { + "name": "Session Storage" + }, { + "name": "Local Storage" + }, { + "name": "Components", + "languages": { + "es-es": "Componentes" + }, + "children": [{ + "name": "Extensions", + "languages": { + "es-es": "Extensiones" + } + }, { + "name": "Plugins" + }] + }, { + "name": "Resources", + "children": [{ + "name": "Images" + }, { + "name": "Icons" + }, { + "name": "Fonts" + }, { + "name": "Audios" + }, { + "name": "Videos" + }] + }] + }, { + "name": "Editors", + "languages": { + "zh-cn": "编辑器", + "es-es": "Editores de texto" + }, + "children": [{ + "name": "Sublime Text", + "url": "http://www.sublimetext.com/" + }, { + "name": "WebStorm", + "url": "https://www.jetbrains.com/webstorm/" + }, { + "name": "Atom", + "url": "https://atom.io/", + "github": "https://github.com/atom/atom/", + "stargazers": 19510 + }, { + "name": "Vim", + "url": "http://www.vim.org/" + }, { + "name": "Emacs", + "url": "https://www.gnu.org/software/emacs/" + }, { + "name": "Brackets", + "url": "http://brackets.io/", + "github": "https://github.com/adobe/brackets/", + "stargazers": 23091 + }, { + "name": "Light Table", + "url": "http://lighttable.com/", + "github": "https://github.com/LightTable/LightTable/", + "stargazers": 7926 + }, { + "name": "Visual Studio", + "url": "https://www.visualstudio.com/" + }, { + "name": "Visual Studio Code (Linux & Mac)", + "url": "https://code.visualstudio.com/", + "github": "https://github.com/Microsoft/vscode", + "stargazers": 6652 + }, { + "name": "Dreamweaver ;-)" + }, { + "name": "FrontPage / SharePoint Designer ;-)" + }] + }, { + "name": "Build Tasks", + "languages": { + "zh-cn": "编译任务" + }, + "children": [{ + "name": "Minification", + "languages": { + "zh-cn": "精简", + "es-es": "Minificación" + } + }, { + "name": "Compilation", + "languages": { + "zh-cn": "编译", + "es-es": "Compilación" + } + }, { + "name": "Concatenation", + "languages": { + "zh-cn": "合并", + "es-es": "Concatenación" + } + }, { + "name": "Uglification", + "languages": { + "zh-cn": "混淆" + } + }, { + "name": "Image Optimization", + "languages": { + "zh-cn": "图像优化", + "es-es": "Optimización de imágenes" + } + }, { + "name": "Unit Testing", + "languages": { + "zh-cn": "单元测试", + "es-es": "Tests unitarios" + } + }] + }, { + "name": "Build Tools", + "languages": { + "zh-cn": "编译工具", + "es-es": "Herramientas de tareas" + }, + "children": [{ + "name": "Grunt", + "url": "http://www.gruntjs.com/", + "github": "https://github.com/cowboy/jquery-tiny-pubsub/", + "stargazers": 662 + }, { + "name": "Gulp", + "url": "http://gulpjs.com/", + "github": "https://github.com/gulpjs/gulp/", + "stargazers": 15661 + }, { + "name": "Brunch", + "url": "http://brunch.io/", + "github": "https://github.com/brunch/brunch/", + "stargazers": 4472 + }, { + "name": "Yeoman", + "url": "http://yeoman.io/" + }, { + "name": "Broccoli", + "github": "https://github.com/broccolijs/broccoli/", + "stargazers": 2391 + }] + }, { + "name": "Debug", + "languages": { + "zh-cn": "调试", + "es-es": "Depuración" + }, + "children": [{ + "name": "Developer Tools", + "url": "https://developer.chrome.com/devtools" + }, { + "name": "Firebug", + "url": "http://getfirebug.com/", + "github": "https://github.com/firebug/firebug/", + "stargazers": 924 + }] + }, { + "name": "Base Tools", + "languages": { + "zh-cn": "基础工具", + "es-es": "Herramientas base" + }, + "children": [{ + "name": "Node.js", + "url": "https://nodejs.org/", + "github": "https://github.com/joyent/node/", + "stargazers": 37851 + }, { + "name": "Phantom.js", + "url": "http://phantomjs.org/", + "github": "https://github.com/ariya/phantomjs/", + "stargazers": 14950 + }, { + "name": "SpiderMonkey", + "url": "https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey" + }] + }, { + "name": "Quality", + "languages": { + "zh-cn": "质量控制", + "es-es": "Calidad" + }, + "children": [{ + "name": "JSLint", + "url": "http://www.jslint.com/", + "github": "https://github.com/douglascrockford/JSLint/", + "stargazers": 2382 + }, { + "name": "JSHint", + "url": "http://jshint.com/", + "github": "https://github.com/jshint/jshint/", + "stargazers": 5384 + }, { + "name": "jscs", + "url": "http://jscs.info/", + "github": "https://github.com/jscs-dev/node-jscs", + "stargazers": 3982 + }, { + "name": "Closure Linter", + "url": "https://developers.google.com/closure/utilities/" + }] + }, { + "name": "Package", + "languages": { + "zh-cn": "包管理", + "es-es": "Gestores de paquetes" + }, + "children": [{ + "name": "npm", + "url": "https://www.npmjs.com/", + "github": "https://github.com/npm/npm/", + "stargazers": 6816 + }, { + "name": "Bower", + "url": "http://bower.io/", + "github": "https://github.com/bower/bower/", + "stargazers": 12747 + }] + }, { + "name": "Test", + "languages": { + "zh-cn": "测试" + }, + "children": [{ + "name": "Tools", + "languages": { + "zh-cn": "工具", + "es-es": "Herramientas" + }, + "children": [{ + "name": "QUnit", + "url": "https://qunitjs.com/", + "github": "https://github.com/jquery/qunit/", + "stargazers": 3228 + }, { + "name": "Jasmine", + "url": "http://jasmine.github.io/", + "github": "https://github.com/jasmine/jasmine/", + "stargazers": 9303 + }, { + "name": "Mocha", + "url": "https://mochajs.org/", + "github": "https://github.com/mochajs/mocha/", + "stargazers": 7226 + }, { + "name": "Selenium", + "url": "http://www.seleniumhq.org/", + "github": "https://github.com/SeleniumHQ/selenium/", + "stargazers": 1563 + }, { + "name": "WebDriverIO", + "url": "http://webdriver.io/", + "github": "https://github.com/webdriverio/webdriverio/", + "stargazers": 1073 + }, { + "name": "Protractor", + "url": "http://www.protractortest.org/" + }, { + "name": "Chai", + "url": "http://chaijs.com/", + "github": "https://github.com/jfirebaugh/konacha/", + "stargazers": 977 + }, { + "name": "Sinon.JS", + "url": "http://sinonjs.org/", + "github": "https://github.com/cjohansen/Sinon.JS/", + "stargazers": 2230 + }, { + "name": "Karma", + "url": "http://karma-runner.github.io/", + "github": "https://github.com/karma-runner/karma/", + "stargazers": 5550 + }, { + "name": "nodeunit", + "github": "https://github.com/caolan/nodeunit/", + "stargazers": 1608 + }, { + "name": "tape", + "github": "http://github.com/substack/tape", + "stargazers": 1264 + }, { + "name": "nightmare", + "url": "http://nightmarejs.org/", + "github": "https://github.com/segmentio/nightmare", + "stargazers": 6110 + }] + }, { + "name": "Composite", + "languages": { + "zh-cn": "在线工具" + }, + "children": [{ + "name": "Sauce Labs", + "url": "https://saucelabs.com/" + }, { + "name": "Browser Stack", + "url": "https://www.browserstack.com/" + }, { + "name": "Browser Shots", + "url": "http://browsershots.org/" + }, { + "name": "Browserling", + "url": "https://www.browserling.com/" + }, { + "name": "Browser Sandbox", + "url": "https://spoon.net/browsers/" + }, { + "name": "Cross Browser Testing", + "url": "https://crossbrowsertesting.com/" + }, { + "name": "Browsera", + "url": "http://www.browsera.com/" + }, { + "name": "SortSite", + "url": "http://www.powermapper.com/products/sortsite/checks/browser-compatibility/" + }] + }] + }, { + "name": "Frameworks / Libraries", + "languages": { + "zh-cn": "库 / 框架", + "es-es": "Librerías y frameworks" + }, + "children": [{ + "name": "JavaScript base library", + "languages": { + "zh-cn": "基础库" + }, + "children": [{ + "name": "jQuery", + "url": "https://jquery.com/", + "github": "https://github.com/jquery/jquery/", + "stargazers": 35652 + }, { + "name": "Prototype", + "url": "http://prototypejs.org/", + "github": "https://github.com/sstephenson/prototype/", + "stargazers": 3022 + }, { + "name": "Zepto", + "url": "http://zeptojs.com/", + "github": "https://github.com/madrobby/zepto/", + "stargazers": 9109 + }, { + "name": "MooTool", + "url": "http://mootools.net/", + "github": "https://github.com/mootools/mootools-core/", + "stargazers": 2168 + }] + }, { + "name": "Modular", + "languages": { + "zh-cn": "模块化", + "es-es": "Módulos" + }, + "children": [{ + "name": "ES6 Module" + }, { + "name": "CommonJS", + "children": [{ + "name": "webpack", + "url": "http://webpack.github.io/", + "github": "https://github.com/webpack/webpack/", + "stargazers": 7271 + }, { + "name": "browserify", + "url": "http://browserify.org/", + "github": "https://github.com/substack/node-browserify/", + "stargazers": 8004 + }] + }, { + "name": "AMD", + "children": [{ + "name": "RequireJS", + "url": "http://requirejs.org/", + "github": "https://github.com/jrburke/requirejs/", + "stargazers": 8002 + }] + }, { + "name": "UMD", + "children": [{ + "name": "umd", + "github": "https://github.com/umdjs/umd/", + "stargazers": 2764 + }] + }] + }, { + "name": "JavaScript Framework", + "languages": { + "zh-cn": "框架" + }, + "children": [{ + "name": "AngularJS", + "url": "https://angularjs.org/", + "github": "https://github.com/angular/angular.js/", + "stargazers": 41780 + }, { + "name": "Backbone", + "url": "http://backbonejs.org/", + "github": "https://github.com/jashkenas/backbone/", + "stargazers": 22720 + }, { + "name": "Knockout", + "url": "http://knockoutjs.com/", + "github": "https://github.com/SteveSanderson/knockout/", + "stargazers": 6660 + }, { + "name": "Ember", + "url": "http://emberjs.com/", + "github": "https://github.com/emberjs/ember.js/", + "stargazers": 14555 + }, { + "name": "React", + "url": "http://facebook.github.io/react/", + "github": "https://github.com/facebook/react/", + "stargazers": 26617 + }, { + "name": "polymer", + "url": "https://www.polymer-project.org/", + "github": "https://github.com/polymer/polymer/", + "stargazers": 12217 + }, { + "name": "Deft.js", + "url": "http://deftjs.org/", + "github": "https://github.com/deftjs/DeftJS/", + "stargazers": 308 + }, { + "name": "Vue", + "url": "http://vuejs.org/", + "github": "https://github.com/yyx990803/vue/", + "stargazers": 6261 + }, { + "name": "Riot", + "url": "http://riotjs.com/", + "github": "https://github.com/riot/riot", + "stargazers": 7875 + }] + }, { + "name": "UI framework", + "languages": { + "zh-cn": "UI框架" + }, + "children": [{ + "name": "Bootstrap", + "url": "http://getbootstrap.com/", + "github": "https://github.com/twbs/bootstrap/", + "stargazers": 84763 + }, { + "name": "Semantic UI", + "url": "http://semantic-ui.com/", + "github": "https://github.com/Semantic-Org/Semantic-UI/", + "stargazers": 19552 + }, { + "name": "Foundation", + "url": "http://foundation.zurb.com/", + "github": "https://github.com/zurb/foundation/", + "stargazers": 20711 + }, { + "name": "Material UI", + "url": "http://material-ui.com/", + "github": "https://github.com/callemall/material-ui/", + "stargazers": 10048 + }, { + "name": "WinJS", + "url": "https://dev.windows.com/en-us/develop/winjs", + "github": "https://github.com/winjs/winjs", + "stargazers": 3621 + }, { + "name": "Pure", + "url": "http://purecss.io/", + "github": "https://github.com/yahoo/pure/", + "stargazers": 12367 + }, { + "name": "Amaze UI", + "url": "http://amazeui.org/", + "github": "https://github.com/allmobilize/amazeui", + "stargazers": 5965 + }] + }, { + "name": "WebSocket", + "children": [{ + "name": "Socket.io", + "url": "http://socket.io/", + "github": "https://github.com/Automattic/socket.io/", + "stargazers": 19169 + }, { + "name": "web-socket-js", + "github": "https://github.com/gimite/web-socket-js/", + "stargazers": 2115 + }] + }, { + "name": "Data Visualization", + "languages": { + "zh-cn": "数据可视化", + "es-es": "Visualización de datos" + }, + "children": [{ + "name": "D3", + "url": "http://d3js.org/", + "github": "https://github.com/mbostock/d3/wiki/Gallery/", + "stargazers": 40794 + }, { + "name": "Echarts", + "url": "http://echarts.baidu.com", + "github": "https://github.com/ecomfe/esl/", + "stargazers": 396 + }, { + "name": "HighCharts", + "url": "http://www.highcharts.com/", + "github": "https://github.com/highslide-software/highcharts.com/", + "stargazers": 4041 + }, { + "name": "Vis.js", + "url": "http://visjs.org/", + "github": "https://github.com/almende/vis/", + "stargazers": 2993 + }, { + "name": "Flot", + "url": "http://www.flotcharts.org/", + "github": "https://github.com/flot/flot/", + "stargazers": 4531 + }] + }, { + "name": "WebGL", + "children": [{ + "name": "Three.js", + "url": "http://threejs.org/", + "github": "https://github.com/mrdoob/three.js/", + "stargazers": 20758 + }, { + "name": "Babylon.js", + "url": "http://www.babylonjs.com/", + "github": "https://github.com/BabylonJS/Babylon.js/", + "stargazers": 2349 + }, { + "name": "Pixi.js", + "url": "http://www.pixijs.com/", + "github": "https://github.com/GoodBoyDigital/pixi.js/", + "stargazers": 8361 + }] + }, { + "name": "CSS3 Animation", + "languages": { + "zh-cn": "CSS3 动画" + }, + "children": [{ + "name": "Animate.css", + "url": "https://daneden.github.io/animate.css/", + "github": "https://github.com/daneden/animate.css/", + "stargazers": 24549 + }, { + "name": "bounce.js", + "url": "http://bouncejs.com/", + "github": "https://github.com/tictail/bounce.js/", + "stargazers": 3727 + }, { + "name": "Effeckt.css", + "url": "https://h5bp.github.io/Effeckt.css/", + "github": "https://github.com/h5bp/Effeckt.css/", + "stargazers": 9777 + }, { + "name": "move.js", + "url": "https://visionmedia.github.io/move.js/", + "github": "https://github.com/visionmedia/move.js/", + "stargazers": 2830 + }] + }, { + "name": "Flow Controller", + "languages": { + "zh-cn": "流程控制", + "es-es": "Control de flujo" + }, + "children": [{ + "name": "ES6", + "children": [{ + "name": "Promise" + }, { + "name": "Generator" + }] + }, { + "name": "ES7", + "children": [{ + "name": "yield" + }, { + "name": "await" + }] + }, { + "name": "async", + "github": "https://github.com/caolan/async/", + "stargazers": 14156 + }, { + "name": "co", + "github": "https://github.com/tj/co/", + "stargazers": 3502 + }, { + "name": "Promise", + "children": [{ + "name": "Bluebird", + "github": "https://github.com/petkaantonov/bluebird/", + "stargazers": 7530 + }, { + "name": "q", + "github": "https://github.com/kriskowal/q/", + "stargazers": 9460 + }, { + "name": "when.js", + "github": "https://github.com/cujojs/when/", + "stargazers": 2579 + }] + }] + }, { + "name": "Functional", + "languages": { + "zh-cn": "函数式编程", + "es-es": "Funcional" + }, + "children": [{ + "name": "bacon.js", + "url": "http://baconjs.github.io/", + "github": "https://github.com/baconjs/bacon.js/", + "stargazers": 4498 + }, { + "name": "immutable.js", + "url": "https://facebook.github.io/immutable-js/", + "github": "https://github.com/facebook/immutable-js/", + "stargazers": 7999 + }, { + "name": "ramda", + "url": "http://ramdajs.com/", + "github": "http://github.com/ramda/ramda", + "stargazers": 2792 + }, { + "name": "underscore.js", + "url": "http://underscorejs.org/", + "github": "https://github.com/jashkenas/underscore", + "stargazers": 15823 + }, { + "name": "lodash", + "url": "https://lodash.com/", + "github": "https://github.com/lodash/lodash", + "stargazers": 11071 + }, { + "name": "ReactiveX", + "url": "http://reactivex.io/", + "github": "https://github.com/Reactive-Extensions/RxJS", + "stargazers": 6720 + }] + }, { + "name": "Mobile UI", + "languages": { + "zh-cn": "手机 UI 框架" + }, + "children": [{ + "name": "jQuery Mobile", + "url": "https://jquerymobile.com/", + "github": "https://github.com/jquery/jquery-mobile/", + "stargazers": 9654 + }, { + "name": "Jo", + "url": "http://joapp.com/", + "github": "https://github.com/davebalmer/jo/", + "stargazers": 1227 + }, { + "name": "Dojo Mobile", + "url": "https://dojotoolkit.org/reference-guide/1.10/dojox/mobile.html" + }, { + "name": "Lungo", + "url": "http://lungo.tapquo.com/", + "github": "https://github.com/tapquo/Lungo.js/", + "stargazers": 2457 + }] + }] + }, { + "name": "CSS Pre-processors", + "languages": { + "zh-cn": "CSS 预处理器", + "es-es": "Pre-procesadores CSS" + }, + "children": [{ + "name": "LESS", + "children": [{ + "name": "LESS", + "url": "http://lesscss.org/", + "github": "https://github.com/less/less.js/", + "stargazers": 12679 + }, { + "name": "Hat", + "url": "http://lesshat.madebysource.com/", + "github": "https://github.com/csshat/lesshat/", + "stargazers": 2057 + }] + }, { + "name": "Sass(SCSS)", + "children": [{ + "name": "Compass", + "url": "http://compass-style.org/", + "github": "https://github.com/chriseppstein/compass/", + "stargazers": 6406 + }, { + "name": "Bourbon", + "url": "http://bourbon.io/", + "github": "https://github.com/thoughtbot/bourbon/", + "stargazers": 6178 + }, { + "name": "Gumby", + "url": "http://www.gumbyframework.com/", + "github": "https://github.com/GumbyFramework/Gumby/", + "stargazers": 2920 + }] + }, { + "name": "Stylus", + "children": [{ + "name": "nib", + "github": "https://github.com/tj/nib/", + "stargazers": 1520 + }] + }] + }, { + "name": "Future Standards", + "languages": { + "zh-cn": "未来标准" + }, + "children": [{ + "name": "babel", + "github": "https://github.com/babel/babel", + "url": "https://babeljs.io/", + "stargazers": 9712 + }] + }, { + "name": "Template", + "languages": { + "zh-cn": "模板引擎", + "es-es": "Plantillas" + }, + "children": [{ + "name": "Handlebars", + "url": "http://handlebarsjs.com/", + "github": "https://github.com/wycats/handlebars.js/", + "stargazers": 8808 + }, { + "name": "Haml", + "url": "http://haml.info/", + "github": "https://github.com/haml/haml/", + "stargazers": 2778 + }, { + "name": "Slim", + "url": "http://slim-lang.com/", + "github": "https://github.com/slim-template/slim/", + "stargazers": 3480 + }, { + "name": "Jade", + "url": "http://jade-lang.com/", + "github": "https://github.com/jadejs/jade/", + "stargazers": 8958 + }, { + "name": "Ejs", + "url": "http://www.embeddedjs.com/" + }, { + "name": "Spacebars", + "url": "http://meteorcapture.com/spacebars/" + }, { + "name": "mustache", + "url": "http://mustache.github.io/", + "github": "https://github.com/janl/mustache.js/", + "stargazers": 8139 + }] + }, { + "name": "Modernisation", + "languages": { + "zh-cn": "统一化" + }, + "children": [{ + "name": "Normalize", + "url": "http://necolas.github.io/normalize.css/", + "github": "https://github.com/necolas/normalize.css/", + "stargazers": 17966 + }, { + "name": "Reset" + }] + }, { + "name": "Best Practices", + "languages": { + "zh-cn": "最佳实践", + "es-es": "Buenas prácticas" + }, + "children": [{ + "name": "SEO", + "url": "https://en.wikipedia.org/wiki/Search_engine_optimization" + }, { + "name": "Responsiveness" + }, { + "name": "CDN", + "url": "https://en.wikipedia.org/wiki/Content_delivery_network" + }] + }, { + "name": "Security", + "languages": { + "zh-cn": "安全", + "es-es": "Seguridad" + }, + "children": [{ + "name": "Sandbox" + }, { + "name": "XSS", + "url": "https://en.wikipedia.org/wiki/Cross-site_scripting" + }, { + "name": "CORS", + "url": "http://www.w3.org/TR/cors/" + }] + }, { + "name": "Intermediate Languages", + "languages": { + "zh-cn": "中间语言", + "es-es": "Lenguajes intermedios" + }, + "children": [{ + "name": "CoffeeScript", + "url": "http://coffeescript.org/", + "github": "https://github.com/jashkenas/coffeescript/", + "stargazers": 11755 + }, { + "name": "TypeScript", + "url": "http://www.typescriptlang.org/", + "github": "https://github.com/Microsoft/TypeScript/", + "stargazers": 6379 + }, { + "name": "ClojureScript", + "github": "https://github.com/clojure/clojurescript/", + "stargazers": 4876 + }, { + "name": "JSX (Facebook)", + "url": "http://facebook.github.io/react/docs/jsx-in-depth.html" + }] + }, { + "name": "Mobile Application Development", + "languages": { + "zh-cn": "移动应用开发", + "es-es": "Empaquetadores de Apps para móvil" + }, + "children": [{ + "name": "PhoneGap / Cordova", + "url": "https://cordova.apache.org/", + "github": "https://github.com/apache/cordova-android/", + "stargazers": 1166 + }, { + "name": "MUI", + "url": "http://dev.dcloud.net.cn/mui/", + "github": "https://github.com/dcloudio/mui/", + "stargazers": 1476 + }, { + "name": "React Native", + "url": "https://facebook.github.io/react-native/", + "github": "https://github.com/facebook/react-native/", + "stargazers": 19802 + }, { + "name": "Ionic", + "url": "http://ionicframework.com/", + "github": "https://github.com/driftyco/ionic/", + "stargazers": 19472 + }] + }, { + "name": "Desktop Application Development", + "languages": { + "zh-cn": "桌面应用开发" + }, + "children": [{ + "name": "Electron", + "url": "http://electron.atom.io/", + "github": "https://github.com/atom/electron", + "stargazers": 16896 + }, { + "name": "NW.js", + "url": "http://nwjs.io/", + "github": "https://github.com/nwjs/nw.js", + "stargazers": 24680 + }] + }] }