Use Ionic Framework to develop mobile application

•Download as ODP, PDF•

1 like•1,480 views

Lucio Grenzi

Introduction to the Ionic and shows some simple demos how to use this framework in order to develop hybrid app

Technology

MILAN 20/21.11.2015
Use Ionic framework to develop mobile
applications
Lucio Grenzi

MILAN 20/21.11.2015
Who is this guy
• Freelance
• Front end web developer
• Over 10 years of
programming experience
• Open source addicted
• Github.com/dogwolf

MILAN 20/21.11.2015 - Grenzi Lucio
Overview
• Native vs Web vs Hybrid app
• Ionic intro
• Ionic CLI
• UI Components
• Demos

MILAN 20/21.11.2015 - Grenzi Lucio
I want build a new app!

MILAN 20/21.11.2015 - Grenzi Lucio
https://www.flickr.com/photos/johnjoh/448665548/

MILAN 20/21.11.2015 - Grenzi Lucio
Native apps
• More platform, more problem
• Language is specific to platform => codebase
separation
• Dimisihing the return

MILAN 20/21.11.2015 - Grenzi Lucio
Web apps
Are website that looks like an app
Run by a browser
Native-like functionality in the browser

MILAN 20/21.11.2015 - Grenzi Lucio
Hybrid apps
• Embed HTML5 apps inside a thin native
container
• They can take advantage of the many device
features available.
• Single base code (HTML 5 + Css + Js)

MILAN 20/21.11.2015 - Grenzi Lucio
Apache Cordova
Open-source framework
Run HTML/JavaScript based applications
Native device functionality is exposed
via JavaScript APIs
Does not include UI Components

MILAN 20/21.11.2015 - Grenzi Lucio
Cordova architecture
https://blog.codecentric.de/en/2014/11/ionic-
angularjs-framework-on-the-rise/

MILAN 20/21.11.2015 - Grenzi Lucio
ngCordova
collection of 70+ AngularJS extensions
built on top of the Cordova API
Made build, easy deploy, test Cordova apps
http://ngcordova.com/

MILAN 20/21.11.2015 - Grenzi Lucio
Ionic framework
Build mobile apps faster with the
web mobile you know and love

MILAN 20/21.11.2015 - Grenzi Lucio
Modern web skills

MILAN 20/21.11.2015 - Grenzi Lucio
Supported devices
PlannedAndroid 4+IOS 6+

MILAN 20/21.11.2015 - Grenzi Lucio
Ionic Architecture
https://blog.codecentric.de/en/2014/11/ionic-
angularjs-framework-on-the-rise/

MILAN 20/21.11.2015 - Grenzi Lucio
Powered by AngularJs
• develop rich and robust
applications
• create a powerful SDK
• extend HTML vocabulary
for your application
• fully extensible

MILAN 20/21.11.2015 - Grenzi Lucio
Sass
• Give your app the
appropriate look and
feel
• CSS can be quickly
manipulated
• Standalone CSS
(indipendent of JS
framework)

MILAN 20/21.11.2015 - Grenzi Lucio
Ionic's adoption in numbers
• Over 20.000 stars on GitHub (Top 40
project)
• 600.000+ Ionic apps have been started from
the CLI
• Ionic CLI was downloaded 208.114 times in
the last month
• Released v1.0 on May 2015

MILAN 20/21.11.2015 - Grenzi Lucio
How to get started

MILAN 20/21.11.2015 - Grenzi Lucio
Install Ionic
First install node.js
Install Android ADT / iOS Xcode
Open console and type
$ npm install -g cordova ionic

MILAN 20/21.11.2015 - Grenzi Lucio
Start a project
$ ionic start iorun blank
Comprehensive app structure
Ready for deploy and building

MILAN 20/21.11.2015 - Grenzi Lucio
Run it
$ cd iorun
$ ionic platform add android
$ ionic build android
$ ionic emulate android

MILAN 20/21.11.2015 - Grenzi Lucio
Ionic built-in elements

