SlideShare a Scribd company logo
1 of 17
Download to read offline
Develop your Mobile App with Flutter and Joomla 4
Carlos Cámara
• Web developer

• Mastering Joomla and
PrestaShop

• 2 Mobile Apps published

• Spanish Podcaster at
MastermindJoomla.com 

• Twitter: @carcam

• Web:



www.hepta.es

www.joomladesigner.com
Roadmap
• A note about Sponsors

• About J4 API

• Introduction to Flutter

• Our
fi
rst App with Flutter

• Use Joomla as backend for our Flutter App
Really try them!!
Really try them!!
Really try them!!
About J4 API
Token authorization
Get Stuff
About Flutter
• Multiplatform development: Mobile devices (iOS, Android), Desktop
(MacOS, Windows, Linux), Web

• O
ffi
cial framework for Fuchsia

• Integrated with Code, Android Studio, Intellij, Emacs, Vim

• Works with his own graphic engine (Skia)

• Hot Reload

• Dart language

• Everything is a Widget

• Tons of 3rd party libraries developed by an awesome community
Flutter Web developers
• Dart is an evolution of JavaScript

• Flutter is inspired in web design

• Several layout Widgets and positioning inspired in Flexbox &
Grid

• Widgets are like block HTML elements (SPAN, DIV, UL,…) but a
bit more speci
fi
c

• It’s a great entry point to App development for Web developers

• Debugger similar to Firefox or Chrome developer tools
My 2 Apps
SourSativa App
Wheeltime App
References
• Joomla WebServices:

https://magazine.joomla.org/all-issues/august-2020/joomla-web-services-api-101-
tokens,-testing-and-a-taste-test

• https://hoppscotch.io

• Install Flutter:

https://docs.
fl
utter.dev/get-started/install

• Flutter for WebDevs:

https://docs.
fl
utter.dev/get-started/
fl
utter-for/web-devs

• Convert JSON in dart classes:

https://app.quicktype.io/

https://javiercbk.github.io/json_to_dart/

• Code of the demo App for this session

https://github.com/carcam/joomla_
fl
utter_jdayusa22
Extensions Code
• Awesome Flutter Snippets

https://marketplace.visualstudio.com/items?
itemName=Nash.awesome-
fl
utter-snippets

• Dart

https://marketplace.visualstudio.com/items?
itemName=Dart-Code.dart-code

• Flutter

https://marketplace.visualstudio.com/items?
itemName=Dart-Code.
fl
utter

More Related Content

Similar to Develop your Mobile app with Flutter and Joomla 4

2011 code camp
2011 code camp2011 code camp
2011 code campimranq2
 
Introduction to Cross Platform Development with Xamarin/ Visual Studio
Introduction to Cross Platform Development with Xamarin/ Visual StudioIntroduction to Cross Platform Development with Xamarin/ Visual Studio
Introduction to Cross Platform Development with Xamarin/ Visual StudioIndyMobileNetDev
 
Firefox OS Perspective
Firefox OS Perspective Firefox OS Perspective
Firefox OS Perspective ankitgadgil
 
PhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile HackPhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile HackPhoneGap
 
Getting Started with Cross-Platform Mobile Development with Flutter and Dart
Getting Started with Cross-Platform Mobile Development with Flutter and DartGetting Started with Cross-Platform Mobile Development with Flutter and Dart
Getting Started with Cross-Platform Mobile Development with Flutter and DartHarshith Keni
 
DroidCon Paris 2013 - Recap at the Mobile Innovations Dakar Meetup
DroidCon Paris 2013 - Recap at the Mobile Innovations Dakar MeetupDroidCon Paris 2013 - Recap at the Mobile Innovations Dakar Meetup
DroidCon Paris 2013 - Recap at the Mobile Innovations Dakar MeetupChristelle Scharff
 
Cross platform mobile application development
Cross platform mobile application developmentCross platform mobile application development
Cross platform mobile application developmentwebprogr.com
 
