SlideShare a Scribd company logo

Modeling on the Web

Modeling Software on the browser provides great benefits like zero deployment and multi-device. However providing modeling infrastructure on the browser require entering in the JavaScript world to create all the infrastructure needed. In this talk, such infrastructure for textual, projectional and diagram DSLs are discused. Session presented at Code Generation 2014.

1 of 55
Download to read offline
Modeling on the Web
Pedro J. Molina, Ahmed Negm, Ruben Jiménez
@pmolinam @anegm81 @rubenjmarrufo
@icinetic
Icinetic
• We do MDSD Tools for Developers, Citizen Developers & End-Users
• HQ in Seville, Spain, EU
• Offices in San Francisco, Seattle, Cairo, Seville & Madrid
http://www.icinetic.com/
If I want to jump, but I am not trained
What can I do?
Question?
A1: Lower the bar
Question?
A2: Use High-Tech
Question?
Creating applications is getting more and more
complex:
Technologies, frameworks, versions, dependencies, different
screen sizes and aspect ratios, incompatible API &
vendors, platform fragmentation…
How we can help as the MDE community?
Why the metaphor?

Recommended

Modeling and Code Generation in the Cloud for Citizen Developers and Beyond
Modeling and Code Generation in the Cloud for Citizen Developers and BeyondModeling and Code Generation in the Cloud for Citizen Developers and Beyond
Modeling and Code Generation in the Cloud for Citizen Developers and BeyondPedro J. Molina
 
CG2010 Tailored Code Generators
CG2010 Tailored Code GeneratorsCG2010 Tailored Code Generators
CG2010 Tailored Code GeneratorsPedro J. Molina
 
Multichannel User Interfaces
Multichannel User InterfacesMultichannel User Interfaces
Multichannel User InterfacesPedro J. Molina
 
Web technologies: Model Driven Engineering
Web technologies: Model Driven EngineeringWeb technologies: Model Driven Engineering
Web technologies: Model Driven EngineeringPiero Fraternali
 
Low-code vs Model-Driven Engineering
Low-code vs Model-Driven EngineeringLow-code vs Model-Driven Engineering
Low-code vs Model-Driven EngineeringJordi Cabot
 
Agile and Modeling / MDE : friends or foes? (Agile Tour Nantes 2010)
Agile and Modeling / MDE : friends or foes? (Agile Tour  Nantes 2010)Agile and Modeling / MDE : friends or foes? (Agile Tour  Nantes 2010)
Agile and Modeling / MDE : friends or foes? (Agile Tour Nantes 2010)Jordi Cabot
 
The Language of Application Architecture
The Language of Application ArchitectureThe Language of Application Architecture
The Language of Application ArchitectureBrad Beiermann
 
How to Speak the Language of Application Architecture
How to Speak the Language of Application ArchitectureHow to Speak the Language of Application Architecture
How to Speak the Language of Application ArchitectureBrad Beiermann
 

More Related Content

What's hot

Native vs cross platform vs html5
Native vs cross platform vs html5Native vs cross platform vs html5
Native vs cross platform vs html5Naga Harish M
 
CURRICULUM VITAE
CURRICULUM VITAECURRICULUM VITAE
CURRICULUM VITAEVicky Kumar
 
Discrete Event Simulation, CASE tool built using C#
Discrete Event Simulation, CASE tool built using C#Discrete Event Simulation, CASE tool built using C#
Discrete Event Simulation, CASE tool built using C#Ron Perlmuter
 
Developing and-benchmarking-native-linux-applications-on-android
Developing and-benchmarking-native-linux-applications-on-androidDeveloping and-benchmarking-native-linux-applications-on-android
Developing and-benchmarking-native-linux-applications-on-androidElvis Jon Freddy Sitinjak
 
How to sustain a tool building community-driven effort
How to sustain a tool building community-driven effortHow to sustain a tool building community-driven effort
How to sustain a tool building community-driven effortJordi Cabot
 
视觉效果制作行业的工业语言——Python
视觉效果制作行业的工业语言——Python视觉效果制作行业的工业语言——Python
视觉效果制作行业的工业语言——PythonWill Zhou
 
Latest_Edwin_Alberto_Arias_Espinoza
Latest_Edwin_Alberto_Arias_EspinozaLatest_Edwin_Alberto_Arias_Espinoza
Latest_Edwin_Alberto_Arias_EspinozaEdwin Espinoza
 
Technical Architect on Embedded System.
Technical Architect on Embedded System.Technical Architect on Embedded System.
Technical Architect on Embedded System.Prasad Roy Raju
 
Ashutosh jaimini resume
Ashutosh jaimini resumeAshutosh jaimini resume
Ashutosh jaimini resumerit2007062
 
Introduction to c_sharp
Introduction to c_sharpIntroduction to c_sharp
Introduction to c_sharpJayanta Basak
 
Resume for Ladan Jamali
Resume for Ladan JamaliResume for Ladan Jamali
Resume for Ladan JamaliLadan Jamali
 
Leverage the power of machine learning on windows
Leverage the power of machine learning on windowsLeverage the power of machine learning on windows
Leverage the power of machine learning on windowsMia Chang
 
Code and Conquer with Globe Labs, October 27, 2012
Code and Conquer with Globe Labs, October 27, 2012Code and Conquer with Globe Labs, October 27, 2012
Code and Conquer with Globe Labs, October 27, 2012jobandesther
 

What's hot (18)

Native vs cross platform vs html5
Native vs cross platform vs html5Native vs cross platform vs html5
Native vs cross platform vs html5
 