MILAN 20/21.11.2015 - Grenzi Lucio
Complex Lists

MILAN 20/21.11.2015 - Grenzi Lucio
Collection repeat

MILAN 20/21.11.2015 - Grenzi Lucio
Navigation

MILAN 20/21.11.2015 - Grenzi Lucio
Swipe menu'

MILAN 20/21.11.2015 - Grenzi Lucio
Action sheet

MILAN 20/21.11.2015 - Grenzi Lucio
Ionicons

MILAN 20/21.11.2015 - Grenzi Lucio
Ionic box
• Ready-to-go hybrid development environment
for building mobile apps with Ionic,
Cordova, and Android
• https://github.com/driftyco/ionic-box

MILAN 20/21.11.2015 - Grenzi Lucio
Choose your Android version
Bootstrap.sh

MILAN 20/21.11.2015 - Grenzi Lucio
Android version adoption
https://developer.android.com/about/dashboards/index.html

MILAN 20/21.11.2015 - Grenzi Lucio
Ionic Lab

MILAN 20/21.11.2015 - Grenzi Lucio
Ionic Creator

MILAN 20/21.11.2015 - Grenzi Lucio
Ionic Market

MILAN 20/21.11.2015 - Grenzi Lucio
Getting started guide
ionicframework.com/getting-started
Documentation
ionicframework.com/docs
Visit the Community Forum
forum.ionicframework.com
Contribute on GitHub
github.com/driftyco/ionic

MILAN 20/21.11.2015 - Grenzi Lucio
Questions?
https://www.flickr.com/photos/derek_b/3046770021/

MILAN 20/21.11.2015 - Grenzi Lucio
https://www.flickr.com/photos/wwworks/4759535950/

MILAN 20/21.11.2015 - SPEAKER’S NAME
Leave your feedback on Joind.in!
https://m.joind.in/event/codemotion-milan-2015

What's hot

Mobile Applications with Angular 4 and Ionic 3

Oleksandr Tryshchenko

Ionic - Hybrid Mobile Application Framework

Sanjay Kumar

Hybrid app in ionic framework overview

Sanket Devlekar

Creating mobile apps - an introduction to Ionic (Engage 2016)

Mark Leusink

Ionic 2 intro

Wojciech Langiewicz

Hybrid mobile and Ionic

Liju Pillai

Ionic Framework

Thinh VoXuan

Cordova, Angularjs & Ionic @ Codeaholics

Eddie Lau

Hybrid vs. Native app - Ionic Framework with AngularJS

Zvika Epstein

Building Mobile Apps with Cordova , AngularJS and Ionic

Kadhem Soltani

Building mobile app with Ionic Framework

Huy Trần

Creating an hybrid app in minutes with Ionic Framework

Julien Renaux

Ionic is a free framework that allows users to easily build hybrid mobile applications for iOS and Android using Angular and Cordova. Ionic provides a command line interface, CSS classes, reusable components (directives) and various tools for testing and development. In this session, you'll get a birdseye view of what Ionic has to offer, as well as guidelines for building your first Ionic app, including the use of tools such as Yeoman, Bower and Grunt.

Intro to Ionic for Building Hybrid Mobile Applications

Sasha dos Santos

Ionic Framework - Intro to Hybrid Mobile Application Development

Max Kaplan

Introduction to the Ionic Framework

rrjohnson85

Intro to mobile apps with the ionic framework & angular js

Hector Iribarne

Hybrid mobile app development slide with Ionic Framework. This is a subset of slides presented during my Ionic Mobile Development course. In addition to the items in this slide, the course will cover Ionic application Architecture, Important AngularJS principles for Ionic development, Native vs Hybrid and code signing to Google Play and AppStore. It is a hands-on based approach training where 80% of the course (normally from 10 am to 5 pm) will be guided lab activity or mini project activity.

Hybrid app development with ionic

Wan Muzaffar Wan Hashim

