Los mejores proyectos JavaScript del 2017

Al igual que hicimos el año pasado, es hora de mirar atrás y analizar el mundo JavaScript del 2017.

Usando los datos que hemos recopilado, veamos qué proyectos han tenido más peso en 2017 comparando el número de estrellas de GitHub ganadas en los últimos 12 meses y averigüemos cuáles han sido los JavaScript Rising Stars del 2017.



Los siguientes gráficos comparan el número de estrellas añadidas en GitHub durante los últimos 12 meses. Hemos analizado proyectos procedentes de bestofjs.org, una lista de los proyectos más destacados del mundo web cuidadosamente seleccionados. Si lo deseas, puedes hacer click en cualquier proyecto para conseguir más información.

Proyectos más populares del 2017

1
Vue.js

Vue.js

🖖 A progressive, incrementally-adoptable JavaScript framework for building UI on the web.
+40.0k☆
En 2017, Vue.js consiguió 40.0k estrellas, llegando a alcanzar el puesto #1 en Proyecto JavaScript en GitHub Tweet
3.0k
3.5k
3.9k
3.1k
3.2k
3.1k
3.6k
3.3k
3.6k
3.4k
3.1k
3.0k
E
F
M
A
M
J
J
A
S
O
N
D
2
React

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
+27.8k☆
En 2017, React consiguió 27.8k estrellas, llegando a alcanzar el puesto #2 en Proyecto JavaScript en GitHub Tweet
2.0k
2.0k
2.6k
2.3k
2.3k
2.0k
2.6k
2.2k
2.5k
2.8k
2.5k
2.2k
E
F
M
A
M
J
J
A
S
O
N
D
3
Create React App

Create React App

Create React apps with no build configuration.
+22.5k☆
En 2017, Create React App consiguió 22.5k estrellas, llegando a alcanzar el puesto #3 en Proyecto JavaScript en GitHub Tweet
2.1k
1.8k
2.3k
1.8k
2.2k
1.8k
1.9k
2.3k
1.5k
1.7k
1.7k
1.5k
E
F
M
A
M
J
J
A
S
O
N
D
4
Puppeteer

Puppeteer

Headless Chrome Node API
+22.0k☆
En 2017, Puppeteer consiguió 22.0k estrellas, llegando a alcanzar el puesto #4 en Proyecto JavaScript en GitHub Tweet
3.9k
2.9k
3.0k
2.2k
1.9k
E
F
M
A
M
J
J
A
S
O
N
D
5
Axios

Axios

Promise based HTTP client for the browser and node.js
+21.9k☆
En 2017, Axios consiguió 21.9k estrellas, llegando a alcanzar el puesto #5 en Proyecto JavaScript en GitHub Tweet
1.5k
1.7k
2.2k
2.0k
1.9k
1.8k
1.9k
1.9k
1.7k
1.7k
1.9k
1.7k
E
F
M
A
M
J
J
A
S
O
N
D
6
VS Code

VS Code

Visual Studio Code
+20.2k☆
En 2017, VS Code consiguió 20.2k estrellas, llegando a alcanzar el puesto #6 en Proyecto JavaScript en GitHub Tweet
897
1.4k
1.8k
1.7k
1.5k
1.3k
1.4k
1.6k
1.6k
2.5k
2.6k
1.8k
E
F
M
A
M
J
J
A
S
O
N
D
7
Prettier

Prettier

Prettier is an opinionated code formatter.
+17.7k☆
En 2017, Prettier consiguió 17.7k estrellas, llegando a alcanzar el puesto #7 en Proyecto JavaScript en GitHub Tweet
114
1.1k
1.3k
2.6k
1.0k
1.8k
1.0k
1.3k
721
1.4k
956
1.5k
E
F
M
A
M
J
J
A
S
O
N
D
8
React Native

React Native

A framework for building native apps with React.
+15.6k☆
En 2017, React Native consiguió 15.6k estrellas, llegando a alcanzar el puesto #8 en Proyecto JavaScript en GitHub Tweet
1.2k
1.3k
1.6k
1.3k
1.3k
1.3k
1.3k
1.2k
1.1k
1.2k
1.3k
1.2k
E
F
M
A
M
J
J
A
S
O
N
D
9
Element

Element

A Vue.js 2.0 UI Toolkit for Web
+14.9k☆
En 2017, Element consiguió 14.9k estrellas, llegando a alcanzar el puesto #9 en Proyecto JavaScript en GitHub Tweet
1.4k
1.2k
1.8k
1.2k
1.1k
1.0k
1.1k
1.1k
1.3k
1.4k
1.3k
1.1k
E
F
M
A
M
J
J
A
S
O
N
D
10
Electron

Electron

Build cross platform desktop apps with JavaScript, HTML, and CSS
+14.8k☆
En 2017, Electron consiguió 14.8k estrellas, llegando a alcanzar el puesto #10 en Proyecto JavaScript en GitHub Tweet
1.3k
1.2k
1.4k
1.3k
1.3k
1.1k
1.2k
1.2k
1.1k
1.3k
1.2k
1.2k
E
F
M
A
M
J
J
A
S
O
N
D
11
Bootstrap

Bootstrap

The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first project
+14.5k☆
En 2017, Bootstrap consiguió 14.5k estrellas, llegando a alcanzar el puesto #11 en Proyecto JavaScript en GitHub Tweet
996
1.0k
1.4k
1.3k
1.1k
1.0k
1.1k
1.4k
1.2k
1.5k
1.3k
1.1k
E
F
M
A
M
J
J
A
S
O
N
D
12
Parcel

Parcel

📦🚀 Blazing fast, zero configuration web application bundler
+14.0k☆
En 2017, Parcel consiguió 14.0k estrellas, llegando a alcanzar el puesto #12 en Proyecto JavaScript en GitHub Tweet
1
1
13.9k
E
F
M
A
M
J
J
A
S
O
N
D
13
Node.js

Node.js

Node.js JavaScript runtime
+13.7k☆
En 2017, Node.js consiguió 13.7k estrellas, llegando a alcanzar el puesto #13 en Proyecto JavaScript en GitHub Tweet
869
1.1k
1.2k
1.0k
1.1k
1.1k
1.0k
1.2k
946
1.8k
1.5k
1.0k
E
F
M
A
M
J
J
A
S
O
N
D
14
Ant Design

Ant Design

🐜 A UI Design Language
+13.3k☆
En 2017, Ant Design consiguió 13.3k estrellas, llegando a alcanzar el puesto #14 en Proyecto JavaScript en GitHub Tweet
936
1.1k
971
910
928
941
1.1k
887
1.2k
1.3k
1.6k
E
F
M
A
M
J
J
A
S
O
N
D
15
Webpack

Webpack

A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting a
+13.1k☆
En 2017, Webpack consiguió 13.1k estrellas, llegando a alcanzar el puesto #15 en Proyecto JavaScript en GitHub Tweet
1.4k
1.2k
1.2k
1.1k
1.1k
1.2k
1.1k
995
714
1.0k
1.0k
1.0k
E
F
M
A
M
J
J
A
S
O
N
D
16
Next.js

Next.js

Framework for server-rendered or statically-exported React apps
+12.7k☆
En 2017, Next.js consiguió 12.7k estrellas, llegando a alcanzar el puesto #16 en Proyecto JavaScript en GitHub Tweet
893
664
2.1k
1.3k
1.2k
745
1.2k
856
697
1.2k
864
960
E
F
M
A
M
J
J
A
S
O
N
D
17
D3

D3

Bring data to life with SVG, Canvas and HTML.
+12.7k☆
En 2017, D3 consiguió 12.7k estrellas, llegando a alcanzar el puesto #17 en Proyecto JavaScript en GitHub Tweet
1.1k
1.1k
1.6k
1.3k
1.1k
768
1.0k
1.0k
985
879
879
797
E
F
M
A
M
J
J
A
S
O
N
D
18
Angular

Angular

One framework. Mobile & desktop.
+12.2k☆
En 2017, Angular consiguió 12.2k estrellas, llegando a alcanzar el puesto #18 en Proyecto JavaScript en GitHub Tweet
827
949
1.4k
1.0k
884
911
983
989
925
1.1k
1.2k
930
E
F
M
A
M
J
J
A
S
O
N
D
19
Bulma

Bulma

Modern CSS framework based on Flexbox
+12.0k☆
En 2017, Bulma consiguió 12.0k estrellas, llegando a alcanzar el puesto #19 en Proyecto JavaScript en GitHub Tweet
1.1k
867
927
840
907
873
1.1k
1.1k
888
1.7k
1.0k
778
E
F
M
A
M
J
J
A
S
O
N
D
20
TypeScript

