Desarrollo Web
Introducción
Estás son mis notas personales en cuanto a desarrollo web.
Proceso de aprendizaje para un Frontend web developer.
Imprescindibles
Los tres ingredientes básicos de la tecnología web son:
HTML
Es necesario estar familiarizado con HTML5. Aunque el conocimiento necesario para hacer una SPA (Single Page Application) no es necesario que sea muy grande.
CSS3
CSS3 sirve para controlar el estilo de visualización.
Preferentemente usaremos frameworks en los que diseñadores profesionales ya han hecho el trabajo duro.
JavaScript
El ES5 era horrible. Tiene muchas tantas cosas feas que han nacido muchos lenguajes que compilan a Javascript.
El ES6 tiene buena pinta. Recomiendo darle una oportunidad a ES6: - ES6 features - ES6 tutorial - Re-introducción a JavaScript
Javascript puede ejecutarse en un navegador o con nodejs.
Otros lenguajes de programación
Elm
Inspirado en Haskell, ha servido de inspiración a React.
Otros
Typescript (de Microsoft), Dart (de Google), Transcrypt para Python, CoffeScript (extensiones de Atom), ... y un largo etc.
Versatilidad
Con la tecnología podemos hacer webs, aplicaciones de escritorio (ver electron), aplicaciones para móvil (react native), aplicaciones web progresivas (que permiten que se instalen en el móvil).
Es importante, pensar en mobile first cuando se hace el front end de una aplicación.
También se pueden crear aplicaciones para servidor.
Complejidad
Esa versatilidad trae mucha complejidad: - Lenguajes que compilan a javascript. - El debugging se complica (sourcemaps) - Librerías para testing - La documentación - Renderizado en el cliente o en el servidor - El backend - Estás en internet, por lo que necesitas autentificación, seguridad, ... - Diversos frameworks - Cada año una nueva moda.
Entorno
Dependencias
Para la descarga de paquetes y gestión de dependencias se usa típicamente:
- npm: para el lado servidor
- bower: para el lado cliente
Empaquetado (bundling?)
Tenemos para empaquetado de software:
- webpack
Aplicaciones de escritorio
Para el desarrollo de aplicaciones de escritorio, disponemos de:
- electron
- http://nwjs.io (node webkit)
Backend
Para hacer servidores, disponemos de express o el más moderno koajs.
Frontend - frameworks
Tenemos frameworks MVC como es el caso de angular. También tenemos sistemas como react para la parte visual.
Móviles
Para hacer aplicaciones móviles, tenemos:
- phonegap/cordova: que básicamente ejecuta una página web dentro de una vista de página web.
- React Native: que ejecuta widgets nativos en el móvil.
Planteamos la aplicación puramente javascript, tanto para el servidor como para el cliente:
Existen toolkits que proporcionan componentes gráficos como jquerymobile, dojo, bootstrap, ionic, ...
Librerías interesantes
Y miles de librerías muy interesantes como D3, openlayers, ...
Automatización de tareas
Para la automatización de tareas tenemos grunt o mejor gulp.
También existen generadores como yeoman, que sirven para crear una estructura (scaffolding) razonable en función del proyecto que se quiere crear.
Bases de datos
En el lado servidor, nos puede interesar tener una base de datos como RethinkDB o como MongoDB. GraphQL?
También tenemos tecnologías como coffeescript, typescript o elm.
Para hablar con Arduino, podemos hacer una aplicación móvil y que use MQTT (librería Paho como cliente y Mosquitto en un PC como servidor).
IDE
Yo estoy usando atom, que es muy extensible. Por ejemplo, puede extenderse con PlatformIO para programar en Arduino y Nuclide para programar en React Native.
Primeros pasos
Instalar atom y nodejs. Así tendremos instalado el gestor de paquetes npm.
Librerías interesantes
Redux Immutable (para manejar el estado)