What happens when you combine Google's AngularJS, the super cool JavaScript MVC Framework with Apache Cordova, the cross platform mobile framework using web technology? You get the Ionic Framework, the super sexy love child of two great frameworks. With Ionic you build mobile apps using the web technology you already know and love. Think the apps will be slow and clunky? Think again, Ionic comes out of the box with well design CSS3 classes to make beautiful and fluid apps. Using Cordova and jQuery Mobile already? Well, with Ionic you will learn to love mobile development again. No more write-only spaghetti code, Ionic makes it easy to create clean, testable, logical mobile apps. Need to support tablet and phone in the same app? Ionic has you covered. You can create one app which will use responsive design to change its look based on the device's screen dimensions. In this talk, I will show how easy it is to create a mobile with Ionic by building a simple but feature full app live. We will start at the command line, with one command, Ionic creates the skeleton of our app. Then using a text editor and the Chrome browser we begin building out our app. We can get it all up and running without the need for a mobile device. We will use live reload so we see our changes as soon as we make them. Once we finish, a few commands deploys our app to a simulated device. Want to get started but heard what a pain it is to install a mobile development environment? Never fear, the Vagrant Ionic Box provides a complete Android development in a virtual environment for Windows, Mac OS X, and Linux. You will be up and coding in no time.

Cross Platform Mobile Apps with the Ionic Framework

Troy Miles

Ionic Framework - get up and running to build hybrid mobile apps

Andreas Sahle

Ionic 2: Mobile apps with the Web

Mike Hartington

What's hot (20)

Mobile Applications with Angular 4 and Ionic 3

Ionic - Hybrid Mobile Application Framework

Hybrid app in ionic framework overview

Creating mobile apps - an introduction to Ionic (Engage 2016)

Ionic 2 intro

Hybrid mobile and Ionic

Ionic Framework

Cordova, Angularjs & Ionic @ Codeaholics

Hybrid vs. Native app - Ionic Framework with AngularJS

Building Mobile Apps with Cordova , AngularJS and Ionic

Building mobile app with Ionic Framework

Creating an hybrid app in minutes with Ionic Framework

Intro to Ionic for Building Hybrid Mobile Applications

Ionic Framework - Intro to Hybrid Mobile Application Development

Introduction to the Ionic Framework

Intro to mobile apps with the ionic framework & angular js

Hybrid app development with ionic

Cross Platform Mobile Apps with the Ionic Framework

Ionic Framework - get up and running to build hybrid mobile apps

Ionic 2: Mobile apps with the Web

Similar to Use Ionic Framework to develop mobile application

Wikipedia Mobile App with PhoneGap

Ted Chien

Basics of Android

sabi_123

IONIC - Hybrid Mobile App Development

Swapnil Tripathi ( Looking for new challenges )

Ionic adventures - Hybrid Mobile App Development rocks

Juarez Filho

I knew there had to be a better way to build mobile apps. The time has never been better to learn mobile application development. For many app ideas, you don’t even need any prior native development knowledge. You can get started today with knowledge of HTML, CSS and JavaScript. Unlike native mobile development, mobile applications using web technologies can support many mobile platforms. So during this session will gain experience how to start from very basics and build mobile apps with zero knowledge. Alius will share his own experience on building hybryd applications based on PhoneGap also he promised to explain why he suddenly changed his own opinion about native apps and switched back to Xamarin.

«I knew there had to be a better way to build mobile app»

FDConf

Web Developers are now Mobile Developers

boyney123

The time has never been better to learn mobile application development. For many app ideas, you don’t even need any prior native development knowledge. You can get started today with knowledge of HTML, CSS and JavaScript. Unlike native mobile development, mobile applications using web technologies can support many mobile platforms. I shared my own experience on building hybrid applications based on PhoneGap also explained why I suddenly changed my own opinion about native apps and switched back to Xamarin.

I knew there had to be a better way to build mobile apps

Alius Petraška

Common Ionic Development Mistakes Developers Tend To Make!

Techugo