TypeScript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
+11.6k☆
En 2017, TypeScript consiguió 11.6k estrellas, llegando a alcanzar el puesto #20 en Proyecto JavaScript en GitHub Tweet
738
855
972
1.1k
928
936
976
1.0k
818
1.2k
1.1k
992
E
F
M
A
M
J
J
A
S
O
N
D
21
Preact

Preact

⚛️ Fast 3kB React alternative with the same modern API. Components & Virtual DOM.
+10.4k☆
En 2017, Preact consiguió 10.4k estrellas, llegando a alcanzar el puesto #21 en Proyecto JavaScript en GitHub Tweet
779
498
575
634
829
920
729
2.0k
1.9k
545
401
532
E
F
M
A
M
J
J
A
S
O
N
D
22
Redux

Redux

Predictable state container for JavaScript apps
+10.1k☆
En 2017, Redux consiguió 10.1k estrellas, llegando a alcanzar el puesto #22 en Proyecto JavaScript en GitHub Tweet
870
821
1.1k
913
820
780
767
809
738
812
876
797
E
F
M
A
M
J
J
A
S
O
N
D
23
Animate.css

Animate.css

🍿 A cross-browser library of CSS animations. As easy to use as an easy thing.
+10.0k☆
En 2017, Animate.css consiguió 10.0k estrellas, llegando a alcanzar el puesto #23 en Proyecto JavaScript en GitHub Tweet
784
757
942
922
817
764
776
822
777
894
961
743
E
F
M
A
M
J
J
A
S
O
N
D
24
Storybook

Storybook

Interactive UI component dev & test: React, React Native, Vue, Angular
+9.7k☆
En 2017, Storybook consiguió 9.7k estrellas, llegando a alcanzar el puesto #24 en Proyecto JavaScript en GitHub Tweet
467
429
666
627
807
940
704
1.0k
671
837
1.3k
1.2k
E
F
M
A
M
J
J
A
S
O
N
D
25
Gatsby

Gatsby

⚛️📄🚀 Blazing fast static site generator for React
+9.7k☆
En 2017, Gatsby consiguió 9.7k estrellas, llegando a alcanzar el puesto #25 en Proyecto JavaScript en GitHub Tweet
717
481
508
438
573
505
2.1k
664
698
1.1k
796
1.2k
E
F
M
A
M
J
J
A
S
O
N
D

Resumen

En esta sección encontraremos los proyectos más populares del año, independientemente de su categoría.

Vue.js golpea de nuevo

Una vez más, Vue.js vuelve a ser el proyecto más popular del año, con más de 40.000 estrellas en GitHub ganadas durante 2017.

Muchas más de las 26.000 estrellas que consiguió en 2016 y además se distancia de su competidor más cercano (React).

Pero, ¿qué es lo que hace a Vue.js tan especial?

  • Su curva de aprendizaje es pequeña, con un enfoque orientado a componentes parecido al de React pero con una sintaxis más sencilla.
  • Su ecosistema está bien definido, incluyendo soluciones para tareas como:
  • El concepto de componente en un solo fichero .vue que incluye plantilla, lógica y estilos, siendo además algo opcional si no te convence la idea.
  • Laravel, uno de los frameworks PHP más populares, lo usa por defecto como su motor en la vista.
  • No está respaldado por una gran empresa como Facebook o Google, sin embargo, está mantenido por Evan You como proyecto open-source patrocinado a través de crowd-sourcing.

Vue.js es muy popular entre desarrolladores procedentes de China. Es usado por la mayor plataforma e-commerce China (Alibaba) y también por empresas como GitLab o Adobe.

React, ¡de nuevo en el segundo puesto!

Al igual que en 2016, React es el número 2, con más de 27.000 estrellas conseguidas en GitHub (recalcar que hablamos de estrellas conseguidas a lo largo del año, no del número total de estrellas).

Create React App, el tercero en la lista, es la forma recomendada de empezar un proyecto nuevo con React, su éxito ha quitado popularidad a muchas de las React boilerplates, anteriormente muy extendidas.

Dan Abramov (el creador de Redux, ahora trabajando en Facebook) hizo un buen trabajo, encontrando el equilibrio perfecto entre simplicidad y utilidad. Por ejemplo, no se implementa ninguna solución sofisticada para el estilo (simplemente CSS plano) y no hay server-side rendering por defecto, pero todo el build está preconfigurado y listo para empezar, ayudando a tener una mejor experiencia de desarrollo.

Axios

La librería Axios es el cliente HTTP más usado.

Funciona tanto en el lado front-end (llamadas AJAX desde el cliente) como en el lado servidor (llamadas HTTP en un entorno Node.js).

Su éxito debe estar relacionado con Vue.js, ya que muchos tutoriales sobre éste utilizan Axios para hacer llamadas a APIs externas mediante HTTP.

Puppeteer

Puppeteer es una de las historias más interesantes del año. Creado por el equipo de Google Chrome, es una librería Node que implementa lo llamado headless browser, un Chrome o Chromium que se ejecuta en background y que es controlado por código.

Este puede ser usado para cosas como:

  • Automatizar tests para UI de aplicaciones web en navegadores reales.
  • Crear snapshots de páginas web para hacer server-side rendering.
  • Generar ficheros PDF usando la funcionalidad de Google Chrome para guardar páginas como PDF.

Frameworks Front-end

1
Vue.js

Vue.js

🖖 A progressive, incrementally-adoptable JavaScript framework for building UI on the web.
+40.0k☆
En 2017, Vue.js consiguió 40.0k estrellas, llegando a alcanzar el puesto #1 en Framework front-end en GitHub Tweet
3.0k
3.5k
3.9k
3.1k
3.2k
3.1k
3.6k
3.3k
3.6k
3.4k
3.1k
3.0k
E
F
M
A
M
J
J
A
S
O
N
D
2
React

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
+27.8k☆
En 2017, React consiguió 27.8k estrellas, llegando a alcanzar el puesto #2 en Framework front-end en GitHub Tweet
2.0k
2.0k
2.6k
2.3k
2.3k
2.0k
2.6k
2.2k
2.5k
2.8k
2.5k
2.2k
E
F
M
A
M
J
J
A
S
O
N
D
3
Angular

Angular

One framework. Mobile & desktop.
+12.2k☆
En 2017, Angular consiguió 12.2k estrellas, llegando a alcanzar el puesto #3 en Framework front-end en GitHub Tweet
827
949
1.4k
1.0k
884
911
983
989
925
1.1k
1.2k
930
E
F
M
A
M
J
J
A
S
O
N
D
4
Preact

Preact

⚛️ Fast 3kB React alternative with the same modern API. Components & Virtual DOM.
+10.4k☆
En 2017, Preact consiguió 10.4k estrellas, llegando a alcanzar el puesto #4 en Framework front-end en GitHub Tweet
779
498
575
634
829
920
729
2.0k
1.9k
545
401
532
E
F
M
A
M
J
J
A
S
O
N
D
5
Hyperapp

Hyperapp

1 KB JavaScript library for building web applications.
+8.1k☆
En 2017, Hyperapp consiguió 8.1k estrellas, llegando a alcanzar el puesto #5 en Framework front-end en GitHub Tweet
1.2k
779
148
113
2.1k
671
321
746
333
189
1.5k
E
F
M
A
M
J
J
A
S
O
N
D
6
dva

dva

🌱 React and redux based, lightweight and elm-style framework. (Inspired by elm and choo)
+5.3k☆
En 2017, dva consiguió 5.3k estrellas, llegando a alcanzar el puesto #6 en Framework front-end en GitHub Tweet
315
403
463
402
387
384
447
525
463
405
551
510
E
F
M
A
M
J
J
A
S
O
N
D
7
Inferno

Inferno

An extremely fast, React-like JavaScript library for building modern user interfaces
+4.6k☆
En 2017, Inferno consiguió 4.6k estrellas, llegando a alcanzar el puesto #7 en Framework front-end en GitHub Tweet
1.6k
396
375
237
276
193
239
364
500
151
149
116
E
F
M
A
M
J
J
A
S
O
N
D
8
Moon

Moon

🌙 ⚡️ A minimal, blazing fast UI library.
+3.7k☆
En 2017, Moon consiguió 3.7k estrellas, llegando a alcanzar el puesto #8 en Framework front-end en GitHub Tweet
20
356
226
403
1.9k
566
98
96
73
E
F
M
A
M
J
J
A
S
O
N
D
9
Angular 1

Angular 1