Hacking Saturday 2018-05 - flutter
Hacking Saturday 2018-05 - flutterHacking Saturday 2018-05 - flutter
Hacking Saturday 2018-05 - flutterWan Leung Wong
 
Synapse india reviews on mobile application development
Synapse india reviews on mobile application developmentSynapse india reviews on mobile application development
Synapse india reviews on mobile application developmentsaritasingh19866
 
Build html 5 apps for mobile
Build html 5 apps for mobileBuild html 5 apps for mobile
Build html 5 apps for mobileJoão Ferreira
 
360|Flex Recap - San Jose 2010
360|Flex Recap - San Jose 2010360|Flex Recap - San Jose 2010
360|Flex Recap - San Jose 2010David Ortinau
 
Hybrid mobile application with Ionic
Hybrid mobile application with IonicHybrid mobile application with Ionic
Hybrid mobile application with IonicMaulik Bamania
 
MobApp development 01 application platform.pptx
MobApp development 01 application platform.pptxMobApp development 01 application platform.pptx
MobApp development 01 application platform.pptxsanaiftikhar23
 
What Makes Flutter Ideal For Cross-Platform App Development - A Complete Guid...
What Makes Flutter Ideal For Cross-Platform App Development - A Complete Guid...What Makes Flutter Ideal For Cross-Platform App Development - A Complete Guid...
What Makes Flutter Ideal For Cross-Platform App Development - A Complete Guid...default default
 
Cross-platform Mobile Development on Open Source
Cross-platform Mobile Development on Open SourceCross-platform Mobile Development on Open Source
Cross-platform Mobile Development on Open SourceAll Things Open
 

Similar to Develop your Mobile app with Flutter and Joomla 4 (20)

Mobile app development
Mobile app development  Mobile app development
Mobile app development
 
Why Flutter.pdf
Why Flutter.pdfWhy Flutter.pdf
Why Flutter.pdf
 
What is Firefox OS
What is Firefox OSWhat is Firefox OS
What is Firefox OS
 
2011 code camp
2011 code camp2011 code camp
2011 code camp
 
Introduction to Cross Platform Development with Xamarin/ Visual Studio
Introduction to Cross Platform Development with Xamarin/ Visual StudioIntroduction to Cross Platform Development with Xamarin/ Visual Studio
Introduction to Cross Platform Development with Xamarin/ Visual Studio
 
Firefox OS Perspective
Firefox OS Perspective Firefox OS Perspective
Firefox OS Perspective
 
PhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile HackPhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile Hack
 
Firefox OS
Firefox OSFirefox OS
Firefox OS
 
Getting Started with Cross-Platform Mobile Development with Flutter and Dart
Getting Started with Cross-Platform Mobile Development with Flutter and DartGetting Started with Cross-Platform Mobile Development with Flutter and Dart
Getting Started with Cross-Platform Mobile Development with Flutter and Dart
 
DroidCon Paris 2013 - Recap at the Mobile Innovations Dakar Meetup
DroidCon Paris 2013 - Recap at the Mobile Innovations Dakar MeetupDroidCon Paris 2013 - Recap at the Mobile Innovations Dakar Meetup
DroidCon Paris 2013 - Recap at the Mobile Innovations Dakar Meetup
 
Cross platform mobile application development
Cross platform mobile application developmentCross platform mobile application development
Cross platform mobile application development
 
Hacking Saturday 2018-05 - flutter
Hacking Saturday 2018-05 - flutterHacking Saturday 2018-05 - flutter
Hacking Saturday 2018-05 - flutter
 
Synapse india reviews on mobile application development
Synapse india reviews on mobile application developmentSynapse india reviews on mobile application development
Synapse india reviews on mobile application development
 
Build html 5 apps for mobile
Build html 5 apps for mobileBuild html 5 apps for mobile
Build html 5 apps for mobile
 
DjangoSki
DjangoSkiDjangoSki
DjangoSki
 
360|Flex Recap - San Jose 2010
360|Flex Recap - San Jose 2010360|Flex Recap - San Jose 2010
360|Flex Recap - San Jose 2010
 