CURRICULUM VITAE
CURRICULUM VITAECURRICULUM VITAE
CURRICULUM VITAE
 
Discrete Event Simulation, CASE tool built using C#
Discrete Event Simulation, CASE tool built using C#Discrete Event Simulation, CASE tool built using C#
Discrete Event Simulation, CASE tool built using C#
 
Developing and-benchmarking-native-linux-applications-on-android
Developing and-benchmarking-native-linux-applications-on-androidDeveloping and-benchmarking-native-linux-applications-on-android
Developing and-benchmarking-native-linux-applications-on-android
 
Sunil Kumar Sarvepalli
Sunil Kumar SarvepalliSunil Kumar Sarvepalli
Sunil Kumar Sarvepalli
 
How to sustain a tool building community-driven effort
How to sustain a tool building community-driven effortHow to sustain a tool building community-driven effort
How to sustain a tool building community-driven effort
 
DishitJoshi_CV
DishitJoshi_CVDishitJoshi_CV
DishitJoshi_CV
 
视觉效果制作行业的工业语言——Python
视觉效果制作行业的工业语言——Python视觉效果制作行业的工业语言——Python
视觉效果制作行业的工业语言——Python
 
Latest_Edwin_Alberto_Arias_Espinoza
Latest_Edwin_Alberto_Arias_EspinozaLatest_Edwin_Alberto_Arias_Espinoza
Latest_Edwin_Alberto_Arias_Espinoza
 
AlekyaNyalakonda_Resume
AlekyaNyalakonda_ResumeAlekyaNyalakonda_Resume
AlekyaNyalakonda_Resume
 
Nishit Naik
Nishit NaikNishit Naik
Nishit Naik
 
Technical Architect on Embedded System.
Technical Architect on Embedded System.Technical Architect on Embedded System.
Technical Architect on Embedded System.
 
Ashutosh jaimini resume
Ashutosh jaimini resumeAshutosh jaimini resume
Ashutosh jaimini resume
 
Introduction to c_sharp
Introduction to c_sharpIntroduction to c_sharp
Introduction to c_sharp
 
Resume for Ladan Jamali
Resume for Ladan JamaliResume for Ladan Jamali
Resume for Ladan Jamali
 
01 the big_idea
01 the big_idea01 the big_idea
01 the big_idea
 
Leverage the power of machine learning on windows
Leverage the power of machine learning on windowsLeverage the power of machine learning on windows
Leverage the power of machine learning on windows
 
Code and Conquer with Globe Labs, October 27, 2012
Code and Conquer with Globe Labs, October 27, 2012Code and Conquer with Globe Labs, October 27, 2012
Code and Conquer with Globe Labs, October 27, 2012
 

Viewers also liked

SVQDC 2017 Tecnologías para Microservicios
SVQDC 2017 Tecnologías para MicroserviciosSVQDC 2017 Tecnologías para Microservicios
SVQDC 2017 Tecnologías para MicroserviciosPedro J. Molina
 
Mission: Impossible --- Purely declarative User Interface Modeling
Mission: Impossible --- Purely declarative User Interface ModelingMission: Impossible --- Purely declarative User Interface Modeling
Mission: Impossible --- Purely declarative User Interface Modelingademelt
 
Transforming a 15 year old model-driven application from C++ to Java
Transforming a 15 year old model-driven application from C++ to JavaTransforming a 15 year old model-driven application from C++ to Java
Transforming a 15 year old model-driven application from C++ to JavaEric Malotaux
 
Multichannel User Interfaces
Multichannel User InterfacesMultichannel User Interfaces
Multichannel User InterfacesIcinetic
 
Modelling and code generation in .NET at Icinetic
Modelling and code generation in .NET at IcineticModelling and code generation in .NET at Icinetic
Modelling and code generation in .NET at IcineticPedro J. Molina
 
Introducción a StackOverflow
Introducción a StackOverflowIntroducción a StackOverflow
Introducción a StackOverflowPedro J. Molina
 
Hivepod: Casos de uso en OpenData
Hivepod: Casos de uso en OpenDataHivepod: Casos de uso en OpenData
Hivepod: Casos de uso en OpenDataPedro J. Molina
 
Scaling MDD for production: enabling SoC at model time
Scaling MDD for production: enabling SoC at model timeScaling MDD for production: enabling SoC at model time
Scaling MDD for production: enabling SoC at model timePedro J. Molina
 
MDD: Models, frameworks, & code generation
MDD: Models, frameworks, & code generationMDD: Models, frameworks, & code generation
MDD: Models, frameworks, & code generationPedro J. Molina
 
Microservicios sobre MEAN Stack
Microservicios sobre MEAN StackMicroservicios sobre MEAN Stack
Microservicios sobre MEAN StackPedro J. Molina
 
Tecnologías para microservicios
Tecnologías para microserviciosTecnologías para microservicios
Tecnologías para microserviciosPedro J. Molina
 
Modelling the User Interface
Modelling the User InterfaceModelling the User Interface
Modelling the User InterfacePedro J. Molina
 
Code Generation for Conceptual User Interface Patterns
Code Generation for Conceptual User Interface PatternsCode Generation for Conceptual User Interface Patterns
Code Generation for Conceptual User Interface PatternsPedro J. Molina
 
The PISA Project: a MDD case study
The PISA Project: a MDD case studyThe PISA Project: a MDD case study
The PISA Project: a MDD case studyPedro J. Molina
 