AngularJS - HTML enhanced for web apps!
+3.6k☆
En 2017, Angular 1 consiguió 3.6k estrellas, llegando a alcanzar el puesto #9 en Framework front-end en GitHub Tweet
381
388
392
277
365
347
323
317
270
217
203
130
E
F
M
A
M
J
J
A
S
O
N
D
10
Rax

Rax

A universal React-compatible render engine.
+2.6k☆
En 2017, Rax consiguió 2.6k estrellas, llegando a alcanzar el puesto #10 en Framework front-end en GitHub Tweet
1.1k
268
119
124
100
98
122
104
328
87
77
80
E
F
M
A
M
J
J
A
S
O
N
D

En la categoría "framework front-end", se ha librado una larga batalla que parece que se va apaciguando, con 3 importantes actores dominando el juego.

Los 3 grandes: Vue, React y Angular

No es ninguna sorpresa que los 3 frameworks destacados sean Vue.js, React y Angular.

Normalmente son llamados frameworks, sin embargo, para ser más exactos el único framework es Angular, Vue.js y React deberían ser llamados librerías.

Anteriormente hemos hablado sobre el éxito de Vue.js.

Por otro lado, el ecosistema de React continúa siendo mucho más fragmentado, dejando al desarrollador mayor libertad para crear una solución "a la carta", teniendo la necesidad de hacerse preguntas sobre:

  • Routing entre páginas.
  • Acceso a API remotas.
  • Cómo controlar el estado de la aplicación.

En cambio, el ecosistema de Angular está más controlado, más estable. Hay un Angular Way para trabajar.

Probablemente, es por esto que Angular tiene una imagen más "corporativa". Esta imagen ha sido acentuada con el uso de tipado estático con TypeScript, lo cual atrae la atención de desarrolladores back-end familiarizados con lenguajes como C# o Java.

Menos es más

Detrás de estos tres colosos, es interesante destacar que Preact ocupa el cuarto puesto. Preact es una alternativa más ligera a React: misma API, pero en menos de 3KB.

De la misma manera, otros aspirantes en esta categoría, se centran en reducir su peso al máximo para conseguir un mejor rendimiento en el navegador y así intentar diferenciarse de los 3 ganadores.

Un buen ejemplo de esta consigna es Hyperapp, un proyecto que ha sido muy popular durante las últimas semanas del año. Este mezcla un enfoque funcional, la sintaxis JSX de React y un control del estado de la aplicación inspirado en Redux... ¡en menos de 1KB!.

Frameworks Node.js

1
Express

Express

Fast, unopinionated, minimalist web framework for node.
+6.7k☆
En 2017, Express consiguió 6.7k estrellas, llegando a alcanzar el puesto #1 en Proyecto Node en GitHub Tweet
542
586
613
587
583
552
512
525
485
610
560
524
E
F
M
A
M
J
J
A
S
O
N
D
2
Koa

Koa

Expressive middleware for node.js using ES2017 async functions
+5.8k☆
En 2017, Koa consiguió 5.8k estrellas, llegando a alcanzar el puesto #2 en Proyecto Node en GitHub Tweet
422
510
609
486
479
489
421
517
465
441
481
460
E
F
M
A
M
J
J
A
S
O
N
D
3
Fastify

Fastify

Fast and low overhead web framework, for Node.js
+5.8k☆
En 2017, Fastify consiguió 5.8k estrellas, llegando a alcanzar el puesto #3 en Proyecto Node en GitHub Tweet
109
15
87
56
17
91
99
60
2.1k
2.2k
611
342
E
F
M
A
M
J
J
A
S
O
N
D
4
Gun

Gun

A realtime, decentralized, offline-first, graph database engine.
+3.2k☆
En 2017, Gun consiguió 3.2k estrellas, llegando a alcanzar el puesto #4 en Proyecto Node en GitHub Tweet
181
234
128
106
223
1.3k
162
183
87
128
198
184
E
F
M
A
M
J
J
A
S
O
N
D
5
micro

micro

Asynchronous HTTP microservices
+3.2k☆
En 2017, micro consiguió 3.2k estrellas, llegando a alcanzar el puesto #5 en Proyecto Node en GitHub Tweet
434
277
272
252
273
177
244
419
230
198
223
157
E
F
M
A
M
J
J
A
S
O
N
D
6
Keystone

Keystone

node.js cms and web app framework
+3.0k☆
En 2017, Keystone consiguió 3.0k estrellas, llegando a alcanzar el puesto #6 en Proyecto Node en GitHub Tweet
289
279
289
252
250
252
314
264
193
225
197
235
E
F
M
A
M
J
J
A
S
O
N
D
7
Nest

Nest

A progressive Node.js framework for building efficient and scalable server-side applications on top
+3.0k☆
En 2017, Nest consiguió 3.0k estrellas, llegando a alcanzar el puesto #7 en Proyecto Node en GitHub Tweet
296
120
61
165
391
667
429
385
E
F
M
A
M
J
J
A
S
O
N
D
8
Feathers

Feathers

A REST and realtime API layer for modern applications.
+3.0k☆
En 2017, Feathers consiguió 3.0k estrellas, llegando a alcanzar el puesto #8 en Proyecto Node en GitHub Tweet
305
273
280
257
293
258
250
234
190
232
226
165
E
F
M
A
M
J
J
A
S
O
N
D
9
Server.js

Server.js

Simple and powerful server for Node.js
+2.9k☆
En 2017, Server.js consiguió 2.9k estrellas, llegando a alcanzar el puesto #9 en Proyecto Node en GitHub Tweet
17
10
4
8
3
17
10
8
1
34
2.7k
131
E
F
M
A
M
J
J
A
S
O
N
D
10
Meteor

Meteor

Meteor, the JavaScript App Platform
+2.6k☆
En 2017, Meteor consiguió 2.6k estrellas, llegando a alcanzar el puesto #10 en Proyecto Node en GitHub Tweet
213
197
234
275
289
216
190
189
172
246
195
199
E
F
M
A
M
J
J
A
S
O
N
D

Como bien sabemos, JavaScript no está limitado a solo crear la parte front-end de nuestras aplicaciones web. Cada vez es más usado en el back-end y Mikeal Rogers, un influyente miembro de la comunidad node.js, predice que Node.js Will Overtake Java Within a Year ("Node.js alcanzará a Java en un año").

A diferencia de otros lenguajes que a lo largo de los años se han ido acogiendo a determinados estándares (Ruby on Rails para Ruby, Django para Python o Laravel para PHP), no hay una forma estándar o arquitectura recomendada cuando queremos crear un servidor node.js.

A pesar de su edad, Express no solo fue el framework node.js más popular en 2017, sino que además es usado como esqueleto de muchos otros frameworks o CMS, incluyendo Feathers, Keystone o Nest.

A la vista está que el enfoque minimalista de Express, encaja perfectamente con la tendencia de micro-servicios, que promueve la creación de pequeñas aplicaciones desacopladas en contraposición de una única aplicación monolítica.

Comparando con el año pasado, 3 recién llegados se han unido al TOP 10 de frameworks node.js:

  • Fastify, creado como un framework web de propósito general, inspirado en Hapi, es apropiado para construir veloces JSON HTTP APIs.
  • Server.js intenta ser una experiencia del tipo: todo funciona sin apenas configuración.
  • Nest implementa una arquitectura que resulta familiar entre los desarrolladores de Angular, hecha de módulos y controladores, escrito en TypeScript.

Ecosistema React

1
Create React App

Create React App

Create React apps with no build configuration.
+22.5k☆
En 2017, Create React App consiguió 22.5k estrellas, llegando a alcanzar el puesto #1 en Librería React en GitHub Tweet
2.1k
1.8k
2.3k
1.8k
2.2k
1.8k
1.9k
2.3k
1.5k
1.7k
1.7k
1.5k
E
F
M
A
M
J
J
A
S
O
N
D
2
Ant Design

Ant Design

🐜 A UI Design Language
+13.3k☆
En 2017, Ant Design consiguió 13.3k estrellas, llegando a alcanzar el puesto #2 en Librería React en GitHub Tweet
936
1.1k
971
910
928
941
1.1k
887
1.2k
1.3k
1.6k
E
F
M
A
M
J
J
A
S
O
N
D
3
Next.js

Next.js

Framework for server-rendered or statically-exported React apps
+12.7k☆
En 2017, Next.js consiguió 12.7k estrellas, llegando a alcanzar el puesto #3 en Librería React en GitHub Tweet
893
664
2.1k
1.3k
1.2k
745
1.2k
856
697
1.2k
864
960
E
F
M
A
M
J
J
A
S
O
N
D
4
Storybook

Storybook

