React Developer Roadmap

README in Chinese

README in English

README in Japanese

README in Korean

README in Portuguese (Brazil)

README in Russian

Roadmap para convertirse en un desarrollador React en 2019::

A continuación puede encontrar un gráfico que muestra las rutas que puede tomar y las bibliotecas que le gustaría aprender para convertirse en un desarrollador React. Hice esta tabla como una sugerencia para todos los que me preguntan: "¿Qué debo aprender a continuación como desarrollador de React?"

Descargo

El propósito de este roadmap es darte una idea sobre el paisaje. Este lo guiará en caso de estár confundido acerca de qué aprender, en lugar de animarlo a elegir lo que es moderno y actual. Debe comprender mejor por qué una herramienta sería más adecuada para algunos casos que la otra y recordar que la moda y la moda no siempre son las más adecuadas para el trabajo

Roadmap

Resources

1. Básico
   1. HTML
      • Aprender los conceptos básicos de HTML.

        * Hacer unas pocas páginas como ejercicio. 2. CSS * Aprender los conceptos básicos de CSS * Páginas de estilo del paso anterior.         * Construir una página con grid y flexbox. 3. Javascript Básico * Familiarizarse con la sintaxis.         * Aprender operaciones básicas en DOM         * Aprender los mecanismos típicos de JS (Hoisting, Event Bubbling, creación de prototipos)         * Hacer algunas llamadas AJAX (XHR)         * Aprender nuevas características (ECMA Script 6+)         * Además, familiarícese con la biblioteca jQuery 2. Habilidades generales de desarrollo 1. Aprenda GIT, cree algunos repositorios en GitHub, comparta su código con otras personas 2. Conozca el protocolo HTTP (S), métodos de solicitud (GET, POST, PUT, PATCH, DELETE, OPTIONS) 3. No tengas miedo de usar Google, Power Searching with Google 4. Familiarícese con el terminal, configure su shell (bash, zsh, fish)     5. Lee algunos libros sobre algoritmos y estructuras de datos     6. Lee algunos libros sobre patrones de diseño 3. Aprender React Página oficial o completa algunos cursos 4. Familiarízate con las herramientas que utilizarás. 1. Gestores de paquetes * npm * yarn * pnpm 2. Task Runners * npm scripts * gulp * Webpack * Rollup * Parcel 5. Estilo 1. Preprocesadores CSS * Sass/CSS * PostCSS * Less * Stylus 2. Frameworks CSS * Bootstrap * Materialize, Material UI, Material Design Lite * Bulma * Semantic UI 3. Arquitectura CSS * BEM * CSS Modules * Atomic * OOCSS * SMACSS * SUITCSS 4. CSS en JS * Styled Components * Radium * Emotion * JSS * Aphrodite 6. Manejo del estado 1. Component State/Context API 2. Redux 1. Acciones asincrónicas (Efectos secundarios) * Redux Thunk * Redux Better Promise * Redux Saga * Redux Observable 2. Helpers * Rematch * Reselect 3. Persistencia de datos * Redux Persist * Redux Phoenix 4. Redux Form 3. MobX 7. Comprobadores de tipos * PropTypes * TypeScript * Flow 8. Helpers de formularios * Redux Form * Formik * Formsy * Final Form 9. Enrutamiento * React-Router * Router5 * Redux-First Router * Reach Router 10. Consumo de API 1. REST * Fetch * SuperAgent * axios 2. GraphQL * Apollo * Relay * urql 11. Librerías útiles * Lodash * Moment * classnames * Numeral * RxJS * ImmutableJS * Ramda 12. Pruebas 1. Pruebas Unitarias * Jest * Enzyme * Sinon * Mocha * Chai * AVA * Tape 2. Pruebas de extremo a extremo * Selenium, Webdriver * Cypress * Puppeteer * Cucumber.js * Nightwatch.js 3. Pruebas de integración * Karma 13. Internacionalización * React Intl * React i18next 14. Render del lado del servidor * Next.js * After.js * Rogue 15. Generador de sitio estático * Gatsby 16. Integración con Framework de Backend * React on Rails 17. Móvil * React Native * Cordova/Phonegap 18. Escritorio * Proton Native * Electron * React Native Windows 19. Realidad virtual * React 360

Conclusión

Si cree que se puede mejorar el roadmap, abra un PR con cualquier actualización y envíe cualquier problema. Además, continuaré mejorandolo, por lo que es posible que desee darle una estrella a este repositorio para volver a visitarlo.

Contribución

The roadmap is built using Draw.io. Project file can be found at /src directory. To modify it, open draw.io, click Open Existing Diagram and choose xml file with project. It will open the roadmap for you. Update it, upload and update the images in readme and create a PR (export as png).

• Abrir un pull request con mejoras.
• Discutir ideas en temas (issues).
• Difundir la palabra.

Licencia