Opensouthcode: Microservicios sobre MEAN Stack
Opensouthcode: Microservicios sobre MEAN StackOpensouthcode: Microservicios sobre MEAN Stack
Opensouthcode: Microservicios sobre MEAN StackPedro J. Molina
 
Experiences and requirements for a User Interaction Modeling Language
Experiences and requirements for a User Interaction Modeling LanguageExperiences and requirements for a User Interaction Modeling Language
Experiences and requirements for a User Interaction Modeling LanguageMarco Brambilla
 
Modelling and code generation in .NET at Icinetic
Modelling and code generation in .NET at IcineticModelling and code generation in .NET at Icinetic
Modelling and code generation in .NET at IcineticIcinetic
 

Viewers also liked (20)

SVQDC 2017 Tecnologías para Microservicios
SVQDC 2017 Tecnologías para MicroserviciosSVQDC 2017 Tecnologías para Microservicios
SVQDC 2017 Tecnologías para Microservicios
 
Mission: Impossible --- Purely declarative User Interface Modeling
Mission: Impossible --- Purely declarative User Interface ModelingMission: Impossible --- Purely declarative User Interface Modeling
Mission: Impossible --- Purely declarative User Interface Modeling
 
Transforming a 15 year old model-driven application from C++ to Java
Transforming a 15 year old model-driven application from C++ to JavaTransforming a 15 year old model-driven application from C++ to Java
Transforming a 15 year old model-driven application from C++ to Java
 
Multichannel User Interfaces
Multichannel User InterfacesMultichannel User Interfaces
Multichannel User Interfaces
 
Modelling and code generation in .NET at Icinetic
Modelling and code generation in .NET at IcineticModelling and code generation in .NET at Icinetic
Modelling and code generation in .NET at Icinetic
 
Introducción a StackOverflow
Introducción a StackOverflowIntroducción a StackOverflow
Introducción a StackOverflow
 
TDD+CI con Teamcity
TDD+CI con TeamcityTDD+CI con Teamcity
TDD+CI con Teamcity
 
Hivepod: Casos de uso en OpenData
Hivepod: Casos de uso en OpenDataHivepod: Casos de uso en OpenData
Hivepod: Casos de uso en OpenData
 
Scaling MDD for production: enabling SoC at model time
Scaling MDD for production: enabling SoC at model timeScaling MDD for production: enabling SoC at model time
Scaling MDD for production: enabling SoC at model time
 
MDD: Models, frameworks, & code generation
MDD: Models, frameworks, & code generationMDD: Models, frameworks, & code generation
MDD: Models, frameworks, & code generation
 
Microservicios sobre MEAN Stack
Microservicios sobre MEAN StackMicroservicios sobre MEAN Stack
Microservicios sobre MEAN Stack
 
Tecnologías para microservicios
Tecnologías para microserviciosTecnologías para microservicios
Tecnologías para microservicios
 
Modelling the User Interface
Modelling the User InterfaceModelling the User Interface
Modelling the User Interface
 
Code Generation for Conceptual User Interface Patterns
Code Generation for Conceptual User Interface PatternsCode Generation for Conceptual User Interface Patterns
Code Generation for Conceptual User Interface Patterns
 
The PISA Project: a MDD case study
The PISA Project: a MDD case studyThe PISA Project: a MDD case study
The PISA Project: a MDD case study
 
Opensouthcode: Microservicios sobre MEAN Stack
Opensouthcode: Microservicios sobre MEAN StackOpensouthcode: Microservicios sobre MEAN Stack
Opensouthcode: Microservicios sobre MEAN Stack
 
Experiences and requirements for a User Interaction Modeling Language
Experiences and requirements for a User Interaction Modeling LanguageExperiences and requirements for a User Interaction Modeling Language
Experiences and requirements for a User Interaction Modeling Language
 
Modelling and code generation in .NET at Icinetic
Modelling and code generation in .NET at IcineticModelling and code generation in .NET at Icinetic
Modelling and code generation in .NET at Icinetic
 
Introducción a Angular
Introducción a AngularIntroducción a Angular
Introducción a Angular
 
CG2010 Introducing MDSD
CG2010 Introducing MDSDCG2010 Introducing MDSD
CG2010 Introducing MDSD
 

Similar to Modeling on the Web

Synapse india reviews on android application
Synapse india reviews on android applicationSynapse india reviews on android application
Synapse india reviews on android applicationsaritasingh19866
 
ABSE and AtomWeaver : A Quantum Leap in Software Development
ABSE and AtomWeaver : A Quantum Leap in Software DevelopmentABSE and AtomWeaver : A Quantum Leap in Software Development
ABSE and AtomWeaver : A Quantum Leap in Software DevelopmentRui Curado
 
Meetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech PeopleMeetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech PeopleIT Arena
 
MyAppConverter DroidconUK 2014
MyAppConverter DroidconUK 2014MyAppConverter DroidconUK 2014
MyAppConverter DroidconUK 2014myappconverter
 
Domain Driven Design Big Picture Strategic Patterns
Domain Driven Design Big Picture Strategic PatternsDomain Driven Design Big Picture Strategic Patterns
Domain Driven Design Big Picture Strategic PatternsMark Windholtz
 
Domain specific modelling (DSM)
Domain specific modelling (DSM)Domain specific modelling (DSM)
Domain specific modelling (DSM)PG Scholar
 
Is the Browser a Transitional Technology?
Is the Browser a Transitional Technology?Is the Browser a Transitional Technology?
Is the Browser a Transitional Technology?Allen Wirfs-Brock
 
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...Heiko Voigt
 
