[DevDay2018] Ignite your app development with native script and firebase - By Hieu Lam, Software Engineer at Axon Active Viet Nam
0 likes300 views
The document provides an overview of an agile offshore software development and testing company, Axon Active, focusing on the use of NativeScript and Firebase for mobile app development. It introduces NativeScript as an open-source framework for creating native mobile applications using web skills, and details Firebase for backend services, including real-time data synchronization. The document includes installation instructions and a live demo of a chat application using these technologies.
![[DevDay2018] Ignite your app development with native script and firebase - By Hieu Lam, Software Engineer at Axon Active Viet Nam](https://image.slidesharecdn.com/lamphuchieu-igniteyourappdevelopmentwithnativescriptandfirebase-180419091628/85/DevDay2018-Ignite-your-app-development-with-native-script-and-firebase-By-Hieu-Lam-Software-Engineer-at-Axon-Active-Viet-Nam-1-320.jpg)
[DevDay2018] Ignite your app development with native script and firebase - By Hieu Lam, Software Engineer at Axon Active Viet Nam
- 2. Agile Offshore Software Development & Testing company Lam Phuc Hieu phuchieuct hieu.lam@axonactive.com
- 3. www.axon.vnfb.com/AxonActiveVietNam Ignite your app development with NativeScript and Firebase
- 4. www.axon.vnfb.com/AxonActiveVietNam Agenda • Introduce NativeScript • Introduce Firebase • Live demo • Q&A
- 7. www.axon.vnfb.com/AxonActiveVietNam Web App & Hydrid App
- 8. www.axon.vnfb.com/AxonActiveVietNam What is NativeScript • Open source framework • Use JavaScript (“web skills”) • Create truly native mobile apps for iOS, Android • Write once, run everywhere • Integrates deeply with Angular and TypeScript
- 12. www.axon.vnfb.com/AxonActiveVietNam Setup server Setup database Create data table Write SQL queries Expose API via RESTFUL Create HTTP requests to call API Use socket to update data in real time Firebase
- 20. www.axon.vnfb.com/AxonActiveVietNam • Install Node.js • Setup Android Environment (SDK)/ iOS environment (Xcode) Installation C:>npm install nativescript –g C:>tns create DevdayDaNang –template nativescript-template-ng-tutorial C:DevdayDaNang>tns run android/ios
- 21. www.axon.vnfb.com/AxonActiveVietNam • Setup firebase project in firebase.google.com • Download config files: Android: google-services.json iOS: GoogleService-Info.plist Installation
- 22. www.axon.vnfb.com/AxonActiveVietNam Login page import * as firebase from "nativescript-plugin-firebase“
- 23. www.axon.vnfb.com/AxonActiveVietNam Firebase collection: Chat page chatCollection = firebase.firestore().collection(“chats"); Listen data changes: chatCollection.onSnapshot(<callback>) Get data: chatCollection.get() Add, edit, delete data: chatCollection.add(<new_document>) chatCollection.doc(<document_id>).update(<new_documen chatCollection.doc(<document_id>).delete()
Editor's Notes
- #2: Chào mừng các bạn đến với ngày hội Devday 2018.
- #4: Ở topic này, mình sẽ giới thiệu các bạn về cách sử dụng nativescript và firebase để xây dựng các ứng dụng mobile 1 cách nhanh chóng
- #5: Phần trình bày của mình gồm 3 phần. đầu tiên mình sẽ nói về NativeScript, tiếp theo đó là Firebase, và cuối cùng là phần hấp dẫn nhất: mình sẽ livecode xây dựng 1 ứng dụng chat bằng nativeScript và firebase
- #6: Bắt đầu với nativescript
- #7: Trước khi t Như các bạn biết thì mỗi nền tảng mobile lại yêu cầu các ngôn ngữ lập trình khác nhau để xây dựng các ứng dụng native cho riêng nền tảng đó: Ios: Swift /Objective c Android: Java Window với nền tảng .Net Vậy có cách nào mình có thể sử dụng 1 ngôn ngữ để dev cho các nền tảng mobile khác nhau này. Câu trả lời là web application hoặc các ứng dụng dạng hydrid application. Nhưng cả 2 dạng application này đều có nhược điểm: Web application thì bị giới hạn các native api, tức có nghĩa là ứng dụng chỉ chạy được trong môi trường browser chứ không truy cập được sâu vào hệ thống CÒn hydrid thì limitation này đã bị phá bỏ khi ứng dụng web được xây dựng trong môi trường native nhưng performance lại là 1 vấn đề nan giải, do vẫn phải phụ thuộc vào webview nên không thể đạt được performace tốt Thấy được sự khó khan này, các kĩ sư của Telerik đã phát triển nên Nativescript Vậy nativescript có những tính năng nào để tạo nên sự khác biệt
- #9: Là 1 open source framework, giúp chúng ta có thể sử dụng các webskill để phát triển các ứng dụng mobile Điều đặc biệt ở đây là truly native, có nghĩa là các ứng dụng được phát triển bằng nativescript sẽ là những ứng dụng native thực thụ, không phụ thuộc vào webview và có performance không thua kém các ứng dụng native Các bạn cố thể sử dụng chung codebase để phát triển cho android và IOS : 90% code dung chung cho android và ios, 70% code dung chung với các ứng dụng web Nativescript có 1 kho plugin vô cùng phong phú, giúp các bạn thực hiện 1 số tác vụ cơ bản 1 cách dễ dàng Và điều quan trọng nhất và cũng là điều mình thích nhất ở Nativscript chính là việc support Angular vaf typescript. Trong trường hợp cacs bạn không biết thì angular là 1 frontent framework để phát triển các ứng dụng web cực kì phổ biến và đang hot hiện nay hiện nay và được phát triển bỏi google
- #10: Tiếp đến mình sẽ nói về firebase
- #11: Tưởng tượng bạn đang sử dụng 1 ứng dụng , lấy ví dụ như facebook. Những gì người ta thấy là ứng dụng này chỉ chạy trên đt 1 cách đơn giản. Nhưng thực tế, từ góc nhìn của 1 de, thì điều này không đơn giản chút nào. Đằng sau 1 úng dụng đơn giản là 1 hệ thống server đồ sộ để quản lý các việc: authen, database… Có thể có nhiều bạn đồng tình với mình là những việc này không hề đơn giản chút nào, có thể mất hằng tháng trời để setup những việc này trên server Như với firebase, bạn có thể quên đi những điều phức tạp nauy
- #12: Firebase là 1 giải pháp giúp bạn đơn giản hóa các tác vụ cho phần backend. Firebase còn được gọi như là 1 BAAS: backend as a service
- #13: Với firebase mình ko cần làm những việc này
- #14: Firebase được chia làm 3 phần chính Không thể giói thiệu hết Chỉ authentication và realtime database
- #15: Đầu tiên mình sẽ nói về phần authentication Firebase giúp bạn quản lý user 1 cách dễ dàng. Bao gồm đăng kí mới tài khoản, đăng nhập, quên password, gửi email để xác nhận tài khoản Thậm chí còn hỗ trọ login với các nhà hỗ trợ thứ 3 như login với facebook, google,twitter github
- #16: Đầu tiên mình sẽ nói về phần authentication Firebase giúp bạn quản lý user 1 cách dễ dàng. Bao gồm đăng kí mới tài khoản, đăng nhập, quên password, gửi email để xác nhận tài khoản Thậm chí còn hỗ trọ login với các nhà hỗ trợ thứ 3 như login với facebook, google,twitter github
- #17: Kế tiếp là 1 tính năng làm quan trọng bậc nhất của firebase là firestore. Firestore cho phép bạn lưu trữ data và đồng bộ data giữa các người dung và giữa các thiết bị với nhau sử dụng dạng CSDL NoSQL Đặc biệt hơn cả, firestore mang đến khả năng đồng bộ dữ liệu thời gian thực. Giúp ứng dụng được cập nhật thông tin mới nhất ngay khi thông tin bị thay đổi
- #18: Kế tiếp là 1 tính năng làm quan trọng bậc nhất của firebase là firestore. Firestore cho phép bạn lưu trữ data và đồng bộ data giữa các người dung và giữa các thiết bị với nhau sử dụng dạng CSDL NoSQL Đặc biệt hơn cả, firestore mang đến khả năng đồng bộ dữ liệu thời gian thực. Giúp ứng dụng được cập nhật thông tin mới nhất ngay khi thông tin bị thay đổi
- #19: Đã đến phần hấp dẫn nhất ngày hôm nay. Mình sẽ trực tiếp tạo 1 ứng dụng chat sử dụng nativescript và firebase. Để cho các bạn thấy sử dụng nativescript và firebase dễ dàng và hiệu quả đến mức nào
- #20: Mình sẽ xem qua những tính năng mà mình sẽ chuẩn bị thực hiện 1 úng dụng chạy trên nền tảng android sử dụng firebase để đồng bộ data thời gian thực
- #21: Các bước cài đặt nativescript
- #22: Các bước cài đặt firebase
- #23: Sử dụng firebase thông qua plugin nativescript-plugin-firebase
- #24: Realtime databse firestore