Interactive UI component dev & test: React, React Native, Vue, Angular
+9.7k☆
En 2017, Storybook consiguió 9.7k estrellas, llegando a alcanzar el puesto #4 en Librería React en GitHub Tweet
467
429
666
627
807
940
704
1.0k
671
837
1.3k
1.2k
E
F
M
A
M
J
J
A
S
O
N
D
5
Gatsby

Gatsby

⚛️📄🚀 Blazing fast static site generator for React
+9.7k☆
En 2017, Gatsby consiguió 9.7k estrellas, llegando a alcanzar el puesto #5 en Librería React en GitHub Tweet
717
481
508
438
573
505
2.1k
664
698
1.1k
796
1.2k
E
F
M
A
M
J
J
A
S
O
N
D
6
Material UI

Material UI

React components that implement Google's Material Design.
+9.6k☆
En 2017, Material UI consiguió 9.6k estrellas, llegando a alcanzar el puesto #6 en Librería React en GitHub Tweet
641
749
833
842
816
757
883
796
701
848
864
918
E
F
M
A
M
J
J
A
S
O
N
D
7
React Navigation

React Navigation

Learn once, navigate anywhere
+8.8k☆
En 2017, React Navigation consiguió 8.8k estrellas, llegando a alcanzar el puesto #7 en Librería React en GitHub Tweet
1.6k
910
846
646
822
612
586
494
535
609
632
486
E
F
M
A
M
J
J
A
S
O
N
D
8
React Router

React Router

Declarative routing for React
+8.7k☆
En 2017, React Router consiguió 8.7k estrellas, llegando a alcanzar el puesto #8 en Librería React en GitHub Tweet
690
748
1.1k
747
762
647
710
725
572
662
673
666
E
F
M
A
M
J
J
A
S
O
N
D
9
Create React Native App

Create React Native App

Create a React Native app on any OS with no build config.
+7.7k☆
En 2017, Create React Native App consiguió 7.7k estrellas, llegando a alcanzar el puesto #9 en Librería React en GitHub Tweet
56
34
3.4k
637
498
493
476
478
393
438
403
363
E
F
M
A
M
J
J
A
S
O
N
D
10
Ant Design Pro

Ant Design Pro

👨🏻‍💻👩🏻‍💻 An out-of-box UI solution for enterprise applications
+5.7k☆
En 2017, Ant Design Pro consiguió 5.7k estrellas, llegando a alcanzar el puesto #10 en Librería React en GitHub Tweet
2.9k
1.1k
E
F
M
A
M
J
J
A
S
O
N
D
11
React boilerplate

React boilerplate

A highly scalable, offline-first foundation with the best developer experience and a focus on
+5.3k☆
En 2017, React boilerplate consiguió 5.3k estrellas, llegando a alcanzar el puesto #11 en Librería React en GitHub Tweet
721
607
557
503
413
380
401
351
330
391
343
338
E
F
M
A
M
J
J
A
S
O
N
D
12
Recompose

Recompose

A React utility belt for function components and higher-order components.
+5.0k☆
En 2017, Recompose consiguió 5.0k estrellas, llegando a alcanzar el puesto #12 en Librería React en GitHub Tweet
301
282
439
426
597
467
437
481
437
396
393
379
E
F
M
A
M
J
J
A
S
O
N
D
13
react-loadable

react-loadable

A higher order component for loading components with promises.
+4.9k☆
En 2017, react-loadable consiguió 4.9k estrellas, llegando a alcanzar el puesto #13 en Librería React en GitHub Tweet
499
262
212
377
307
285
178
553
511
471
E
F
M
A
M
J
J
A
S
O
N
D
14
NativeBase

NativeBase

Essential cross-platform UI components for React Native
+4.4k☆
En 2017, NativeBase consiguió 4.4k estrellas, llegando a alcanzar el puesto #14 en Librería React en GitHub Tweet
315
546
433
414
403
381
344
335
322
272
311
326
E
F
M
A
M
J
J
A
S
O
N
D
15
Enzyme

Enzyme

JavaScript Testing utilities for React
+4.4k☆
En 2017, Enzyme consiguió 4.4k estrellas, llegando a alcanzar el puesto #15 en Librería React en GitHub Tweet
322
362
369
399
342
325
341
344
380
411
408
382
E
F
M
A
M
J
J
A
S
O
N
D

React, siendo una librería dedicada a la parte visual de la aplicación, abre camino a un completo ecosistema que está creciendo muy rápido.

En 2016, Create React App mitigó la dificultad inicial de crear una aplicación React, proporcionando una serie de preajustes, permitiendo al desarrollador centrarse en el código y no en configuraciones. Facebook publica nuevas versiones frecuentemente, Create React App ha sido el proyecto más popular con diferencia dentro del ecosistema de React en 2017.

Como ejemplo de su éxito, podemos mencionar StackBlitz, un IDE online que permite ejecutar aplicaciones creadas con Create React App directamente en el navegador en solo unos segundos.

Pero aunque Create React App es normalmente considerado el "starter kit" por excelencia para React, puede que nuestras necesidades requieran funcionalidades más específicas preconfiguradas, en este escenario tenemos a React boilerplate, uno de los proyectos más populares en esta categoría, proporcionando funcionalidades como integración con GraphQL.

Ant Design, Ant Design Pro y Material UI proporcionan un conjunto de componentes React con estilo predeterminado, ayudando a crear aplicaciones web React sin centrarnos en el estilo.

En el puesto número 10 encontramos a Recompose, su popularidad es resultado de la pasión de muchos desarrolladores por el enfoque "funcional" de React, esta librería proporciona un conjunto de herramientas para ir en esta dirección, como dicen en su web: "Think of it like lodash for React" ("consideralo el lodash para React").

Ecosistema Vue

1
Element

Element

A Vue.js 2.0 UI Toolkit for Web
+14.9k☆
En 2017, Element consiguió 14.9k estrellas, llegando a alcanzar el puesto #1 en Librería Vue en GitHub Tweet
1.4k
1.2k
1.8k
1.2k
1.1k
1.0k
1.1k
1.1k
1.3k
1.4k
1.3k
1.1k
E
F
M
A
M
J
J
A
S
O
N
D
2
iView

iView

A high quality UI Toolkit built on Vue.js 2.0
+9.5k☆
En 2017, iView consiguió 9.5k estrellas, llegando a alcanzar el puesto #2 en Librería Vue en GitHub Tweet
351
613
485
566
929
626
576
1.3k
788
585
E
F
M
A
M
J
J
A
S
O
N
D
3
Vuex

Vuex

🗃️ Centralized State Management for Vue.js.
+7.2k☆
En 2017, Vuex consiguió 7.2k estrellas, llegando a alcanzar el puesto #3 en Librería Vue en GitHub Tweet
547
597
713
632
588
579
553
582
600
569
638
555
E
F
M
A
M
J
J
A
S
O
N
D
4
Weex

Weex

A framework for building Mobile cross-platform UI.
+6.5k☆
En 2017, Weex consiguió 6.5k estrellas, llegando a alcanzar el puesto #4 en Librería Vue en GitHub Tweet
26
116
1.4k
839
764
668
550
563
608
538
456
E
F
M
A
M
J
J
A
S
O
N
D
5
Nuxt

Nuxt

Versatile Vue.js Framework
+6.3k☆
En 2017, Nuxt consiguió 6.3k estrellas, llegando a alcanzar el puesto #5 en Librería Vue en GitHub Tweet
164
354
625
515
537
481
592
732
532
606
635
498
E
F
M
A
M
J
J
A
S
O
N
D
6
Vuetify

Vuetify

Material Component Framework for Vue.js 2
+6.3k☆
En 2017, Vuetify consiguió 6.3k estrellas, llegando a alcanzar el puesto #6 en Librería Vue en GitHub Tweet
322
191
363
385
402
360
569
554
1.1k
777
615
585
E
F
M
A
M
J
J
A
S
O
N
D
7
Mint UI

Mint UI

Mobile UI elements for Vue.js
+5.5k☆
En 2017, Mint UI consiguió 5.5k estrellas, llegando a alcanzar el puesto #7 en Librería Vue en GitHub Tweet
116
E
F
M
A
M
J
J
A
S
O
N
D
8
vux

vux

Mobile UI Components based on Vue & WeUI
+4.6k☆
En 2017, vux consiguió 4.6k estrellas, llegando a alcanzar el puesto #8 en Librería Vue en GitHub Tweet
306
382
510
392
361
383
394
399
373
311
409
426
E
F
M
A
M
J
J
A
S
O
N
D
9
vue-router

vue-router