Hybrid mobile application with Ionic
Hybrid mobile application with IonicHybrid mobile application with Ionic
Hybrid mobile application with Ionic
 
MobApp development 01 application platform.pptx
MobApp development 01 application platform.pptxMobApp development 01 application platform.pptx
MobApp development 01 application platform.pptx
 
What Makes Flutter Ideal For Cross-Platform App Development - A Complete Guid...
What Makes Flutter Ideal For Cross-Platform App Development - A Complete Guid...What Makes Flutter Ideal For Cross-Platform App Development - A Complete Guid...
What Makes Flutter Ideal For Cross-Platform App Development - A Complete Guid...
 
Cross-platform Mobile Development on Open Source
Cross-platform Mobile Development on Open SourceCross-platform Mobile Development on Open Source
Cross-platform Mobile Development on Open Source
 

More from Carlos M. Cámara

Venta por valor de una web joomla
Venta por valor de una web joomlaVenta por valor de una web joomla
Venta por valor de una web joomlaCarlos M. Cámara
 
WebServices y automatizaciones en PrestaShop
WebServices y automatizaciones en PrestaShopWebServices y automatizaciones en PrestaShop
WebServices y automatizaciones en PrestaShopCarlos M. Cámara
 
Un sitio superrápido con joomla!
Un sitio superrápido con joomla!Un sitio superrápido con joomla!
Un sitio superrápido con joomla!Carlos M. Cámara
 
Los mejores trucos para aumentar la velocidad en joomla!
Los mejores trucos para aumentar la velocidad en joomla!Los mejores trucos para aumentar la velocidad en joomla!
Los mejores trucos para aumentar la velocidad en joomla!Carlos M. Cámara
 
Joomla! en 10 minutos - JoomlaDay Sevilla 2015
Joomla! en 10 minutos  - JoomlaDay Sevilla 2015Joomla! en 10 minutos  - JoomlaDay Sevilla 2015
Joomla! en 10 minutos - JoomlaDay Sevilla 2015Carlos M. Cámara
 
Building a complete conference or event site
Building a complete conference or event siteBuilding a complete conference or event site
Building a complete conference or event siteCarlos M. Cámara
 
Gestión de eventos en Joomla con JEvents
Gestión de eventos en Joomla con JEventsGestión de eventos en Joomla con JEvents
Gestión de eventos en Joomla con JEventsCarlos M. Cámara
 
Taller de Jevents del Joomla! Day Spain 2012
Taller de Jevents del Joomla! Day Spain 2012Taller de Jevents del Joomla! Day Spain 2012
Taller de Jevents del Joomla! Day Spain 2012Carlos M. Cámara
 
Plataforma de sensores Bio Mems basada en Cantilevers
Plataforma de sensores Bio Mems basada en CantileversPlataforma de sensores Bio Mems basada en Cantilevers
Plataforma de sensores Bio Mems basada en CantileversCarlos M. Cámara
 
Sistemas Empotrados: Android
Sistemas Empotrados: AndroidSistemas Empotrados: Android
Sistemas Empotrados: AndroidCarlos M. Cámara
 
Presentación Linux en Tiempo Real
Presentación Linux en Tiempo RealPresentación Linux en Tiempo Real
Presentación Linux en Tiempo RealCarlos M. Cámara
 

More from Carlos M. Cámara (16)

Introducción a GTD
Introducción a GTDIntroducción a GTD
Introducción a GTD
 
Venta por valor de una web joomla
Venta por valor de una web joomlaVenta por valor de una web joomla
Venta por valor de una web joomla
 
WebServices y automatizaciones en PrestaShop
WebServices y automatizaciones en PrestaShopWebServices y automatizaciones en PrestaShop
WebServices y automatizaciones en PrestaShop
 
Un sitio superrápido con joomla!
Un sitio superrápido con joomla!Un sitio superrápido con joomla!
Un sitio superrápido con joomla!
 