Mirco Vanini is a developer consultant focused on mobile / embedded / micro device solutions using .NET Compact Framework, .NET Micro Framework, MSVS C++ and other natives SDK with more than 25 years application development experience. Since 1990 I have developed applications using the various technologies on the market (C/C++/MFC/ATL/COM). From 2000 I have started to develop with the Microsoft .NET for the mobile and desktop environments. With mobile development he always uses both managed and native code to get maximum performance from the various devices.

Mirco Vanini - Windows 10 IOT Core

Codemotion

Rapid mobile app development using Ionic framework

Swaminathan Vetri

Simon Bates, Manifesto Digital - Mobile Application Development: Past, Presen...

Simon Bates

tittanium

PaYal Umraliya

Appcelerator Titanium Intro

Nicholas Jansma

Introduction to hybrid application development

Kunjan Thakkar

Building iPhone/Andriod Apps with Titanium Appcelerator for a Rails Backend

Andrew Chalkley

Ionic framework

Software Infrastructure

Hybrid Mobile application

Sanjay Patel

Building mobile apps using meteorJS

Entrepreneur / Startup

Why do developers prefer ionic to build progressive web apps

Moon Technolabs Pvt. Ltd.

Ionic creator

Xavier Lozinguez

Similar to Use Ionic Framework to develop mobile application (20)

Wikipedia Mobile App with PhoneGap

Basics of Android

IONIC - Hybrid Mobile App Development

Ionic adventures - Hybrid Mobile App Development rocks

«I knew there had to be a better way to build mobile app»

Web Developers are now Mobile Developers

I knew there had to be a better way to build mobile apps

Common Ionic Development Mistakes Developers Tend To Make!

Mirco Vanini - Windows 10 IOT Core

Rapid mobile app development using Ionic framework

Simon Bates, Manifesto Digital - Mobile Application Development: Past, Presen...

tittanium

Appcelerator Titanium Intro

Introduction to hybrid application development

Building iPhone/Andriod Apps with Titanium Appcelerator for a Rails Backend

Ionic framework

Hybrid Mobile application

Building mobile apps using meteorJS

Why do developers prefer ionic to build progressive web apps

Ionic creator

Recently uploaded

In this session, we will showcase how to revolutionize automated testing for your software, automation, and QA teams with UiPath Test Suite. In part 1 of UiPath test automation using UiPath Test Suite – developer series, we will cover, Software testing overview What is software testing Why software testing is required Typical test types and levels Continuous testing and challenges Introduction to UiPath Test Suite UiPath Test Suite family of products Speaker: Atul Trikha, Chief Technologist & Solutions Architect, Peraton and UiPath MVP Deepak Rai, Automation Practice Lead, Boundaryless Group and UiPath MVP

UiPath Test Automation using UiPath Test Suite series, part 1

DianaGray10

I'm excited to share my latest predictions on how AI, robotics, and other technological advancements will reshape industries in the coming years. The slides explore the exponential growth of computational power, the future of AI and robotics, and their profound impact on various sectors. Why this matters: The success of new products and investments hinges on precise timing and foresight into emerging categories. This deck equips founders, VCs, and industry leaders with insights to align future products with upcoming tech developments. These insights enhance the ability to forecast industry trends, improve market timing, and predict competitor actions. Highlights: ▪ Exponential Growth in Compute: How $1000 will soon buy the computational power of a human brain ▪ Scaling of AI Models: The journey towards beyond human-scale models and intelligent edge computing ▪ Transformative Technologies: From advanced robotics and brain interfaces to automated healthcare and beyond ▪ Future of Work: How automation will redefine jobs and economic structures by 2040 With so many predictions presented here, some will inevitably be wrong or mistimed, especially with potential external disruptions. For instance, a conflict in Taiwan could severely impact global semiconductor production, affecting compute costs and related advancements. Nonetheless, these slides are intended to guide intuition on future technological trends.

Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl

Peter Udo Diehl

