Caracter铆sticas
Desarrollo JavaScript Mobile, AWP y SPA Aprende a desarrollar aplicaciones web progresivas con JavaScript. Desarrolla sitios con el mayor rendimiento posible y aprende a desarrollar aplicaciones mobiles en JS simulando apps nativas.
En este curso aprender谩s a
Desarrollar aplicaciones JS que carguen de manera casi instant谩nea.
Utilizar en profundidad DevToos inspeccionando Remote Devices, Breakpoints y mucho mas
Desarrollar aplicaciones con apariencia de una app nativa instalada en el celular.
Dominar el paradigma Offline First y resolver problemas comunes (soporte de navegadores, polyfills, etc)
Trabajar con Services Workers
Enviar notificaciones a los usuarios (en web y en mobile)
Desarrollar aplicaciones con la posibilidad de trabajar sin conexi贸n
Deteccion y desarrollo en diferentes entornos Mobiles
Utilizar dependencias, cache, local storage y muchos m谩s...
Contenido del curso:
El curso comienza con una introducci贸n al dise帽o adaptativo y material, trabajando con Media Queries exclusivamente mobile e importando librer铆as de dise帽o material. Luego, se trabajar谩 con DevTools orientado a Chrome y se repasar谩n varias sugerencias de editores y c贸digo ordenado para tener un buen trabajo con JavaScript. Se diferenciar谩 entre una web y una web progresiva y trabajar谩 con esto 煤ltimo, generando una APP.
Promediando la cursada, se trabajar谩 con Service Workers, que permitir谩 ejecutar una secuencia de comandos en segundo plano sin que la web ni el usuario hagan nada. Se generar谩n tambi茅n SPA (Single Page Applications) pensando en la fluidez y la experiencia del usuario. Por 煤ltimo, se trabajar谩 con el cacheo de datos, su utilizaci贸n y actualizaci贸n; adem谩s, mediremos la velocidad de nuestra aplicaci贸n y finalizaremos trabajando con protocolos de seguridad y el env铆o de notificaciones push a todos los usuarios.
PR脕CTICAS EN CLASE ::
Durante la cursada llevar谩s adelante un proyecto integrador donde generar谩s una APP totalmente adaptativa, incluy茅ndole un carrito de compras y la opci贸n de incluir o eliminar 铆tems a la lista con o sin 铆conos. Adem谩s, llevar谩s adelante una aplicaci贸n de una sola p谩gina, orientada a una excelente experiencia de usuario, y manejar谩s Service Workers, para generar procesos en segundo plano que se activen en determinados momentos sin interacci贸n del usuario. Por 煤ltimo, generar谩s un caching de los datos, las interacciones y finalizar谩s envi谩ndole notificaciones estilo Push a todos los usuarios de esa app.
Plan de Estudios
1. Introduccion a Responsive Design y Dise帽o Material
Mobile First
Dise帽o Material (UX Mobile for Google)
Frameworks JS de Dise帽o Material
Media Queries (CSS Mobile)
Lab1: Comprender Dise帽o Material de modo practico
Importando las librearias de dise帽o material
Crear el markup contenedor
Crear el markup de la lista
2. Buenas practicas de JS
Sugerencias de editores y codigo ordenado
Potenciando DevTools de Chrome para Mobile (trucos y nuevas tools)
驴Qu茅 puedo hacer a partir de hoy?
Lab2: Hola Super (Hola Mundo!) en JS App Mobile
Nuestra primera App Progresiva en JS (Lista de Compras)
Crear una lista de compras
Eliminar una lista de compras
Agregando items a la lista
Eliminando Items a la lista
Agregando precios
3. Diferencias entre una Web y una Progressive Web App
Iconos
Splash Screen
manifest.json
Introduccion a Offline First
驴Qu茅 puedo hacer a partir de hoy?
Lab3: Agregando Iconos y splash Screen
Agregar iconos al proyecto
Agregar manifest.json al proyecto
Chequear con DevTools de Chrome
4. Service Workers
Componentes de un service worker
Tipos de conexiones de internet
Promesas en Javascript
Lab4: Service Workers
Agregar service worker al proyecto
Agregar App a la pantalla de inicio del dispositivo movil
5. SPAs (Single Page Applications)
Introduccion a SPA
Como crear una spa con Jquery de modo facil
Consumiendo datos externos con AJAX
Guardar Datos en Local Storage
Lab5: Convertir nuestra Web en SPA
Secciones de nuestra app
Transiciones
Organizacion de Codigo para una SPA (Buenas Practicas)
6. Cacheo de Datos e interacciones
Introduccion al Caching Inteligente
Como cachear datos utilizando el service worker
Como actualizar el cache
Lab6: Agregando Caching a nuestra App
Configurar el cache
Actualizar el cache
Medir la velocidad de nuestra app Hola Super
7. HTTPS y Seguridad
Introduccion a HTTPS, como funciona y para que sirve
Como instalar https en tu hosting
Certificados Gratis para tu uso
Push Notifications
Como enviar notificaciones a los usuarios de tu app
Crear tu propio push server Vs Push Server de Pago
Lab7: Enviando Notificaciones a nuestros usuarios
Configurar Push Notifications del lado servidor
Configurar Push Notifications del lado cliente
Envio de notificacion de prueba
Deep links
Info Adicional
MODALIDAD DE CURSADO
Modalidad Presencial
Cursos 100% pr谩cticos con grupos reducidos.
Clases con uso de PC, una por alumno (no tienes que traer tu PC).
Coffee Break incluido.
Espacio de networking.
Posibilidad de volver a tomar el mismo curso gratis.
Modalidad Distancia
Cursos 100% pr谩cticos con grupos reducidos.
Clase en tiempo real por video conferencia.
Profesor disponible para hacer consultas en vivo.
Grabaci贸n de las clases disponibles para ver en otro momento.
Asistencia administrativa personalizada todos los d铆as.