Los mejores trucos para aumentar la velocidad en joomla!
Los mejores trucos para aumentar la velocidad en joomla!Los mejores trucos para aumentar la velocidad en joomla!
Los mejores trucos para aumentar la velocidad en joomla!
 
Joomla! en 10 minutos - JoomlaDay Sevilla 2015
Joomla! en 10 minutos  - JoomlaDay Sevilla 2015Joomla! en 10 minutos  - JoomlaDay Sevilla 2015
Joomla! en 10 minutos - JoomlaDay Sevilla 2015
 
Building a complete conference or event site
Building a complete conference or event siteBuilding a complete conference or event site
Building a complete conference or event site
 
Gestión de eventos en Joomla con JEvents
Gestión de eventos en Joomla con JEventsGestión de eventos en Joomla con JEvents
Gestión de eventos en Joomla con JEvents
 
Taller de Jevents del Joomla! Day Spain 2012
Taller de Jevents del Joomla! Day Spain 2012Taller de Jevents del Joomla! Day Spain 2012
Taller de Jevents del Joomla! Day Spain 2012
 
Resumen Beca Leonardo
Resumen Beca LeonardoResumen Beca Leonardo
Resumen Beca Leonardo
 
Plataforma de sensores Bio Mems basada en Cantilevers
Plataforma de sensores Bio Mems basada en CantileversPlataforma de sensores Bio Mems basada en Cantilevers
Plataforma de sensores Bio Mems basada en Cantilevers
 
Sistemas Empotrados: Android
Sistemas Empotrados: AndroidSistemas Empotrados: Android
Sistemas Empotrados: Android
 
Duffy Boats Fuel Cells
Duffy Boats Fuel CellsDuffy Boats Fuel Cells
Duffy Boats Fuel Cells
 
Presentación Linux en Tiempo Real
Presentación Linux en Tiempo RealPresentación Linux en Tiempo Real
Presentación Linux en Tiempo Real
 
Evolucion imagenes medicina
Evolucion imagenes medicinaEvolucion imagenes medicina
Evolucion imagenes medicina
 
Ingenieros
IngenierosIngenieros
Ingenieros
 

Recently uploaded

Enhancing Supply Chain Visibility with Cargo Cloud Solutions.pdf
Enhancing Supply Chain Visibility with Cargo Cloud Solutions.pdfEnhancing Supply Chain Visibility with Cargo Cloud Solutions.pdf
Enhancing Supply Chain Visibility with Cargo Cloud Solutions.pdfRTS corp
 
Zer0con 2024 final share short version.pdf
Zer0con 2024 final share short version.pdfZer0con 2024 final share short version.pdf
Zer0con 2024 final share short version.pdfmaor17
 
oracle 23c new features for developer and dba
oracle 23c new features for developer and dbaoracle 23c new features for developer and dba
oracle 23c new features for developer and dbaRemote DBA Services
 
Strategies for using alternative queries to mitigate zero results
Strategies for using alternative queries to mitigate zero resultsStrategies for using alternative queries to mitigate zero results
Strategies for using alternative queries to mitigate zero resultsJean Silva
 
Revolutionizing the Digital Transformation Office - Leveraging OnePlan’s AI a...
Revolutionizing the Digital Transformation Office - Leveraging OnePlan’s AI a...Revolutionizing the Digital Transformation Office - Leveraging OnePlan’s AI a...
Revolutionizing the Digital Transformation Office - Leveraging OnePlan’s AI a...OnePlan Solutions
 
Osi security architecture in network.pptx
Osi security architecture in network.pptxOsi security architecture in network.pptx
Osi security architecture in network.pptxVinzoCenzo
 
Key Steps in Agile Software Delivery Roadmap
Key Steps in Agile Software Delivery RoadmapKey Steps in Agile Software Delivery Roadmap
Key Steps in Agile Software Delivery RoadmapIshara Amarasekera
 
Understanding Plagiarism: Causes, Consequences and Prevention.pptx
Understanding Plagiarism: Causes, Consequences and Prevention.pptxUnderstanding Plagiarism: Causes, Consequences and Prevention.pptx
Understanding Plagiarism: Causes, Consequences and Prevention.pptxSasikiranMarri
 