The standard Salesforce Approval process can be limiting in many ways, especially in complex scenarios. What if there was a way to implement very flexible approvals where one can use Apex code to make data updates in unrelated records, dynamically generate next steps details, and compute assignees on the fly? And still use UI-based configurations to implement concrete approval processes. In this session, we will share ideas behind such a solution and show a few lines of code to get you started.

Custom Approval Process: A New Perspective, Pavel Hrbacek & Anindya Halder

CzechDreamin

Screen flow is a powerful automation tool that is commonly designed for internal and external users. However, what about the guest users? We will dive into various methods of launching screen flows and understand how to make them publicly accessible, extending their usability to a broader audience. The presentation will also cover the implementation of security layers and highlight best practices for a smooth and protected user experience. Discover the potential of screen flows beyond conventional use and learn how to leverage them effectively.

Free and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade

CzechDreamin

IESVE for Early Stage Design and Planning

IES VE

PLAI - Acceleration Program for Generative A.I. Startups

Stefano

IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx

Abida Shariff

The New York Times continues to lead in user-centered design by innovating and adapting to enhance both user engagement and understanding, aligning product experiences with its journalistic mission. This presentation discusses innovative strategies in user experience at The New York Times, focusing on subscriber experiences and storytelling. Key Points Covered: - Mission-Driven Design: Emphasizing the Times' mission to "seek the truth and help people understand the world," the design team prioritizes clarity and engagement to support high-quality journalism. - UX Design Principles: The team follows five core UX tenets—clarity, time optimization, craftsmanship, accessibility, and trust—to maintain a strong focus on user-centric design. - Innovative Design Strategies: Product Feature Advancement, Editorial Expression, Long-term Visioning - Integrating Diverse Content: Examples include the successful integration of popular games like Wordle, which not only entertain but also attract and retain a diverse user base.

Transforming The New York Times: Empowering Evolution through UX

UXDXConf

ODC, Data Fabric and Architecture User Group

CatarinaPereira64715

Intelligent Gimbal FINAL PAPER Engineering.pdf

Anthony Lucente

Already know how to write a basic SOQL query? Great! But what about an *aggregate* SOQL query? You know, the kind that uses aggregate functions like COUNT & MAX along with GROUP BY and HAVING clauses? No? Well, get ready to learn how to slice & dice your org’s data right inside your own dev console. From finding duplicate records to prototyping summary & matrix reports, learn the ins and outs of aggregate queries during this fast-paced but admin-friendly session on advanced SOQL concepts.

SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...

CzechDreamin

Join us as we dive into the latest updates to the UiPath Orchestrator API, including new limits and features for 2024. Discover how these changes can enhance your automation projects and streamline your workflows. 📚 Overview of UiPath Orchestrator API 🔧 Recent changes to API limits 🛠️ How to adapt to new limits 📋 Best practices for using the Orchestrator API efficiently ❓ Q&A session

Exploring UiPath Orchestrator API: updates and limits in 2024 🚀

DianaGray10

This talk offers actionable insights at an executive level for enhancing productivity and refining your portfolio management approach to propel your organization to greater heights. Key Points Covered: 1. Experience Transformation: - The core challenge remains consistent across organizations: converting budget into user-centric designs. - Strategies for deploying design resources effectively in both startups and large enterprises. 2. Strategic Frameworks: - Introduction to the "Ziggurat of Impact" model, detailing layers from basic system interactions to comprehensive customer experiences. - Practical insights on creating frameworks that scale with organizational complexity. 3. Organizational Impact: - Real-world examples of navigating design in large settings, focusing on the synthesis of consumer products and customer experiences. - Emphasis on the importance of designing systems that directly influence customer interactions. 4. Design Execution: - Detailed walkthrough of organizational layers affecting design execution, from touchpoints and customer activities to shared capabilities. - How to ensure design influences both the micro and macro aspects of customer interactions. 5. Measurement and Adaptation: - Techniques for measuring the impact of design decisions and adapting strategies based on data-driven insights. - The critical role of continuous improvement and feedback in refining customer experiences.