🚦 The official router for Vue.js.
+4.6k☆
En 2017, vue-router consiguió 4.6k estrellas, llegando a alcanzar el puesto #9 en Librería Vue en GitHub Tweet
408
400
460
411
396
407
370
352
374
403
351
313
E
F
M
A
M
J
J
A
S
O
N
D
10
Vue material

Vue material

Material design for Vue.js
+3.7k☆
En 2017, Vue material consiguió 3.7k estrellas, llegando a alcanzar el puesto #10 en Librería Vue en GitHub Tweet
328
405
449
320
307
304
303
293
251
273
245
234
E
F
M
A
M
J
J
A
S
O
N
D

Invitado especial: Evan You

Por mucho que admiremos a Vue.js, debemos admitir que no estamos muy familiarizados con su ecosistema.

Por esta razón, buscamos a un experto para que nos diera su opinión sobre las estadísticas de este año ¿y quién mejor que el propio creador de Vue.js?

Con la creciente popularidad de Vue, muchos de los proyectos que componen su ecosistema han experimentado un rápido crecimiento también en 2017.

Element y iView son los dos kits de componentes más populares, ambos centrados en agilizar el desarrollo de UI de escritorio. Por otro lado Mint UI y vux son los más famosos en UI móvil.

Vuetify es un framework que provee componentes Material Design tanto para aplicaciones web móvil como de escritorio y es probablemente el más rico en funcionalidades para server-side rendering, con soporte para plantillas PWA y CLI. También tenemos Vue material que se centra en proporcionar un conjunto de componentes que se adhieren a la especificación Material Design.

Nuxt es un framework construido sobre Vue que facilita la creación de aplicaciones con server-rendering. Además es muy versátil, permitiendo reusar el mismo código tanto para crear una SPA como para un sitio estático.

Weex es un framework que permite al usuario crear aplicaciones móviles nativas, usando sintaxis y API similares a la de Vue. Ha sido desarrollado por Alibaba y usado en producción en algunas de las aplicaciones móviles con más tráfico a nivel mundial, poniendo mucha atención en el rendimiento.

Móvil

1
React Native

React Native

A framework for building native apps with React.
+15.6k☆
En 2017, React Native consiguió 15.6k estrellas, llegando a alcanzar el puesto #1 en Framework móvil en GitHub Tweet
1.2k
1.3k
1.6k
1.3k
1.3k
1.3k
1.3k
1.2k
1.1k
1.2k
1.3k
1.2k
E
F
M
A
M
J
J
A
S
O
N
D
2
Weex

Weex

A framework for building Mobile cross-platform UI.
+6.5k☆
En 2017, Weex consiguió 6.5k estrellas, llegando a alcanzar el puesto #2 en Framework móvil en GitHub Tweet
26
116
1.4k
839
764
668
550
563
608
538
456
E
F
M
A
M
J
J
A
S
O
N
D
3
Ionic

Ionic

Build amazing native and progressive web apps with open web technologies. One app running on everyth
+5.5k☆
En 2017, Ionic consiguió 5.5k estrellas, llegando a alcanzar el puesto #3 en Framework móvil en GitHub Tweet
500
443
515
530
509
437
439
419
421
465
510
311
E
F
M
A
M
J
J
A
S
O
N
D
4
Quasar

Quasar

Quasar Framework
+3.7k☆
En 2017, Quasar consiguió 3.7k estrellas, llegando a alcanzar el puesto #4 en Framework móvil en GitHub Tweet
17
297
341
244
314
266
298
397
360
343
301
331
E
F
M
A
M
J
J
A
S
O
N
D
5
NativeScript

NativeScript

NativeScript is an open source framework for building truly native mobile apps with JavaScript. Use
+2.9k☆
En 2017, NativeScript consiguió 2.9k estrellas, llegando a alcanzar el puesto #5 en Framework móvil en GitHub Tweet
241
224
245
238
255
224
217
211
299
280
271
233
E
F
M
A
M
J
J
A
S
O
N
D

La versatilidad de JavaScript nos permite además crear aplicaciones móviles, pudiendo compartir componentes creados para la web con sistemas nativos móviles.

Dentro de esta categoría encontramos de nuevo a los 3 principales actores de los "frameworks front-end":

Al igual que en 2016, React Native es la solución más popular, basada en JavaScript, nos permite construir aplicaciones para plataformas iOS, Android y Windows.

Como se resalta en este vídeo Cross platform apps with React Native, la promesa: "Write Once, Run Everywhere" ¡se hace realidad!

Compiladores JS

1
TypeScript

TypeScript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
+11.6k☆
En 2017, TypeScript consiguió 11.6k estrellas, llegando a alcanzar el puesto #1 en Compilador JavaScript en GitHub Tweet
738
855
972
1.1k
928
936
976
1.0k
818
1.2k
1.1k
992
E
F
M
A
M
J
J
A
S
O
N
D
2
Babel

Babel

Babel is a compiler for writing next generation JavaScript.
+5.7k☆
En 2017, Babel consiguió 5.7k estrellas, llegando a alcanzar el puesto #2 en Compilador JavaScript en GitHub Tweet
390
382
447
395
361
336
371
412
397
564
1.1k
587
E
F
M
A
M
J
J
A
S
O
N
D
3
Flow

Flow

Adds static typing to JavaScript to improve developer productivity and code quality.
+5.1k☆
En 2017, Flow consiguió 5.1k estrellas, llegando a alcanzar el puesto #3 en Compilador JavaScript en GitHub Tweet
335
303
505
577
484
447
381
420
372
433
392
417
E
F
M
A
M
J
J
A
S
O
N
D
4
Reason

Reason

Simple, fast & type safe code that leverages the JavaScript & OCaml ecosystems
+2.1k☆
En 2017, Reason consiguió 2.1k estrellas, llegando a alcanzar el puesto #4 en Compilador JavaScript en GitHub Tweet
186
79
186
143
115
85
72
151
284
266
201
395
E
F
M
A
M
J
J
A
S
O
N
D
5
Purescript

Purescript

A strongly-typed language that compiles to Javascript
+1.2k☆
En 2017, Purescript consiguió 1.2k estrellas, llegando a alcanzar el puesto #5 en Compilador JavaScript en GitHub Tweet
123
77
96
101
63
96
92
106
99
121
123
108
E
F
M
A
M
J
J
A
S
O
N
D
6
ClojureScript

ClojureScript

Clojure to JS compiler
+1.0k☆
En 2017, ClojureScript consiguió 1.0k estrellas, llegando a alcanzar el puesto #6 en Compilador JavaScript en GitHub Tweet
73
59
83
75
54
72
81
70
59
56
54
46
E
F
M
A
M
J
J
A
S
O
N
D
7
CoffeeScript

CoffeeScript

Unfancy JavaScript
+896☆
En 2017, CoffeeScript consiguió 896 estrellas, llegando a alcanzar el puesto #7 en Compilador JavaScript en GitHub Tweet
77
78
63
98
71
62
70
70
118
96
56
37
E
F
M
A
M
J
J
A
S
O
N
D
8
Elm

Elm

Compiler for Elm, a functional language for reliable webapps.
+880☆
En 2017, Elm consiguió 880 estrellas, llegando a alcanzar el puesto #8 en Compilador JavaScript en GitHub Tweet
71
51
82
53
62
56
51
50
55
63
55
61
E
F
M
A
M
J
J
A
S
O
N
D

Aquí hablaremos sobre lenguajes que compilan código JavaScript.

Puede que necesites un compilador en tu proceso de build por dos razones:

  • Si quieres utilizar todas las funcionalidades de la última versión de JavaScript (ES7), manteniendo tu código compatible con la máxima variedad de navegadores. Esto ha ayudado al éxito de Babel, del que dependen muchos proyectos.
  • Si deseas incluir nuevas funcionalidades al lenguaje como "type checking".

Una de las cuestiones más populares que suele dividir a desarrolladores es: ¿tipado o no tipado?

JavaScript tiene tipado dinámico pero no estático. Muchos desarrolladores prefieren el fuerte tipado en su código, especialmente en proyectos grandes, para hacerlo más robusto y fácil de leer/entender.

Así que, si eres de los que necesita tipado, los 2 principales contendientes son: TypeScript de Microsoft y Flow de Facebook (usado en sus principales proyectos: React, React Native, Jest...).

Echa un vistazo a este artículo de James Kyle para conocer sus diferencias: A Comparison Between Adopting Flow or TypeScript.

Build

1
Parcel

Parcel

📦🚀 Blazing fast, zero configuration web application bundler
+14.0k☆
En 2017, Parcel consiguió 14.0k estrellas, llegando a alcanzar el puesto #1 en Build en GitHub Tweet
1
1
13.9k
E
F
M
A
M
J
J
A
S
O
N
D
2
Webpack