Transform your Corporate Strategy Office - Harness OnePlan’s Strategic Portfo...
Transform your Corporate Strategy Office - Harness OnePlan’s Strategic Portfo...Transform your Corporate Strategy Office - Harness OnePlan’s Strategic Portfo...
Transform your Corporate Strategy Office - Harness OnePlan’s Strategic Portfo...OnePlan Solutions
 
Tech Tuesday Slides - Introduction to Project Management with OnePlan's Work ...
Tech Tuesday Slides - Introduction to Project Management with OnePlan's Work ...Tech Tuesday Slides - Introduction to Project Management with OnePlan's Work ...
Tech Tuesday Slides - Introduction to Project Management with OnePlan's Work ...OnePlan Solutions
 
Pros and Cons of Selenium In Automation Testing_ A Comprehensive Assessment.pdf
Pros and Cons of Selenium In Automation Testing_ A Comprehensive Assessment.pdfPros and Cons of Selenium In Automation Testing_ A Comprehensive Assessment.pdf
Pros and Cons of Selenium In Automation Testing_ A Comprehensive Assessment.pdfkalichargn70th171
 
What is Mendix and the concept of low-code development.docx
What is Mendix and the concept of low-code development.docxWhat is Mendix and the concept of low-code development.docx
What is Mendix and the concept of low-code development.docxTechnogeeks
 
GraphSummit Madrid - Product Vision and Roadmap - Luis Salvador Neo4j
GraphSummit Madrid - Product Vision and Roadmap - Luis Salvador Neo4jGraphSummit Madrid - Product Vision and Roadmap - Luis Salvador Neo4j
GraphSummit Madrid - Product Vision and Roadmap - Luis Salvador Neo4jNeo4j
 
Ronisha Informatics Private Limited Catalogue
Ronisha Informatics Private Limited CatalogueRonisha Informatics Private Limited Catalogue
Ronisha Informatics Private Limited Catalogueitservices996
 
JavaLand 2024 - Going serverless with Quarkus GraalVM native images and AWS L...
JavaLand 2024 - Going serverless with Quarkus GraalVM native images and AWS L...JavaLand 2024 - Going serverless with Quarkus GraalVM native images and AWS L...
JavaLand 2024 - Going serverless with Quarkus GraalVM native images and AWS L...Bert Jan Schrijver
 
VictoriaMetrics Q1 Meet Up '24 - Community & News Update
VictoriaMetrics Q1 Meet Up '24 - Community & News UpdateVictoriaMetrics Q1 Meet Up '24 - Community & News Update
VictoriaMetrics Q1 Meet Up '24 - Community & News UpdateVictoriaMetrics
 
SAM Training Session - How to use EXCEL ?
SAM Training Session - How to use EXCEL ?SAM Training Session - How to use EXCEL ?
SAM Training Session - How to use EXCEL ?Alexandre Beguel
 
[ CNCF Q1 2024 ] Intro to Continuous Profiling and Grafana Pyroscope.pdf
[ CNCF Q1 2024 ] Intro to Continuous Profiling and Grafana Pyroscope.pdf[ CNCF Q1 2024 ] Intro to Continuous Profiling and Grafana Pyroscope.pdf
[ CNCF Q1 2024 ] Intro to Continuous Profiling and Grafana Pyroscope.pdfSteve Caron
 