Structuring Teams and Portfolios for Success

UXDXConf

This talk focuses on the practical aspects of integrating various telephony systems with Salesforce, drawing on examples from implementations in the Czech scene. It aims to inform attendees about the spectrum of telephony solutions available, from small to large scale, and their compatibility with Salesforce. The presentation will highlight key considerations for selecting a telephony provider that integrates smoothly with Salesforce, including important questions to support the decision-making process. It will also discuss methods for integrating existing telephony systems with Salesforce, aimed at companies contemplating or in the process of adopting this CRM platform. The discussion is designed to provide a straightforward overview of the steps and considerations involved in telephony and Salesforce integration, with an emphasis on functionality, compatibility, and the practical experiences of Czech companies.

Integrating Telephony Systems with Salesforce: Insights and Considerations, B...

CzechDreamin

ScyllaDB has the potential to deliver impressive performance and scalability. The better you understand how it works, the more you can squeeze out of it. But before you squeeze, make sure you know what to monitor! Watch our experienced Postgres developer work through monitoring and performance strategies that help him understand what mistakes he’s made moving to NoSQL. And learn with him as our database performance expert offers friendly guidance on how to use monitoring and performance tuning to get his sample Rust application on the right track. This webinar focuses on using monitoring and performance tuning to discover and correct mistakes that commonly occur when developers move from SQL to NoSQL. For example: - Common issues getting up and running with the monitoring stack - Using the CQL optimizations dashboard - Common issues causing high latency in a node - Common issues causing replica imbalance - What a healthy system looks like in terms of memory - Key metrics to keep an eye on This isn’t “Death-by-Powerpoint.” We’ll walk through problems encountered while migrating a real application from Postgres to ScyllaDB – and try to fix them live as well.

Optimizing NoSQL Performance Through Observability

ScyllaDB

The presentation underscores the strategic advantage of treating design systems not just as technical assets but as vital business components that require thoughtful management, robust planning, and strategic alignment with organizational goals. Key Points Covered: - Understanding Design Systems as Business Entities: Conceptualizing design systems as internal business entities can streamline their integration and evolution within a company. - Adoption and Expansion: Elaborating on the importance of tactical adoption across organizational structures, enhancing product suites to cater to user needs and broadening scope to mobile and content authoring solutions. - Data-Driven Development: Utilizing data insights for component development ensures that resources are allocated to create valuable, widely used features. - Financial Modeling for Design Systems: Developing sustainable funding models is crucial for long-term support and success of design systems. - Promoting Internal Buy-In: Stressing on strategies for promoting design systems within the organization to increase engagement and investment from internal stakeholders.

A Business-Centric Approach to Design System Strategy

UXDXConf

Agentic RAG What it is its types applications and implementation.pdf

ChristopherTHyatt

We're living the AI revolution and Salesforce is adapting and bring new value to their customers. Einstein products are evolving rapidly and navigating their limitations, language support, and use cases can be challenging. Let's make review of what Einstein product are available currently, what are the capabilities and what can be used for in CEE region and how Rossie.ai can help to learn Salesforce speak Czech. We will explore the Einstein roadmap and I will make a short live demo (based on your vote) of some Einstein feature.

AI revolution and Salesforce, Jiří Karpíšek

CzechDreamin

Here is something new! In our next Connector Corner webinar, we will demonstrate how you can use a single workflow to: Create a campaign using Mailchimp with merge tags/fields Send an interactive Slack channel message (using buttons) Have the message received by managers and peers along with a test email for review But there’s more: In a second workflow supporting the same use case, you’ll see: Your campaign sent to target colleagues for approval If the “Approve” button is clicked, a Jira/Zendesk ticket is created for the marketing design team But—if the “Reject” button is pushed, colleagues will be alerted via Slack message Join us to learn more about this new, human-in-the-loop capability, brought to you by Integration Service connectors. And... Speakers: Akshay Agnihotri, Product Manager Charlie Greenberg, Host