Webpack

A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting a
+13.1k☆
En 2017, Webpack consiguió 13.1k estrellas, llegando a alcanzar el puesto #2 en Build en GitHub Tweet
1.4k
1.2k
1.2k
1.1k
1.1k
1.2k
1.1k
995
714
1.0k
1.0k
1.0k
E
F
M
A
M
J
J
A
S
O
N
D
3
Gulp

Gulp

The streaming build system
+3.6k☆
En 2017, Gulp consiguió 3.6k estrellas, llegando a alcanzar el puesto #3 en Build en GitHub Tweet
344
313
376
391
303
254
291
302
237
286
270
228
E
F
M
A
M
J
J
A
S
O
N
D
4
Rollup

Rollup

Next-generation ES6 module bundler
+3.5k☆
En 2017, Rollup consiguió 3.5k estrellas, llegando a alcanzar el puesto #4 en Build en GitHub Tweet
338
267
270
498
288
289
254
260
200
203
297
362
E
F
M
A
M
J
J
A
S
O
N
D
5
Poi

Poi

Delightful web development.
+2.7k☆
En 2017, Poi consiguió 2.7k estrellas, llegando a alcanzar el puesto #5 en Build en GitHub Tweet
127
132
94
129
82
78
54
165
178
200
1.3k
E
F
M
A
M
J
J
A
S
O
N
D
6
FuseBox

FuseBox

A blazing fast js bundler/loader with a comprehensive API
+2.5k☆
En 2017, FuseBox consiguió 2.5k estrellas, llegando a alcanzar el puesto #6 en Build en GitHub Tweet
109
1.3k
185
76
107
276
81
92
94
100
60
75
E
F
M
A
M
J
J
A
S
O
N
D
7
Browserify

Browserify

browser-side require() the node.js way
+1.1k☆
En 2017, Browserify consiguió 1.1k estrellas, llegando a alcanzar el puesto #7 en Build en GitHub Tweet
101
90
81
103
94
77
72
82
76
89
94
92
E
F
M
A
M
J
J
A
S
O
N
D

Es probablemente una de las mayores sorpresas del año, la herramienta de building más popular es Parcel, un nuevo proyecto que ha reunido 14.000 estrellas desde que fue lanzado en GitHub el pasado agosto.

Parcel ofrece todo tipo de herramientas para el desarrollo web actual y una característica clave: ¡configuración cero!

Esta es la mayor diferencia con Webpack, que depende de todo un ecosistema de plugins llamados "loaders".

Pero no malinterpretemos los números, Webpack continúa siento el bundler más popular para aplicaciones modernas, con un total de 35.000 estrellas en GitHub y más de 500 colaboradores.

Muchos proyectos lo usan por debajo, incluyendo Create React App y Gatsby, 2 de los proyectos más populares del año.

Webpack continúa evolucionando, la versión 2 permite implementar fácilmente funcionalidades tales como "code splitting", mediante imports dinámicos.

Mientras Webpack y Parcel se centran en el proceso de build de aplicaciones web, Rollup lo hace en librerías, enfocándose en el rendimiento y aprovechándose de los módulos ES6.

Rollup es usado en librerías muy importantes, merece la pena mencionar que el equipo de React ha migrado su sistema de build de Browserify a Rollup en 2017.

Desde el blog de React

Rollup is a perfect fit for libraries like React that can be pre-built and then integrated into apps.

Poi tiene la misma meta que Parcel: una herramienta para el build de aplicaciones web modernas, pero su alcance está limitado a proyectos de React, Preact y Vue.js.

Testing

1
Jest

Jest

🃏 Delightful JavaScript Testing.
+7.1k☆
En 2017, Jest consiguió 7.1k estrellas, llegando a alcanzar el puesto #1 en Testing en GitHub Tweet
498
519
647
549
884
499
549
476
473
705
664
675
E
F
M
A
M
J
J
A
S
O
N
D
2
AVA

AVA

Futuristic JavaScript test runner
+4.8k☆
En 2017, AVA consiguió 4.8k estrellas, llegando a alcanzar el puesto #2 en Testing en GitHub Tweet
1.0k
522
452
377
358
304
315
303
260
321
294
245
E
F
M
A
M
J
J
A
S
O
N
D
3
Mocha

Mocha

☕️ simple, flexible, fun javascript test framework for node.js & the browser
+3.1k☆
En 2017, Mocha consiguió 3.1k estrellas, llegando a alcanzar el puesto #3 en Testing en GitHub Tweet
242
253
266
244
251
230
231
259
238
269
295
287
E
F
M
A
M
J
J
A
S
O
N
D
4
Jasmine

Jasmine

Simple JavaScript testing framework for browsers and node.js
+1.2k☆
En 2017, Jasmine consiguió 1.2k estrellas, llegando a alcanzar el puesto #4 en Testing en GitHub Tweet
93
95
128
97
106
94
96
120
88
76
109
83
E
F
M
A
M
J
J
A
S
O
N
D
5
Tape

Tape

tap-producing test harness for node and browsers
+1.0k☆
En 2017, Tape consiguió 1.0k estrellas, llegando a alcanzar el puesto #5 en Testing en GitHub Tweet
149
90
135
105
91
63
65
70
79
54
57
51
E
F
M
A
M
J
J
A
S
O
N
D

Como predijimos el año pasado (¡la primera vez que predecimos algo que se cumple!), Jest se ha convertido en el framework más popular del 2017.

Inicialmente fue diseñado por Facebook con el fin de crear tests para React, pero su evolución ha sido tal durante los últimos meses (¡ya van por la versión 22!) que actualmente puede ser usado para hacer tests tanto en el front-end como en el back-end.

Jest destaca en los siguiente puntos:

  • No requiere configuración inicial, normalmente los valores por defecto se ajustan a las necesidades más comunes.
  • Buena experiencia desde el punto de vista del desarrollador (detección avanzada de cambios en los ficheros, buen reporte de errores...).
  • Sintaxis similar a la de Mocha, es una ventaja ya que muchos desarrolladores ya están familiarizados con describe o it por ejemplo.
  • No necesita de ninguna otra librería, contiene todo lo necesario para realizar tus tests.
  • Implementa un modo "snapshot" que registra automáticamente la respuesta esperada para futuros tests.

AVA, el número 1 del año pasado, continúa siendo muy popular. Creado por Sindre Sorhus y usado por él mismo en todos sus extraordinarios proyectos.

Comparándolo con Jest, este se centra en la velocidad con la que se ejecutan los tests (haciéndolo en paralelo). Es más ligero y cercano a los estándares, con una sintaxis semejante a la de frameworks como Tape.

Editores

1
VS Code

VS Code

Visual Studio Code
+20.2k☆
En 2017, VS Code consiguió 20.2k estrellas, llegando a alcanzar el puesto #1 en Editor en GitHub Tweet
897
1.4k
1.8k
1.7k
1.5k
1.3k
1.4k
1.6k
1.6k
2.5k
2.6k
1.8k
E
F
M
A
M
J
J
A
S
O
N
D
2
Atom

Atom

The hackable text editor
+9.1k☆
En 2017, Atom consiguió 9.1k estrellas, llegando a alcanzar el puesto #2 en Editor en GitHub Tweet
838
766
764
604
798
695
774
871
921
763
724
557
E
F
M
A
M
J
J
A
S
O
N
D
3
Reactide

Reactide

Reactide is the first dedicated IDE for React web application development. http://reactide.io
+7.4k☆
En 2017, Reactide consiguió 7.4k estrellas, llegando a alcanzar el puesto #3 en Editor en GitHub Tweet
2.2k
181
109
66
76
34
71
38
73
E
F
M
A
M
J
J
A
S
O
N
D
4
Brackets

Brackets

An open source code editor for the web, written in JavaScript, HTML and CSS.
+1.9k☆
En 2017, Brackets consiguió 1.9k estrellas, llegando a alcanzar el puesto #4 en Editor en GitHub Tweet
138
164
233
142
172
126
189
161
192
142
112
106
E
F
M
A
M
J
J
A
S
O
N
D
5
Nuclide

Nuclide

An open IDE for web and native mobile development, built on top of Atom
+1.4k☆
En 2017, Nuclide consiguió 1.4k estrellas, llegando a alcanzar el puesto #5 en Editor en GitHub Tweet
152
167
154
152
145
101
127
75
123
68
82
76
E
F
M
A
M
J
J
A
S
O
N
D

Aquí hablaremos de editores de texto pertenecientes al mundo del open source y creados con tecnologías web (¡lo sentimos por los usuarios de Sublime!).