The Ultimate Guide to Performance Testing in Low-Code, No-Code Environments (...
The Ultimate Guide to Performance Testing in Low-Code, No-Code Environments (...The Ultimate Guide to Performance Testing in Low-Code, No-Code Environments (...
The Ultimate Guide to Performance Testing in Low-Code, No-Code Environments (...kalichargn70th171
 
2024 DevNexus Patterns for Resiliency: Shuffle shards
2024 DevNexus Patterns for Resiliency: Shuffle shards2024 DevNexus Patterns for Resiliency: Shuffle shards
2024 DevNexus Patterns for Resiliency: Shuffle shardsChristopher Curtin
 

Recently uploaded (20)

Enhancing Supply Chain Visibility with Cargo Cloud Solutions.pdf
Enhancing Supply Chain Visibility with Cargo Cloud Solutions.pdfEnhancing Supply Chain Visibility with Cargo Cloud Solutions.pdf
Enhancing Supply Chain Visibility with Cargo Cloud Solutions.pdf
 
Zer0con 2024 final share short version.pdf
Zer0con 2024 final share short version.pdfZer0con 2024 final share short version.pdf
Zer0con 2024 final share short version.pdf
 
oracle 23c new features for developer and dba
oracle 23c new features for developer and dbaoracle 23c new features for developer and dba
oracle 23c new features for developer and dba
 
Strategies for using alternative queries to mitigate zero results
Strategies for using alternative queries to mitigate zero resultsStrategies for using alternative queries to mitigate zero results
Strategies for using alternative queries to mitigate zero results
 
Revolutionizing the Digital Transformation Office - Leveraging OnePlan’s AI a...
Revolutionizing the Digital Transformation Office - Leveraging OnePlan’s AI a...Revolutionizing the Digital Transformation Office - Leveraging OnePlan’s AI a...
Revolutionizing the Digital Transformation Office - Leveraging OnePlan’s AI a...
 
Osi security architecture in network.pptx
Osi security architecture in network.pptxOsi security architecture in network.pptx
Osi security architecture in network.pptx
 
Key Steps in Agile Software Delivery Roadmap
Key Steps in Agile Software Delivery RoadmapKey Steps in Agile Software Delivery Roadmap
Key Steps in Agile Software Delivery Roadmap
 
Understanding Plagiarism: Causes, Consequences and Prevention.pptx
Understanding Plagiarism: Causes, Consequences and Prevention.pptxUnderstanding Plagiarism: Causes, Consequences and Prevention.pptx
Understanding Plagiarism: Causes, Consequences and Prevention.pptx
 
Transform your Corporate Strategy Office - Harness OnePlan’s Strategic Portfo...
Transform your Corporate Strategy Office - Harness OnePlan’s Strategic Portfo...Transform your Corporate Strategy Office - Harness OnePlan’s Strategic Portfo...
Transform your Corporate Strategy Office - Harness OnePlan’s Strategic Portfo...
 
Tech Tuesday Slides - Introduction to Project Management with OnePlan's Work ...
Tech Tuesday Slides - Introduction to Project Management with OnePlan's Work ...Tech Tuesday Slides - Introduction to Project Management with OnePlan's Work ...
Tech Tuesday Slides - Introduction to Project Management with OnePlan's Work ...
 
Pros and Cons of Selenium In Automation Testing_ A Comprehensive Assessment.pdf
Pros and Cons of Selenium In Automation Testing_ A Comprehensive Assessment.pdfPros and Cons of Selenium In Automation Testing_ A Comprehensive Assessment.pdf
Pros and Cons of Selenium In Automation Testing_ A Comprehensive Assessment.pdf
 
What is Mendix and the concept of low-code development.docx
What is Mendix and the concept of low-code development.docxWhat is Mendix and the concept of low-code development.docx
What is Mendix and the concept of low-code development.docx
 
GraphSummit Madrid - Product Vision and Roadmap - Luis Salvador Neo4j
GraphSummit Madrid - Product Vision and Roadmap - Luis Salvador Neo4jGraphSummit Madrid - Product Vision and Roadmap - Luis Salvador Neo4j
GraphSummit Madrid - Product Vision and Roadmap - Luis Salvador Neo4j
 
Ronisha Informatics Private Limited Catalogue
Ronisha Informatics Private Limited CatalogueRonisha Informatics Private Limited Catalogue
Ronisha Informatics Private Limited Catalogue
 
JavaLand 2024 - Going serverless with Quarkus GraalVM native images and AWS L...
JavaLand 2024 - Going serverless with Quarkus GraalVM native images and AWS L...JavaLand 2024 - Going serverless with Quarkus GraalVM native images and AWS L...
JavaLand 2024 - Going serverless with Quarkus GraalVM native images and AWS L...
 
VictoriaMetrics Q1 Meet Up '24 - Community & News Update
VictoriaMetrics Q1 Meet Up '24 - Community & News UpdateVictoriaMetrics Q1 Meet Up '24 - Community & News Update
VictoriaMetrics Q1 Meet Up '24 - Community & News Update
 
SAM Training Session - How to use EXCEL ?
SAM Training Session - How to use EXCEL ?SAM Training Session - How to use EXCEL ?
SAM Training Session - How to use EXCEL ?
 
[ CNCF Q1 2024 ] Intro to Continuous Profiling and Grafana Pyroscope.pdf
[ CNCF Q1 2024 ] Intro to Continuous Profiling and Grafana Pyroscope.pdf[ CNCF Q1 2024 ] Intro to Continuous Profiling and Grafana Pyroscope.pdf
[ CNCF Q1 2024 ] Intro to Continuous Profiling and Grafana Pyroscope.pdf
 
The Ultimate Guide to Performance Testing in Low-Code, No-Code Environments (...
The Ultimate Guide to Performance Testing in Low-Code, No-Code Environments (...The Ultimate Guide to Performance Testing in Low-Code, No-Code Environments (...
The Ultimate Guide to Performance Testing in Low-Code, No-Code Environments (...
 
2024 DevNexus Patterns for Resiliency: Shuffle shards
2024 DevNexus Patterns for Resiliency: Shuffle shards2024 DevNexus Patterns for Resiliency: Shuffle shards
2024 DevNexus Patterns for Resiliency: Shuffle shards
 

Develop your Mobile app with Flutter and Joomla 4

  • 1. Develop your Mobile App with Flutter and Joomla 4
  • 2. Carlos Cámara • Web developer • Mastering Joomla and PrestaShop • 2 Mobile Apps published • Spanish Podcaster at MastermindJoomla.com • Twitter: @carcam • Web:
 
 www.hepta.es
 www.joomladesigner.com
  • 3. Roadmap • A note about Sponsors • About J4 API • Introduction to Flutter • Our fi rst App with Flutter • Use Joomla as backend for our Flutter App
  • 10. About Flutter • Multiplatform development: Mobile devices (iOS, Android), Desktop (MacOS, Windows, Linux), Web • O ffi cial framework for Fuchsia • Integrated with Code, Android Studio, Intellij, Emacs, Vim • Works with his own graphic engine (Skia) • Hot Reload • Dart language • Everything is a Widget • Tons of 3rd party libraries developed by an awesome community
  • 11. Flutter Web developers • Dart is an evolution of JavaScript • Flutter is inspired in web design • Several layout Widgets and positioning inspired in Flexbox & Grid • Widgets are like block HTML elements (SPAN, DIV, UL,…) but a bit more speci fi c • It’s a great entry point to App development for Web developers • Debugger similar to Firefox or Chrome developer tools
  • 15.
  • 16. References • Joomla WebServices:
 https://magazine.joomla.org/all-issues/august-2020/joomla-web-services-api-101- tokens,-testing-and-a-taste-test • https://hoppscotch.io • Install Flutter:
 https://docs. fl utter.dev/get-started/install • Flutter for WebDevs:
 https://docs. fl utter.dev/get-started/ fl utter-for/web-devs • Convert JSON in dart classes:
 https://app.quicktype.io/
 https://javiercbk.github.io/json_to_dart/ • Code of the demo App for this session
 https://github.com/carcam/joomla_ fl utter_jdayusa22
  • 17. Extensions Code • Awesome Flutter Snippets
 https://marketplace.visualstudio.com/items? itemName=Nash.awesome- fl utter-snippets • Dart
 https://marketplace.visualstudio.com/items? itemName=Dart-Code.dart-code • Flutter
 https://marketplace.visualstudio.com/items? itemName=Dart-Code. fl utter