Connector Corner: Automate dynamic content and events by pushing a button

DianaGray10

Discover the essentials of performance testing in the IT sector with our concise guide. Learn about various testing types such as load, stress, endurance, spike, scalability, and volume testing. Understand key performance metrics like response time, throughput, CPU and memory utilization, and error rate. Explore top tools like Apache JMeter, LoadRunner, Gatling, Neoload, and BlazeMeter. Gain insights into best practices for defining objectives, creating realistic scenarios, automating tests, and optimizing performance to ensure user satisfaction, reliability, scalability, and cost efficiency. Ideal for developers, QA engineers, and IT professionals. Visit Expeed Software for more information. https://expeed.com/

In-Depth Performance Testing Guide for IT Professionals

Expeed Software

Recently uploaded (20)

UiPath Test Automation using UiPath Test Suite series, part 1

Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl

Custom Approval Process: A New Perspective, Pavel Hrbacek & Anindya Halder

Free and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade

IESVE for Early Stage Design and Planning

PLAI - Acceleration Program for Generative A.I. Startups

IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx

Transforming The New York Times: Empowering Evolution through UX

ODC, Data Fabric and Architecture User Group

Intelligent Gimbal FINAL PAPER Engineering.pdf

SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...

Exploring UiPath Orchestrator API: updates and limits in 2024 🚀

Structuring Teams and Portfolios for Success

Integrating Telephony Systems with Salesforce: Insights and Considerations, B...

Optimizing NoSQL Performance Through Observability

A Business-Centric Approach to Design System Strategy

Agentic RAG What it is its types applications and implementation.pdf

AI revolution and Salesforce, Jiří Karpíšek

Connector Corner: Automate dynamic content and events by pushing a button

In-Depth Performance Testing Guide for IT Professionals

Use Ionic Framework to develop mobile application

1. MILAN 20/21.11.2015 Use Ionic framework to develop mobile applications Lucio Grenzi

2. MILAN 20/21.11.2015 Who is this guy • Freelance • Front end web developer • Over 10 years of programming experience • Open source addicted • Github.com/dogwolf

3. MILAN 20/21.11.2015 - Grenzi Lucio Overview • Native vs Web vs Hybrid app • Ionic intro • Ionic CLI • UI Components • Demos

4. MILAN 20/21.11.2015 - Grenzi Lucio I want build a new app!

5. MILAN 20/21.11.2015 - Grenzi Lucio https://www.flickr.com/photos/johnjoh/448665548/

6. MILAN 20/21.11.2015 - Grenzi Lucio Native apps • More platform, more problem • Language is specific to platform => codebase separation • Dimisihing the return

7. MILAN 20/21.11.2015 - Grenzi Lucio Web apps Are website that looks like an app Run by a browser Native-like functionality in the browser

8. MILAN 20/21.11.2015 - Grenzi Lucio Hybrid apps • Embed HTML5 apps inside a thin native container • They can take advantage of the many device features available. • Single base code (HTML 5 + Css + Js)

9. MILAN 20/21.11.2015 - Grenzi Lucio Apache Cordova Open-source framework Run HTML/JavaScript based applications Native device functionality is exposed via JavaScript APIs Does not include UI Components

10. MILAN 20/21.11.2015 - Grenzi Lucio Cordova architecture https://blog.codecentric.de/en/2014/11/ionic- angularjs-framework-on-the-rise/

11. MILAN 20/21.11.2015 - Grenzi Lucio ngCordova collection of 70+ AngularJS extensions built on top of the Cordova API Made build, easy deploy, test Cordova apps http://ngcordova.com/

12. MILAN 20/21.11.2015 - Grenzi Lucio Ionic framework Build mobile apps faster with the web mobile you know and love

13. MILAN 20/21.11.2015 - Grenzi Lucio Modern web skills

14. MILAN 20/21.11.2015 - Grenzi Lucio Supported devices PlannedAndroid 4+IOS 6+