Enhancing and modifying_the_core_android_os
Enhancing and modifying_the_core_android_osEnhancing and modifying_the_core_android_os
Enhancing and modifying_the_core_android_osArnav Gupta
 
Mobility today & what's next. Application ecosystems.
Mobility today & what's next.Application ecosystems.Mobility today & what's next.Application ecosystems.
Mobility today & what's next. Application ecosystems.Petru Jucovschi
 
C# everywhere: Xamarin and cross platform development
C# everywhere: Xamarin and cross platform developmentC# everywhere: Xamarin and cross platform development
C# everywhere: Xamarin and cross platform developmentGill Cleeren
 
Software Development in 21st Century
Software Development in 21st CenturySoftware Development in 21st Century
Software Development in 21st CenturyHenry Jacob
 
Low Code Capabilities of Digital Product Design Platforms
Low Code Capabilities of Digital Product Design PlatformsLow Code Capabilities of Digital Product Design Platforms
Low Code Capabilities of Digital Product Design PlatformsJohnMcGuigan10
 
EclipseCon Fr 2018 - The future of development tooling: The example of Eclips...
EclipseCon Fr 2018 - The future of development tooling: The example of Eclips...EclipseCon Fr 2018 - The future of development tooling: The example of Eclips...
EclipseCon Fr 2018 - The future of development tooling: The example of Eclips...melbats
 
Forge - DevCon 2016: Implementing Rich Applications in the Browser
Forge - DevCon 2016: Implementing Rich Applications in the BrowserForge - DevCon 2016: Implementing Rich Applications in the Browser
Forge - DevCon 2016: Implementing Rich Applications in the BrowserAutodesk
 
Tech Thursdays: Building Products
Tech Thursdays: Building ProductsTech Thursdays: Building Products
Tech Thursdays: Building ProductsHayden Bleasel
 
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdfWessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdfWessel Loth
 
NetWork - 15.10.2011 - Applied code generation in .NET
NetWork - 15.10.2011 - Applied code generation in .NET NetWork - 15.10.2011 - Applied code generation in .NET
NetWork - 15.10.2011 - Applied code generation in .NET Dmytro Mindra
 
A guide to hiring a great developer to build your first app (redacted version)
A guide to hiring a great developer to build your first app (redacted version)A guide to hiring a great developer to build your first app (redacted version)
A guide to hiring a great developer to build your first app (redacted version)Oursky
 

Similar to Modeling on the Web (20)

Synapse india reviews on android application
Synapse india reviews on android applicationSynapse india reviews on android application
Synapse india reviews on android application
 
ABSE and AtomWeaver : A Quantum Leap in Software Development
ABSE and AtomWeaver : A Quantum Leap in Software DevelopmentABSE and AtomWeaver : A Quantum Leap in Software Development
ABSE and AtomWeaver : A Quantum Leap in Software Development
 
Meetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech PeopleMeetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech People
 
MyAppConverter DroidconUK 2014
MyAppConverter DroidconUK 2014MyAppConverter DroidconUK 2014
MyAppConverter DroidconUK 2014
 
Domain Driven Design Big Picture Strategic Patterns
Domain Driven Design Big Picture Strategic PatternsDomain Driven Design Big Picture Strategic Patterns
Domain Driven Design Big Picture Strategic Patterns
 
Domain specific modelling (DSM)
Domain specific modelling (DSM)Domain specific modelling (DSM)
Domain specific modelling (DSM)
 
Introduction
IntroductionIntroduction
Introduction
 
Is the Browser a Transitional Technology?
Is the Browser a Transitional Technology?Is the Browser a Transitional Technology?
Is the Browser a Transitional Technology?
 
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...
 
Enhancing and modifying_the_core_android_os
Enhancing and modifying_the_core_android_osEnhancing and modifying_the_core_android_os
Enhancing and modifying_the_core_android_os
 
Mobility today & what's next. Application ecosystems.
Mobility today & what's next.Application ecosystems.Mobility today & what's next.Application ecosystems.
Mobility today & what's next. Application ecosystems.
 
C# everywhere: Xamarin and cross platform development
C# everywhere: Xamarin and cross platform developmentC# everywhere: Xamarin and cross platform development
C# everywhere: Xamarin and cross platform development
 
Software Development in 21st Century
Software Development in 21st CenturySoftware Development in 21st Century
Software Development in 21st Century
 
Low Code Capabilities of Digital Product Design Platforms
Low Code Capabilities of Digital Product Design PlatformsLow Code Capabilities of Digital Product Design Platforms
Low Code Capabilities of Digital Product Design Platforms
 
EclipseCon Fr 2018 - The future of development tooling: The example of Eclips...
EclipseCon Fr 2018 - The future of development tooling: The example of Eclips...EclipseCon Fr 2018 - The future of development tooling: The example of Eclips...
EclipseCon Fr 2018 - The future of development tooling: The example of Eclips...
 
Forge - DevCon 2016: Implementing Rich Applications in the Browser
Forge - DevCon 2016: Implementing Rich Applications in the BrowserForge - DevCon 2016: Implementing Rich Applications in the Browser
Forge - DevCon 2016: Implementing Rich Applications in the Browser
 
Tech Thursdays: Building Products
Tech Thursdays: Building ProductsTech Thursdays: Building Products
Tech Thursdays: Building Products
 
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdfWessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
 
NetWork - 15.10.2011 - Applied code generation in .NET
NetWork - 15.10.2011 - Applied code generation in .NET NetWork - 15.10.2011 - Applied code generation in .NET
NetWork - 15.10.2011 - Applied code generation in .NET
 
