Conociendo Nativescript

Frontend.pe Meetup Diciembre

Transcript

1. Conociendo Nativescript Victoria Ubaldo G. @VikyAle
2. Photo goes here Hola! • Ing. de Computación y Sistemas, USMP. Mención en Ing. Software. • System Engineer,Tata Consulting Services. • Manager, WTM Lima. • Full Stack Developer. • <3 Compartir y aprender en comunidades de tecnología.
3. Fuente https://goo.gl/08ND0v
4. ¿Qué es Nativescript? ¿y por qué debería usarlo?
5. ` Es un framework opensource que nos permite crear aplicaciones nativas con Javascript.
6. ` No WebView (HTML con estilo parecido a componentes nativos) No hay DOM que manipular
7. ` No Cross-Compile (Interpretar código y transformarlo a nativo) No .Net
8. ` 100% acceso a APIs nativas. Sin escribir en Object C,Swift o Java
10. 100 % Web 100 % Nativo Híbrida Fuente https://goo.gl/ph21U0
11. 100 % Web 100 % Nativo Fuente https://goo.gl/ph21U0
12. Híbrida Tradicional VS NativeScript WebView Requiere plugins para acceder a APIs nativas. (Ejm: cámara) Demora en actualizaciones JS Angular CSS Web/Móvil Cómo para desarrolladores web UI Nativa Buen performance Acceso al 100% a APIs nativas. Actualizaciones automáticas Fuente https://goo.gl/ph21U0
13. Nativa Pura VS NativeScript Máximo desempeño. Código por plataforma (lenguaje). No permite compartir código con web UI Nativa Buen performance Acceso al 100% a APIs nativas. Actualizaciones automáticas Un lenguaje para todas las plataformas. Reusa habilidades de web (JS , CSS). Reusa librerias web (Angular 2). Sí permite compartir código con web Fuente https://goo.gl/ph21U0
14. ` • No Jank • Access All The Things • Native UI • Extensible • Quick to learn • IDE ( Visual Studio Code) • Cross-Platform (iOS,Android,próximamente Windows Phone - CSS Específico). • OpenSource • Angular & TypeScript • Style with CSS (SASS & LESS)
15. ` Creado y soportado por :
17. `
18. Native Layout Containers
19. ` Existe mucho código hecho
20. ¿Cómo se trabaja?
25. Get Started
26. ó Tienes dos caminos npm install -g nativescript
27. ` • Usa AppBuilder o Screen Builder. • Desarrollo en la nube. • Desarrolladores en Windows escribiendo para iOS. Fuente https://goo.gl/ph21U0
28. ` npm install - g nativescript tns create my-app tns platform add ios tns build ios tns livesync ios --emulator --watch
30. tns create my-app
31. tns platform add android
32. ` Nativescript & Javascript
33. Estructura del Proyecto Inicial
34. node_modules
35. Dependencias
36. Código nativo por plataforma
37. main-page.xml
39. tns run android
40. tns livesync android --watch
42. main-page.js
43. main-view-model.js
44. En el archivo app.js indico la aplicación a iniciar.
45. ` Nativescript & Angular 2
47. Showcases https://www.nativescript.org/showcases
48. MeWatt utiliza NativeScript para construir una aplicación para iOS y Android que se pueden utilizar para administrar el uso de energía de sus aplicaciones de forma remota Fuente http://mewatt.com/
49. ` • Native UI • Extensible ( NPM , CocoaPods (iOS) and Gradle (Android) ) • Quick to learn • Cross-Platform • Strong Backing( Telerik) • Open Source Conclusiones
50. `
51. Go build! meow
52. ¿preguntas? Gracias Victoria Ubaldo G. @VikyAle