15. MILAN 20/21.11.2015 - Grenzi Lucio Ionic Architecture https://blog.codecentric.de/en/2014/11/ionic- angularjs-framework-on-the-rise/

16. MILAN 20/21.11.2015 - Grenzi Lucio Powered by AngularJs • develop rich and robust applications • create a powerful SDK • extend HTML vocabulary for your application • fully extensible

17. MILAN 20/21.11.2015 - Grenzi Lucio Sass • Give your app the appropriate look and feel • CSS can be quickly manipulated • Standalone CSS (indipendent of JS framework)

18. MILAN 20/21.11.2015 - Grenzi Lucio Ionic's adoption in numbers • Over 20.000 stars on GitHub (Top 40 project) • 600.000+ Ionic apps have been started from the CLI • Ionic CLI was downloaded 208.114 times in the last month • Released v1.0 on May 2015

19. MILAN 20/21.11.2015 - Grenzi Lucio How to get started

20. MILAN 20/21.11.2015 - Grenzi Lucio Install Ionic First install node.js Install Android ADT / iOS Xcode Open console and type $ npm install -g cordova ionic

21. MILAN 20/21.11.2015 - Grenzi Lucio Start a project $ ionic start iorun blank Comprehensive app structure Ready for deploy and building

22. MILAN 20/21.11.2015 - Grenzi Lucio Run it $ cd iorun $ ionic platform add android $ ionic build android $ ionic emulate android

23. MILAN 20/21.11.2015 - Grenzi Lucio Ionic built-in elements

24. MILAN 20/21.11.2015 - Grenzi Lucio List

25. MILAN 20/21.11.2015 - Grenzi Lucio Complex Lists

26. MILAN 20/21.11.2015 - Grenzi Lucio Collection repeat

27. MILAN 20/21.11.2015 - Grenzi Lucio Navigation

28. MILAN 20/21.11.2015 - Grenzi Lucio Tabs

29. MILAN 20/21.11.2015 - Grenzi Lucio Swipe menu'

30. MILAN 20/21.11.2015 - Grenzi Lucio Action sheet

31. MILAN 20/21.11.2015 - Grenzi Lucio Ionicons

32. MILAN 20/21.11.2015 - Grenzi Lucio Ionic box • Ready-to-go hybrid development environment for building mobile apps with Ionic, Cordova, and Android • https://github.com/driftyco/ionic-box

33. MILAN 20/21.11.2015 - Grenzi Lucio Choose your Android version Bootstrap.sh

34. MILAN 20/21.11.2015 - Grenzi Lucio Android version adoption https://developer.android.com/about/dashboards/index.html

35. MILAN 20/21.11.2015 - Grenzi Lucio

36. MILAN 20/21.11.2015 - Grenzi Lucio Ionic Lab

37. MILAN 20/21.11.2015 - Grenzi Lucio Ionic Creator

38. MILAN 20/21.11.2015 - Grenzi Lucio Ionic Market

39. MILAN 20/21.11.2015 - Grenzi Lucio Getting started guide ionicframework.com/getting-started Documentation ionicframework.com/docs Visit the Community Forum forum.ionicframework.com Contribute on GitHub github.com/driftyco/ionic

40. MILAN 20/21.11.2015 - Grenzi Lucio Questions? https://www.flickr.com/photos/derek_b/3046770021/

41. MILAN 20/21.11.2015 - Grenzi Lucio https://www.flickr.com/photos/wwworks/4759535950/

42. MILAN 20/21.11.2015 - SPEAKER’S NAME Leave your feedback on Joind.in! https://m.joind.in/event/codemotion-milan-2015

Use Ionic Framework to develop mobile application

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Use Ionic Framework to develop mobile application

Similar to Use Ionic Framework to develop mobile application (20)

More from Lucio Grenzi

More from Lucio Grenzi (13)

Recently uploaded

Recently uploaded (20)

Use Ionic Framework to develop mobile application