A guide to hiring a great developer to build your first app (redacted version)
A guide to hiring a great developer to build your first app (redacted version)A guide to hiring a great developer to build your first app (redacted version)
A guide to hiring a great developer to build your first app (redacted version)
 

More from Pedro J. Molina

dotnetMalaga-2020 Gestión de la configuración en aplicaciones Web
dotnetMalaga-2020 Gestión de la configuración en aplicaciones WebdotnetMalaga-2020 Gestión de la configuración en aplicaciones Web
dotnetMalaga-2020 Gestión de la configuración en aplicaciones WebPedro J. Molina
 
Infrastructure as Code with Terraform
Infrastructure as Code with TerraformInfrastructure as Code with Terraform
Infrastructure as Code with TerraformPedro J. Molina
 
Essential as the base for Web DSLs
Essential as the base for Web DSLsEssential as the base for Web DSLs
Essential as the base for Web DSLsPedro J. Molina
 
ACM SIGCHI EICS-2019 Keynote. Quid, Pedro J. Molina
ACM SIGCHI EICS-2019 Keynote. Quid, Pedro J. MolinaACM SIGCHI EICS-2019 Keynote. Quid, Pedro J. Molina
ACM SIGCHI EICS-2019 Keynote. Quid, Pedro J. MolinaPedro J. Molina
 
Esencia de Web Components
Esencia de Web ComponentsEsencia de Web Components
Esencia de Web ComponentsPedro J. Molina
 
Esencia de web components
Esencia de web componentsEsencia de web components
Esencia de web componentsPedro J. Molina
 
Securizando por construcción mediante MDE
Securizando por construcción mediante MDESecurizando por construcción mediante MDE
Securizando por construcción mediante MDEPedro J. Molina
 
Building APIs with the OpenApi Spec
Building APIs with the OpenApi SpecBuilding APIs with the OpenApi Spec
Building APIs with the OpenApi SpecPedro J. Molina
 
Micro vs Nano (servicios)
Micro vs Nano (servicios)Micro vs Nano (servicios)
Micro vs Nano (servicios)Pedro J. Molina
 
Diseño de APIs con OpenAPI
Diseño de APIs con OpenAPIDiseño de APIs con OpenAPI
Diseño de APIs con OpenAPIPedro J. Molina
 

More from Pedro J. Molina (17)

MDE en la industria
MDE en la industriaMDE en la industria
MDE en la industria
 
Terraform
TerraformTerraform
Terraform
 
dotnetMalaga-2020 Gestión de la configuración en aplicaciones Web
dotnetMalaga-2020 Gestión de la configuración en aplicaciones WebdotnetMalaga-2020 Gestión de la configuración en aplicaciones Web
dotnetMalaga-2020 Gestión de la configuración en aplicaciones Web
 
Infrastructure as Code with Terraform
Infrastructure as Code with TerraformInfrastructure as Code with Terraform
Infrastructure as Code with Terraform
 
Are Startups for me?
Are Startups for me?Are Startups for me?
Are Startups for me?
 
Meow Demo
Meow DemoMeow Demo
Meow Demo
 
Essential as the base for Web DSLs
Essential as the base for Web DSLsEssential as the base for Web DSLs
Essential as the base for Web DSLs
 
ACM SIGCHI EICS-2019 Keynote. Quid, Pedro J. Molina
ACM SIGCHI EICS-2019 Keynote. Quid, Pedro J. MolinaACM SIGCHI EICS-2019 Keynote. Quid, Pedro J. Molina
ACM SIGCHI EICS-2019 Keynote. Quid, Pedro J. Molina
 
Esencia de Web Components
Esencia de Web ComponentsEsencia de Web Components
Esencia de Web Components
 
Esencia de web components
Esencia de web componentsEsencia de web components
Esencia de web components
 
OpenAPI 3.0.2
OpenAPI 3.0.2OpenAPI 3.0.2
OpenAPI 3.0.2
 
Quid
QuidQuid
Quid
 
Securizando por construcción mediante MDE
Securizando por construcción mediante MDESecurizando por construcción mediante MDE
Securizando por construcción mediante MDE
 
Building APIs with the OpenApi Spec
Building APIs with the OpenApi SpecBuilding APIs with the OpenApi Spec
Building APIs with the OpenApi Spec
 
Micro vs Nano (servicios)
Micro vs Nano (servicios)Micro vs Nano (servicios)
Micro vs Nano (servicios)
 
Diseño de APIs con OpenAPI
Diseño de APIs con OpenAPIDiseño de APIs con OpenAPI
Diseño de APIs con OpenAPI
 
Introducing MDSD
Introducing MDSDIntroducing MDSD
Introducing MDSD
 

Recently uploaded

Joseph Yoder : Being Agile about Architecture
Joseph Yoder : Being Agile about ArchitectureJoseph Yoder : Being Agile about Architecture
Joseph Yoder : Being Agile about ArchitectureHironori Washizaki
 
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ..."Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...ISPMAIndia
 
Orion Context Broker introduction 20240227
Orion Context Broker introduction 20240227Orion Context Broker introduction 20240227
Orion Context Broker introduction 20240227Fermin Galan
 
The Age of AI: Elevating Experiences & Delivering Customer Value!
The Age of AI: Elevating Experiences & Delivering Customer Value!The Age of AI: Elevating Experiences & Delivering Customer Value!
The Age of AI: Elevating Experiences & Delivering Customer Value!ISPMAIndia
 