En 2016, VS Code y Atom respaldados respectivamente por Microsoft y GitHub estuvieron realmente cerca en la cima de esta categoría.

Ambos continúan liderando en 2017, sin embargo, VS Code ha tomado la delantera sobre su rival.

Cada mes, una nueva versión de VS Code es publicada, incluyendo nuevas funcionalidades y cuidando el impacto en el rendimiento.

Por defecto, sin necesidad de instalar nada adicionalmente, contiene un gran repertorio de herramientas:

  • Integración con Git
  • Funciones de autocompletado: Sintaxis JavaScript, rutas de ficheros al usar require o import, nombre de paquetes NPM...
  • Sintaxis de React

Y si además añadimos Prettier a la fórmula, invitando al editor a formatear nuestros ficheros cada vez que guardemos, tendremos la perfecta combinación para disfrutar del ¡máximo confort!

CSS en JavaScript

1
Styled Components

Styled Components

Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without
+8.7k☆
En 2017, Styled Components consiguió 8.7k estrellas, llegando a alcanzar el puesto #1 en Librería CSS-en-JS en GitHub Tweet
852
545
899
861
874
744
703
697
625
677
555
703
E
F
M
A
M
J
J
A
S
O
N
D
2
CSS Modules

CSS Modules

Documentation about css-modules
+2.9k☆
En 2017, CSS Modules consiguió 2.9k estrellas, llegando a alcanzar el puesto #2 en Librería CSS-en-JS en GitHub Tweet
234
227
272
234
313
307
246
254
194
210
234
217
E
F
M
A
M
J
J
A
S
O
N
D
3
Polished

Polished

A lightweight toolset for writing styles in JavaScript ✨
+2.9k☆
En 2017, Polished consiguió 2.9k estrellas, llegando a alcanzar el puesto #3 en Librería CSS-en-JS en GitHub Tweet
518
262
210
139
96
94
129
96
103
E
F
M
A
M
J
J
A
S
O
N
D
4
Glamorous

Glamorous

💄 Maintainable CSS with React
+2.9k☆
En 2017, Glamorous consiguió 2.9k estrellas, llegando a alcanzar el puesto #4 en Librería CSS-en-JS en GitHub Tweet
531
273
206
196
292
139
151
120
165
E
F
M
A
M
J
J
A
S
O
N
D
5
Emotion

Emotion

⚡️ The Next Generation of CSS-in-JS
+2.5k☆
En 2017, Emotion consiguió 2.5k estrellas, llegando a alcanzar el puesto #5 en Librería CSS-en-JS en GitHub Tweet
488
257
190
352
186
298
E
F
M
A
M
J
J
A
S
O
N
D
6
Styled JSX

Styled JSX

Full CSS support for JSX without compromises
+1.7k☆
En 2017, Styled JSX consiguió 1.7k estrellas, llegando a alcanzar el puesto #6 en Librería CSS-en-JS en GitHub Tweet
125
133
216
138
163
105
123
76
92
231
135
129
E
F
M
A
M
J
J
A
S
O
N
D
7
Aphrodite

Aphrodite

Framework-agnostic CSS-in-JS with support for server-side rendering, browser prefixing, and minimum
+1.5k☆
En 2017, Aphrodite consiguió 1.5k estrellas, llegando a alcanzar el puesto #7 en Librería CSS-en-JS en GitHub Tweet
167
117
161
194
172
135
101
99
91
85
62
91
E
F
M
A
M
J
J
A
S
O
N
D
8
Glamor

Glamor

inline css for react et al
+1.3k☆
En 2017, Glamor consiguió 1.3k estrellas, llegando a alcanzar el puesto #8 en Librería CSS-en-JS en GitHub Tweet
208
92
100
140
192
92
122
98
56
75
69
69
E
F
M
A
M
J
J
A
S
O
N
D
9
JSS

JSS

JSS is an authoring tool for CSS which uses JavaScript as a host language.
+1.3k☆
En 2017, JSS consiguió 1.3k estrellas, llegando a alcanzar el puesto #9 en Librería CSS-en-JS en GitHub Tweet
94
107
107
94
101
107
115
94
89
120
142
126
E
F
M
A
M
J
J
A
S
O
N
D
10
Radium

Radium

A toolchain for React component styling.
+1.2k☆
En 2017, Radium consiguió 1.2k estrellas, llegando a alcanzar el puesto #10 en Librería CSS-en-JS en GitHub Tweet
144
120
112
126
99
92
89
88
68
81
106
68
E
F
M
A
M
J
J
A
S
O
N
D

No hay consenso sobre cuál es la mejor manera para dar estilo a nuestros componentes de React.

Puedes disponer de componentes predefinidos usando Material UI o Ant Design si no necesitas mucha personalización.

Si quieres tener mayor flexibilidad, puedes hacerlo a la vieja usanza, usando estilos CSS globales con Bootstrap or Bulma y asignando className a tus componentes, pero de este modo no estarán completamente encapsulados, teniendo el estilo controlado externamente.

Para abordar esta cuestión, ha aparecido el concepto "CSS dentro de JavaScript".

La idea es sencilla: con React manejamos tanto la lógica como la plantilla del componente usando JavaScript. ¿Por qué no ir un poco más allá y encapsular los estilos dentro de nuestros componentes usando JavaScript?

Styled Components ha sido de lejos el proyecto más popular del año en esta categoría. Permite incluir CSS dentro de nuestros componentes React usando tagged template literals, una funcionalidad añadida recientemente a JavaScript.

CSS Modules, número 2 en esta categoría, adopta un enfoque híbrido. Permite a los desarrolladores escribir en una gama de lenguajes a su elección (CSS, Sass, Less, Stylus), usando ficheros ubicados junto a los componentes relacionados e importados en estos.

Mark Dalgleish, uno de los autores de CSS Modules, escribió uno de los artículos más interesantes sobre el enfoque "CSS-en-JavaScript": A Unified Styling Language. El artículo es muy recomendable para gente que se siente un poco escéptica en relación a esta nueva técnica.

SSG

1
Gatsby

Gatsby

⚛️📄🚀 Blazing fast static site generator for React
+9.7k☆
En 2017, Gatsby consiguió 9.7k estrellas, llegando a alcanzar el puesto #1 en SSG en GitHub Tweet
717
481
508
438
573
505
2.1k
664
698
1.1k
796
1.2k
E
F
M
A
M
J
J
A
S
O
N
D
2
Hexo

Hexo

A fast, simple & powerful blog framework, powered by Node.js.
+6.2k☆
En 2017, Hexo consiguió 6.2k estrellas, llegando a alcanzar el puesto #2 en SSG en GitHub Tweet
664
519
609
487
469
431
494
537
471
509
476
486
E
F
M
A
M
J
J
A
S
O
N
D
3
React Static

React Static

⚛️ 🚀 A progressive static-site generator for React.
+3.0k☆
En 2017, React Static consiguió 3.0k estrellas, llegando a alcanzar el puesto #3 en SSG en GitHub Tweet
2.2k
341
338
E
F
M
A
M
J
J
A
S
O
N
D
4
Phenomic

Phenomic

Modular website compiler ⚡️
+1.4k☆
En 2017, Phenomic consiguió 1.4k estrellas, llegando a alcanzar el puesto #4 en SSG en GitHub Tweet
140
392
123
103
127
125
92
59
50
77
42
67
E
F
M
A
M
J
J
A
S
O
N
D
5
Metalsmith

Metalsmith

An extremely simple, pluggable static site generator.
+1.0k☆
En 2017, Metalsmith consiguió 1.0k estrellas, llegando a alcanzar el puesto #5 en SSG en GitHub Tweet
107
90
72
85
82
72
136
73
81
72
80
61
E
F
M
A
M
J
J
A
S
O
N
D

Los generadores de páginas estáticas, también conocidos como "SSG" (Static site generators), son herramientas que generan ficheros .html, .css y JavaScript preparados para ser desplegados en cualquier servidor web sin preocuparse de configurar una base de datos. La páginas estáticas son rápidas, robustas y fáciles de mantener.

Ocupando el segundo puesto en 2016, Gatsby lidera la lista en 2017 con nuevas funcionalidades para optimizar tu web estática.

Gatsby usa React en su UI y GraphQL para recopilar su contenido en tiempo de compilación.

Es respaldado por una gran comunidad e incluso la propia página oficial de React ha sido creada con Gatsby.

React Static es un recién llegado en esta categoría, que pretende ser una alternativa más ligera a Gatsby, centrándose en rendimiento y simplicidad, inspirado por Create React App.

