ebook img

Build Mobile Apps with Ionic 2 and Firebase: Hybrid Mobile App Development PDF

262 Pages·2017·2.86 MB·English
Save to my drive
Quick download
Download
Most books are stored in the elastic cloud where traffic is expensive. For this reason, we have a limit on daily download.

Preview Build Mobile Apps with Ionic 2 and Firebase: Hybrid Mobile App Development

Build Mobile Apps with Ionic 2 and Firebase Hybrid Mobile App Development — Fu Cheng Build Mobile Apps with Ionic 2 and Firebase Hybrid Mobile App Development Fu Cheng Build Mobile Apps with Ionic 2 and Firebase: Hybrid Mobile App Development Fu Cheng Sandringham, Auckland New Zealand ISBN-13 (pbk): 978-1-4842-2736-7 ISBN-13 (electronic): 978-1-4842-2737-4 DOI 10.1007/978-1-4842-2737-4 Library of Congress Control Number: 2017941053 Copyright © 2017 by Fu Cheng This work is subject to copyright. All rights are reserved by the Publisher, whether the whole or part of the material is concerned, specifically the rights of translation, reprinting, reuse of illustrations, recitation, broadcasting, reproduction on microfilms or in any other physical way, and transmission or information storage and retrieval, electronic adaptation, computer software, or by similar or dissimilar methodology now known or hereafter developed. Trademarked names, logos, and images may appear in this book. Rather than use a trademark symbol with every occurrence of a trademarked name, logo, or image we use the names, logos, and images only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark. The use in this publication of trade names, trademarks, service marks, and similar terms, even if they are not identified as such, is not to be taken as an expression of opinion as to whether or not they are subject to proprietary rights. While the advice and information in this book are believed to be true and accurate at the date of publication, neither the authors nor the editors nor the publisher can accept any legal responsibility for any errors or omissions that may be made. The publisher makes no warranty, express or implied, with respect to the material contained herein. Managing Director: Welmoed Spahr Editorial Director: Todd Green Acquisitions Editor: Aaron Black Development Editor: James Markham Technical Reviewer: Massimo Nardone Coordinating Editor: Jessica Vakili Copy Editor: Karen Jameson Compositor: SPi Global Indexer: SPi Global Artist: SPi Global Cover image designed by Freepik Distributed to the book trade worldwide by Springer Science+Business Media New York, 233 Spring Street, 6th Floor, New York, NY 10013. Phone 1-800-SPRINGER, fax (201) 348-4505, e-mail [email protected], or visit www.springeronline.com. Apress Media, LLC is a California LLC and the sole member (owner) is Springer Science + Business Media Finance Inc (SSBM Finance Inc). SSBM Finance Inc is a Delaware corporation. For information on translations, please e-mail [email protected], or visit http://www. apress.com/rights-permissions. Apress titles may be purchased in bulk for academic, corporate, or promotional use. eBook versions and licenses are also available for most titles. For more information, reference our Print and eBook Bulk Sales web page at http://www.apress.com/bulk-sales. Any source code or other supplementary material referenced by the author in this book is available to readers on GitHub via the book’s product page, located at www.apress.com/ 978-1-4842-2736-7. For more detailed information, please visit http://www.apress.com/ source-code. Printed on acid-free paper To my wife Andrea and my daughter Olivia Contents at a Glance About the Author ������������������������������������������������������������������������������xv About the Technical Reviewer ��������������������������������������������������������xvii Preface ��������������������������������������������������������������������������������������������xix ■ Chapter 1: Getting Started ��������������������������������������������������������������1 ■ Chapter 2: Languages, Frameworks, Libraries, and Tools ������������19 ■ Chapter 3: Basic App Structure ����������������������������������������������������47 ■ Chapter 4: List Stories ������������������������������������������������������������������57 ■ Chapter 5: View Story �����������������������������������������������������������������117 ■ Chapter 6: View Comments ��������������������������������������������������������127 ■ Chapter 7: User Management �����������������������������������������������������139 ■ Chapter 8: Manage Favorites ������������������������������������������������������177 ■ Chapter 9: Share Stories�������������������������������������������������������������195 ■ Chapter 10: Common Components ���������������������������������������������203 v vi Contents at a Glance ■ Chapter 11: Advanced Topics �����������������������������������������������������215 ■ Chapter 12: End-to-End Test and Build ���������������������������������������227 ■ Chapter 13: Publish ��������������������������������������������������������������������239 Index ����������������������������������������������������������������������������������������������247 Contents About the Author ������������������������������������������������������������������������������xv About the Technical Reviewer ��������������������������������������������������������xvii Preface ��������������������������������������������������������������������������������������������xix ■ Chapter 1: Getting Started ��������������������������������������������������������������1 Mobile Apps Refresher ����������������������������������������������������������������������������1 Hybrid Mobile Apps ���������������������������������������������������������������������������������2 Apache Cordova ��������������������������������������������������������������������������������������������������������3 Ionic Framework �������������������������������������������������������������������������������������������������������3 Firebase ��������������������������������������������������������������������������������������������������������������������4 Prepare Your Local Development Environment ���������������������������������������5 Node�js ����������������������������������������������������������������������������������������������������������������������5 Ionic CLI ��������������������������������������������������������������������������������������������������������������������5 iOS ����������������������������������������������������������������������������������������������������������������������������7 Android ��������������������������������������������������������������������������������������������������������������������7 IDEs and Editors �������������������������������������������������������������������������������������������������������9 Create an App Skeleton ���������������������������������������������������������������������������9 Blank App �����������������������������������������������������������������������������������������������������������������9 Tabbed App �������������������������������������������������������������������������������������������������������������10 vii viii Contents Sidemenu ���������������������������������������������������������������������������������������������������������������11 Tutorial ��������������������������������������������������������������������������������������������������������������������12 Local Development ��������������������������������������������������������������������������������13 Use Chrome for Development ���������������������������������������������������������������������������������14 Use Chrome DevTools for Android Remote Debugging �������������������������������������������15 Test on Emulators ����������������������������������������������������������������������������������15 iOS ��������������������������������������������������������������������������������������������������������������������������15 Android �������������������������������������������������������������������������������������������������������������������16 Summary �����������������������������������������������������������������������������������������������17 ■ Chapter 2: Languages, Frameworks, Libraries, and Tools ������������19 TypeScript ���������������������������������������������������������������������������������������������20 Why TypeScript? �����������������������������������������������������������������������������������������������������20 Basic Types �������������������������������������������������������������������������������������������������������������21 Functions ����������������������������������������������������������������������������������������������������������������25 Interfaces and Classes �������������������������������������������������������������������������������������������27 Decorators ��������������������������������������������������������������������������������������������������������������31 Angular 2 ����������������������������������������������������������������������������������������������������������������34 RxJS ������������������������������������������������������������������������������������������������������41 Observable ��������������������������������������������������������������������������������������������������������������41 Observers ���������������������������������������������������������������������������������������������������������������42 Subjects ������������������������������������������������������������������������������������������������������������������42 Operators ����������������������������������������������������������������������������������������������������������������43 Sass �������������������������������������������������������������������������������������������������������43 Variables �����������������������������������������������������������������������������������������������������������������43 Nesting �������������������������������������������������������������������������������������������������������������������44 Mixins ���������������������������������������������������������������������������������������������������������������������44 Jasmine and Karma ������������������������������������������������������������������������������45 Summary �����������������������������������������������������������������������������������������������45 Contents ix ■ Chapter 3: Basic App Structure ����������������������������������������������������47 Understanding the Basic App Structure ������������������������������������������������48 Config Files ��������������������������������������������������������������������������������������������48 package�json�����������������������������������������������������������������������������������������������������������48 config�xml ���������������������������������������������������������������������������������������������������������������49 tsconfig�json �����������������������������������������������������������������������������������������������������������49 ionic�config�json ������������������������������������������������������������������������������������������������������50 tslint�json ����������������������������������������������������������������������������������������������������������������50 �editorconfig �����������������������������������������������������������������������������������������������������������50 Cordova Files �����������������������������������������������������������������������������������������50 hooks ����������������������������������������������������������������������������������������������������������������������50 platforms ����������������������������������������������������������������������������������������������������������������50 plugins ��������������������������������������������������������������������������������������������������������������������51 www �����������������������������������������������������������������������������������������������������������������������51 App Files ������������������������������������������������������������������������������������������������51 index�html ���������������������������������������������������������������������������������������������������������������51 declarations�d�ts �����������������������������������������������������������������������������������������������������51 manifest�json and service-worker�js ����������������������������������������������������������������������51 assets ���������������������������������������������������������������������������������������������������������������������51 theme ���������������������������������������������������������������������������������������������������������������������52 app ��������������������������������������������������������������������������������������������������������������������������52 components ������������������������������������������������������������������������������������������������������������52 pages ����������������������������������������������������������������������������������������������������������������������52 Skeleton Code ���������������������������������������������������������������������������������������52 app�module�ts ���������������������������������������������������������������������������������������������������������52 app�component�ts ���������������������������������������������������������������������������������������������������53 app�html������������������������������������������������������������������������������������������������������������������54 x Contents main�ts ��������������������������������������������������������������������������������������������������������������������55 app�scss������������������������������������������������������������������������������������������������������������������55 Page 1 and Page 2 Files �����������������������������������������������������������������������������������������55 Summary �����������������������������������������������������������������������������������������������55 ■ Chapter 4: List Stories ������������������������������������������������������������������57 Define the Model �����������������������������������������������������������������������������������57 List Component �������������������������������������������������������������������������������������58 Simple List ��������������������������������������������������������������������������������������������������������������58 Header and Separators �������������������������������������������������������������������������������������������59 Grouping of Items ���������������������������������������������������������������������������������������������������59 Icons �����������������������������������������������������������������������������������������������������������������������60 Avatars ��������������������������������������������������������������������������������������������������������������������61 Thumbnails �������������������������������������������������������������������������������������������������������������61 Display a List of Items ���������������������������������������������������������������������������62 Item Component �����������������������������������������������������������������������������������������������������63 Items Component ���������������������������������������������������������������������������������������������������65 Empty List ���������������������������������������������������������������������������������������������������������������65 Test List Component ������������������������������������������������������������������������������66 Tools �����������������������������������������������������������������������������������������������������������������������66 Testing Configuration ����������������������������������������������������������������������������������������������67 Testing Items Component ���������������������������������������������������������������������������������������71 Run Tests ����������������������������������������������������������������������������������������������������������������75 Items Loading Service ���������������������������������������������������������������������������76 Top Stories Page ������������������������������������������������������������������������������������78 Test �������������������������������������������������������������������������������������������������������������������������79 Firebase Basics �������������������������������������������������������������������������������������82 Database Structure �������������������������������������������������������������������������������������������������82 Firebase JavaScript SDK ����������������������������������������������������������������������������������������83 Write Data ���������������������������������������������������������������������������������������������������������������86

Description:
Learn to build hybrid mobile apps using Ionic and Firebase. You'll build a Hacker News client app, which can view top stories in Hacker News, view comments of a story, add stories to favorites, etc. This introductory guide covers the whole cycle of hybrid mobile apps development. It's organized arou
See more

The list of books you might like

Most books are stored in the elastic cloud where traffic is expensive. For this reason, we have a limit on daily download.