"Discovery and Delivery through Product IntelliGenAI framework" by Ramkumar A...
"Discovery and Delivery through Product IntelliGenAI framework" by Ramkumar A..."Discovery and Delivery through Product IntelliGenAI framework" by Ramkumar A...
"Discovery and Delivery through Product IntelliGenAI framework" by Ramkumar A...ISPMAIndia
 
Role of DevOps in SaaS product Development.pdf.pptx
Role of DevOps in SaaS product Development.pdf.pptxRole of DevOps in SaaS product Development.pdf.pptx
Role of DevOps in SaaS product Development.pdf.pptxMindInventory
 
killing camp 주차장 나누기-2 topology sort.pdf
killing camp 주차장 나누기-2 topology sort.pdfkilling camp 주차장 나누기-2 topology sort.pdf
killing camp 주차장 나누기-2 topology sort.pdfssuser82c38d
 
Cybersecurity Measures For Remote Workers.pdf
Cybersecurity Measures For Remote Workers.pdfCybersecurity Measures For Remote Workers.pdf
Cybersecurity Measures For Remote Workers.pdfCIOWomenMagazine
 
Automation for Bonterra Impact Management (fka Apricot)
Automation for Bonterra Impact Management (fka Apricot)Automation for Bonterra Impact Management (fka Apricot)
Automation for Bonterra Impact Management (fka Apricot)Jeffrey Haguewood
 
killing camp week 6 problem - maximal matrix.pdf
killing camp week 6 problem - maximal matrix.pdfkilling camp week 6 problem - maximal matrix.pdf
killing camp week 6 problem - maximal matrix.pdfssuser82c38d
 
SPM 2024 – Overview of and benefits of AI in Product Management
SPM 2024 – Overview of and benefits of AI in Product ManagementSPM 2024 – Overview of and benefits of AI in Product Management
SPM 2024 – Overview of and benefits of AI in Product ManagementISPMAIndia
 
Machine Learning Basics for Dummies (no math!)
Machine Learning Basics for Dummies (no math!)Machine Learning Basics for Dummies (no math!)
Machine Learning Basics for Dummies (no math!)Dmitry Zinoviev
 
Product Manager vs Product Owner – Why Do Companies Still Struggle 23 Years A...
Product Manager vs Product Owner – Why Do Companies Still Struggle 23 Years A...Product Manager vs Product Owner – Why Do Companies Still Struggle 23 Years A...
Product Manager vs Product Owner – Why Do Companies Still Struggle 23 Years A...ISPMAIndia
 
No more Dockerfiles? Buildpacks to help you ship your image!
No more Dockerfiles? Buildpacks to help you ship your image!No more Dockerfiles? Buildpacks to help you ship your image!
No more Dockerfiles? Buildpacks to help you ship your image!Anthony Dahanne
 
DBA Fundamentals Group: Continuous SQL with Kafka and Flink
DBA Fundamentals Group: Continuous SQL with Kafka and FlinkDBA Fundamentals Group: Continuous SQL with Kafka and Flink
DBA Fundamentals Group: Continuous SQL with Kafka and FlinkTimothy Spann
 
The Top Outages of 2023: Analyses and Takeaways
The Top Outages of 2023: Analyses and TakeawaysThe Top Outages of 2023: Analyses and Takeaways
The Top Outages of 2023: Analyses and TakeawaysThousandEyes
 
Agile & Scrum, Certified Scrum Master! Crash Course
Agile & Scrum,  Certified Scrum Master! Crash CourseAgile & Scrum,  Certified Scrum Master! Crash Course
Agile & Scrum, Certified Scrum Master! Crash CourseRohan Chandane
 
killingcamp longest common subsequence.pdf
killingcamp longest common subsequence.pdfkillingcamp longest common subsequence.pdf
killingcamp longest common subsequence.pdfssuser82c38d
 
AI Product Management by Abhijit Bendigiri
AI Product Management by Abhijit BendigiriAI Product Management by Abhijit Bendigiri
AI Product Management by Abhijit BendigiriISPMAIndia
 

Recently uploaded (20)

Joseph Yoder : Being Agile about Architecture
Joseph Yoder : Being Agile about ArchitectureJoseph Yoder : Being Agile about Architecture
Joseph Yoder : Being Agile about Architecture
 
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ..."Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
 
Orion Context Broker introduction 20240227
Orion Context Broker introduction 20240227Orion Context Broker introduction 20240227
Orion Context Broker introduction 20240227
 
The Age of AI: Elevating Experiences & Delivering Customer Value!
The Age of AI: Elevating Experiences & Delivering Customer Value!The Age of AI: Elevating Experiences & Delivering Customer Value!
The Age of AI: Elevating Experiences & Delivering Customer Value!
 
"Discovery and Delivery through Product IntelliGenAI framework" by Ramkumar A...
"Discovery and Delivery through Product IntelliGenAI framework" by Ramkumar A..."Discovery and Delivery through Product IntelliGenAI framework" by Ramkumar A...
"Discovery and Delivery through Product IntelliGenAI framework" by Ramkumar A...
 
Role of DevOps in SaaS product Development.pdf.pptx
Role of DevOps in SaaS product Development.pdf.pptxRole of DevOps in SaaS product Development.pdf.pptx
Role of DevOps in SaaS product Development.pdf.pptx
 
killing camp 주차장 나누기-2 topology sort.pdf
killing camp 주차장 나누기-2 topology sort.pdfkilling camp 주차장 나누기-2 topology sort.pdf
killing camp 주차장 나누기-2 topology sort.pdf
 