Merece la pena mencionar que tanto Next.js como Nuxt también pueden ser usados como SSG.

GraphQL

1
Gatsby

Gatsby

⚛️📄🚀 Blazing fast static site generator for React
+9.7k☆
En 2017, Gatsby consiguió 9.7k estrellas, llegando a alcanzar el puesto #1 en Proyecto GraphQL JavaScript en GitHub Tweet
717
481
508
438
573
505
2.1k
664
698
1.1k
796
1.2k
E
F
M
A
M
J
J
A
S
O
N
D
2
React Starter Kit

React Starter Kit

React Starter Kit — isomorphic web app boilerplate (Node.js, Express, GraphQL, React.js, Babel, Post
+4.3k☆
En 2017, React Starter Kit consiguió 4.3k estrellas, llegando a alcanzar el puesto #2 en Proyecto GraphQL JavaScript en GitHub Tweet
414
371
363
417
449
358
350
367
308
347
313
258
E
F
M
A
M
J
J
A
S
O
N
D
3
Apollo client

Apollo client

A fully-featured, production ready caching GraphQL client for every UI framework and GraphQ
+4.1k☆
En 2017, Apollo client consiguió 4.1k estrellas, llegando a alcanzar el puesto #3 en Proyecto GraphQL JavaScript en GitHub Tweet
64
338
348
285
295
327
295
331
414
438
393
E
F
M
A
M
J
J
A
S
O
N
D
4
GraphQL

GraphQL

GraphQL is a query language and execution engine tied to any backend service.
+2.8k☆
En 2017, GraphQL consiguió 2.8k estrellas, llegando a alcanzar el puesto #4 en Proyecto GraphQL JavaScript en GitHub Tweet
127
165
266
250
323
250
220
210
250
244
212
276
E
F
M
A
M
J
J
A
S
O
N
D
5
GraphiQL

GraphiQL

An in-browser IDE for exploring GraphQL.
+2.6k☆
En 2017, GraphiQL consiguió 2.6k estrellas, llegando a alcanzar el puesto #5 en Proyecto GraphQL JavaScript en GitHub Tweet
213
222
242
E
F
M
A
M
J
J
A
S
O
N
D
6
Relay

Relay

Relay is a JavaScript framework for building data-driven React applications.
+2.5k☆
En 2017, Relay consiguió 2.5k estrellas, llegando a alcanzar el puesto #6 en Proyecto GraphQL JavaScript en GitHub Tweet
157
128
193
541
201
191
212
181
161
171
148
206
E
F
M
A
M
J
J
A
S
O
N
D
7
Apollo Server

Apollo Server

GraphQL server for Express, Connect, Hapi, Koa and more
+2.3k☆
En 2017, Apollo Server consiguió 2.3k estrellas, llegando a alcanzar el puesto #7 en Proyecto GraphQL JavaScript en GitHub Tweet
301
199
179
208
187
211
E
F
M
A
M
J
J
A
S
O
N
D
8
Graphcool

Graphcool

⚡️ Prisma turns your database into a realtime GraphQL API
+1.7k☆
En 2017, Graphcool consiguió 1.7k estrellas, llegando a alcanzar el puesto #8 en Proyecto GraphQL JavaScript en GitHub Tweet
241
939
477
E
F
M
A
M
J
J
A
S
O
N
D
9
Vulcan

Vulcan

🌋 A toolkit to quickly build apps with React, GraphQL & Meteor
+1.4k☆
En 2017, Vulcan consiguió 1.4k estrellas, llegando a alcanzar el puesto #9 en Proyecto GraphQL JavaScript en GitHub Tweet
127
65
109
140
138
153
149
140
91
79
88
79
E
F
M
A
M
J
J
A
S
O
N
D
10
GraphQL Playground

GraphQL Playground

🎮 GraphQL IDE for better development workflows (GraphQL Subscriptions, interactive docs & collabor
+1.3k☆
En 2017, GraphQL Playground consiguió 1.3k estrellas, llegando a alcanzar el puesto #10 en Proyecto GraphQL JavaScript en GitHub Tweet
172
134
109
E
F
M
A
M
J
J
A
S
O
N
D

Cuando futuros historiadores estudien la trayectoria de GraphQL, probablemente 2017 será un punto de inflexión.

Empresas de la talla de The New York Times han empezado a usar GraphQL, y tanto Relay como Apollo (las principales librerías cliente para GraphQL) han lanzado importantes actualizaciones este año.

Más allá de estos dos importantes proyectos, empresas como Graphcool han sacado una amplia gama de herramientas y librerías. Frameworks vitaminados por GraphQL, como Vulcan, están empezando a crearse su propio hueco.

Merece la pena mencionar que el generador de páginas estáticas más popular del año, Gatsby, también utiliza GraphQL como mediador entre la página estática y su fuente de datos.

Con tantos proyectos girando entorno al mundo GraphQL, es sólo cuestión de tiempo que esta tecnología se convierta pronto en una alternativa a REST.

Miscelánea

1
json-server

json-server

Get a full fake REST API with zero coding in less than 30 seconds (seriously)
+9.5k☆
607
720
755
701
850
1.5k
898
809
628
655
782
671
E
F
M
A
M
J
J
A
S
O
N
D
2
Feather

Feather

Simply beautiful open source icons
+9.4k☆
4.6k
504
2.7k
633
197
510
281
E
F
M
A
M
J
J
A
S
O
N
D
3
Frappé Charts

Frappé Charts

📊🍩📈 Simple, responsive, modern SVG Charts with zero dependencies
+9.0k☆
8.4k
604
E
F
M
A
M
J
J
A
S
O
N
D
4
socket.io

socket.io

Realtime application framework (Node.JS server)
+8.6k☆
646
576
821
745
812
730
768
736
683
688
749
663
E
F
M
A
M
J
J
A
S
O
N
D
5
Yarn

Yarn

📦🐈 Fast, reliable, and secure dependency management.
+8.4k☆
1.0k
965
941
726
755
553
511
519
593
664
549
577
E
F
M
A
M
J
J
A
S
O
N
D
6
SemanticUI

SemanticUI

Semantic is a UI component framework based around useful principles from natural language.
+8.3k☆
618
675
781
1.9k
683
621
570
594
444
492
492
451
E
F
M
A
M
J
J
A
S
O
N
D
7
Three.js

Three.js

JavaScript 3D library.
+8.3k☆
615
685
737
640
652
621
580
629
594
739
821
953
E
F
M
A
M
J
J
A
S
O
N
D
8
Lodash

Lodash

A modern JavaScript utility library delivering modularity, performance, & extras.
+8.0k☆
574
555
695
613
644
699
711
770
622
632
797
665
E
F
M
A
M
J
J
A
S
O
N
D
9
echarts

echarts

A powerful, interactive charting and visualization library for browser
+7.6k☆
384
488
676
611
634
648
737
697
614
557
892
699
E
F
M
A
M
J
J
A
S
O
N
D
10
anime.js

anime.js

JavaScript Animation Engine
+7.6k☆
426
351
442
601
541
613
483
574
888
875
522
1.3k
E
F
M
A
M
J
J
A
S
O
N
D

Debido a que hay proyectos que no encajan a la perfección en las secciones anteriores, hemos creado este listado donde encontrarás los proyectos más populares del año, que a su vez, no pertenecen a ninguna de las otras categorías.

Conclusión

Esperamos que hayas disfrutado de esta síntesis sobre el universo JavaScript en el 2017.

Los números nos han mostrado que Vue.js es de nuevo el ganador del año y que su éxito no parece detenerse.

El ecosistema React continúa creciendo después de haber solventado los problemas relacionados con su licencia.

Pero si tenemos que decantarnos por un proyecto entre los 2017 Rising Stars es Prettier. Es una maravilla poder escribir código sin tener que preocuparnos por el formateo de éste.

Si deseas tener un enfoque más cualitativo sobre las últimas tendencias en el universo JavaScript, no dudes en visitar State of JavaScript 2017 survey, donde recopilamos y analizamos respuestas de más de 23.000 desarrolladores.

Así que, mirando al futuro, ¿qué proyectos piensas que serán los próximos JavaScript Rising Stars del 2018?

  • ¿Un nuevo framework basado en GraphQL?
  • ¿Una nueva librería que se aproveche del estándar WebAssembly para crear una experiencia única en el navegador?

¡Muchas gracias por tu atención! no dudes en compartir este artículo o contactarnos en GitHub si quieres contarnos qué opinas...¡nos vemos el año que viene!


Spanish version

Original version

Sacha Grief
Author of Discover Meteor and creator of Vulcan, a React+GraphQL open-source framework.