Cybersecurity Measures For Remote Workers.pdf
Cybersecurity Measures For Remote Workers.pdfCybersecurity Measures For Remote Workers.pdf
Cybersecurity Measures For Remote Workers.pdf
 
Automation for Bonterra Impact Management (fka Apricot)
Automation for Bonterra Impact Management (fka Apricot)Automation for Bonterra Impact Management (fka Apricot)
Automation for Bonterra Impact Management (fka Apricot)
 
killing camp week 6 problem - maximal matrix.pdf
killing camp week 6 problem - maximal matrix.pdfkilling camp week 6 problem - maximal matrix.pdf
killing camp week 6 problem - maximal matrix.pdf
 
SPM 2024 – Overview of and benefits of AI in Product Management
SPM 2024 – Overview of and benefits of AI in Product ManagementSPM 2024 – Overview of and benefits of AI in Product Management
SPM 2024 – Overview of and benefits of AI in Product Management
 
Machine Learning Basics for Dummies (no math!)
Machine Learning Basics for Dummies (no math!)Machine Learning Basics for Dummies (no math!)
Machine Learning Basics for Dummies (no math!)
 
Product Manager vs Product Owner – Why Do Companies Still Struggle 23 Years A...
Product Manager vs Product Owner – Why Do Companies Still Struggle 23 Years A...Product Manager vs Product Owner – Why Do Companies Still Struggle 23 Years A...
Product Manager vs Product Owner – Why Do Companies Still Struggle 23 Years A...
 
eLearning Content Development Company Code and Pixels.pdf
eLearning Content Development Company Code and Pixels.pdfeLearning Content Development Company Code and Pixels.pdf
eLearning Content Development Company Code and Pixels.pdf
 
No more Dockerfiles? Buildpacks to help you ship your image!
No more Dockerfiles? Buildpacks to help you ship your image!No more Dockerfiles? Buildpacks to help you ship your image!
No more Dockerfiles? Buildpacks to help you ship your image!
 
DBA Fundamentals Group: Continuous SQL with Kafka and Flink
DBA Fundamentals Group: Continuous SQL with Kafka and FlinkDBA Fundamentals Group: Continuous SQL with Kafka and Flink
DBA Fundamentals Group: Continuous SQL with Kafka and Flink
 
The Top Outages of 2023: Analyses and Takeaways
The Top Outages of 2023: Analyses and TakeawaysThe Top Outages of 2023: Analyses and Takeaways
The Top Outages of 2023: Analyses and Takeaways
 
Agile & Scrum, Certified Scrum Master! Crash Course
Agile & Scrum,  Certified Scrum Master! Crash CourseAgile & Scrum,  Certified Scrum Master! Crash Course
Agile & Scrum, Certified Scrum Master! Crash Course
 
killingcamp longest common subsequence.pdf
killingcamp longest common subsequence.pdfkillingcamp longest common subsequence.pdf
killingcamp longest common subsequence.pdf
 
AI Product Management by Abhijit Bendigiri
AI Product Management by Abhijit BendigiriAI Product Management by Abhijit Bendigiri
AI Product Management by Abhijit Bendigiri
 

Modeling on the Web

  • 1. Modeling on the Web Pedro J. Molina, Ahmed Negm, Ruben Jiménez @pmolinam @anegm81 @rubenjmarrufo @icinetic
  • 2. Icinetic • We do MDSD Tools for Developers, Citizen Developers & End-Users • HQ in Seville, Spain, EU • Offices in San Francisco, Seattle, Cairo, Seville & Madrid http://www.icinetic.com/
  • 3. If I want to jump, but I am not trained What can I do? Question?
  • 4. A1: Lower the bar Question?
  • 6. Creating applications is getting more and more complex: Technologies, frameworks, versions, dependencies, different screen sizes and aspect ratios, incompatible API & vendors, platform fragmentation… How we can help as the MDE community? Why the metaphor?
  • 7. Types of complexities •Essential Complexity •Accidental Complexity Terms from : “Fred Brooks, 1986, No Silver Bullet” Complexities on Software
  • 8. Complexity inherent to the system been designed. “Everything should be made as simple as possible, but not simpler.” (A. Einstein) Essential Complexity
  • 9. Accidental Complexity Any other Extra Complexity arisen from tools, methods, technologies, etc. used to build the system. Programming languages, tools, frameworks… computers, devices introduce many, many Accidental Complexity.
  • 10. From idea  usage Idea  design  build  test  debug  provision  deploy  usage Can we do something to speed up this delivery critical path? Accidental Complexities
  • 11. MDE helps to reduce Accidental Complexity. The ultimate “noble” Quest for MDE Make life easier!
  • 12. Radarc online Radarc Abstraction Level covered by tools High Low Telerik AppBuilder Xamarin Visual Studio Eclipse MS Siena Wizards Models Code Graphical Design HTML+JS Native code Drag&Drop Models Deployed App Compiled App
  • 13. • Non coding skills Users • Amateurs Programmers • Citizen Developers • Professional Developers • Gurus / Hackers • Code Generation attendees ;-) • MPS Users };-) User, a segmentation
  • 14. The App industry is growing. End Users joining. Consumer • Mobile apps will be a $77B business by 2017 Business • Mobile Business apps will be worth almost $50B by 2017 • In 2013, an estimated 200 million workers used mobile business apps Citizen Developers • Users operating outside of the scope of enterprise IT and its governance who creates new business applications for consumption by others - Gartner • In 2014, 25% of new business applications will be delivered by Citizen Developers
  • 15. MDE • Developers: tendency to craftsmanship / artists / Not seen like an engineer… • Citizen Developers: benefit directly from automation and complexity hiding • We are not going to be enough • MDE is a tool for Lowering the Entry Barrier • Allowing non programmers to DIY to solve their day to day problems • Mobility, Ubiquity computers, Different UI, UX, form factors The role of MDE
  • 16. Last week at /Build Conference Microsoft presented the line of work they are going to push hard: Connected Devices • Same App • Cross Devices: Tablet / Phone • Adapted to the context (device, form factor, & user needs) Trend on Connected Devices Windows 8.1 Blue
  • 17. Google, Samsung, Microsoft working on: • Glasses • Phone • Tablets • TVs • Watches • Internet of Things Trend on Connected Devices Main Features • Same Services • Cross Devices • Contextual
  • 18. My code, my Treasure, my IDE? Where is my IDE now? It’s going with wind… to The Cloud! My code, my Treasure
  • 19. Everything going to The Cloud. Why? • Zero installation • Instant updates • Do it from any device, any time (any browser) My IDE  on The Cloud
  • 20. What is other people doing? State of the Art
  • 25. Martin Thiede http://concrete-editor.org Presented here a CG2010 Four years ago! Concrete Editor
  • 27. We decided at Icinetic: We need to go to the cloud, the sooner, the better. Move to the cloud
  • 28. Because Not Typed Relaxed syntax  error prone WAT Programming: http://bit.ly/watProg JavaScript is not my favorite language [] + [] [] + {} {} + [] {} + {}  “”  [Object Object]  0  NaN
  • 29. But It is the World most ubiquity computer runtime ever deployed. And runs fast in all modern browsers! JavaScript is not my favorite language
  • 30. • Global variables • with keyword • eval() • Type coercion • Block syntax with no block scope • Optional semicolons (sometimes, some browsers, but not all) First Developer Sin: Lack of understanding of its prototypical inheritance Recommended reading: Douglas Crockford book. “JavaScript: The Good parts” JavaScript main Sins
  • 31. Typescript typing the un-typed Type annotations, Generics, modules, classes, interfaces for JS Hack “typing” to PHP to support a gigantic codebase that has to be maintained. Dynamic typing languages are good for quick prototyping. Static typing languages are better for maintaining code. Compilers provide you a chance to catch some type error before the user see them. In any case, Unit Testing is A MUST in both code-camps. Taming the ‘wild’ JavaScript http://hacklang.org http://www.typescriptlang.org
  • 32. •Stateless •Scalable •Run in any browser •It is not a desktop frontend (almost!?) Web
  • 33. •Stateless •Scalable •Run in any browser •It is not a desktop frontend (almost!?) Web
  • 34. • Looking for • Textual • Diagram • Projectional • Tabular • Mixed forms. Editors for Models
  • 35. • Grammars • BNF • Parsers • Facilities • Inline errors • Syntax Coloring • Code Completion Textual Editors
  • 36. • Easier to use for non programmers • The editor follows the form of the model • Difficult to create non consistent models • Limited, constrained Projectional Editors
  • 37. • Graphical editors with a strong focus on visualization • Excellent for showing relationships between objects Diagram Editors
  • 38. Editors on the Web Demo Time D←mo
  • 39. Canvas Surface for drag and drop controls and UI components • Shows presentation layouts an embedding relationships • Objects can be setup one by one to the detail with an auxiliary Property Grid Editor Designer Editor
  • 40. • Tree Editors • Table Editors • Allows to cross two relationships for a set of objects and show or edit a third property in a tabular way • Custom Editors • Wizard style or free form of editor are also a good choice when UX is the key issue to address • Composed Editors • The previous one shows some paradigms for editor. Combining the previous ones to created compounded editors allows to create a complex one. Other Editors
  • 41. Language skills requires time and experience Level of abstraction of a language is a sword with two edges • Easy to think in such abstractions • Removes other details What happens when we need to go deeper in the details? • Progressive Modeling Customizations Cliffs
  • 42. End User Levels of abstraction for App Design Power User Developer Expert Developer / Architect
  • 43. • Simple Model for End Users • Powerful for advanced users • Full expressiveness power for developers: access to full details Progressive Modeling
  • 46. Progressive Modeling on http://radarconline.com (in Private Beta) All of you invited to try! Demo Time D←mo
  • 47. Models everywhere: generation/build pipeline Metamodel.meta Model.ts parser.pegjs Comon-js Format Server-side AMD Format Client/Browser-side Model.js parser.js Model.js parser.js Generation JSON Model.cs Parser.cs Model.java Lang.gram Meta-definitons
  • 48. Backend / Cloud Frontend • Where to validate? • XRefs? • How to propagate? Models everywhere
  • 49. Generation as a Service • If your IDE is in the cloud, • If your modeling is the cloud, • If your code is on the cloud • IaaS, PaaS, SaaS Where to put your code generators? GaaS
  • 51. The world is changing: • The Cloud is coming & disrupting • Mobile Devices • Devices Everywhere • Citizen Developers creating Apps Conclusions So, do we: • Getting ready for Cloud • Modeling once on the web • Tools for Citizen Developers • Reducing accidental complexity • Delivering Native Apps cross-devices
  • 52. • If we can Model on the Web as simple as possible • An then, get the application running on the device With Zero Technical Details • We have removed much of the Accidental Complexity Conclusions
  • 53. Lowering the Entry Barriers to Build Apps Conclusions
  • 55. “Devices everywhere & Platform Fragmentation have potential to make MDE inevitable.” A Prediction