SlideShare a Scribd company logo
1 of 15
Download to read offline
AngularJS & REST Web Services
#OMRS15
Darius Jazayeri
darius@openmrs.org
djazayeri@thoughtworks.com
Download this...
● Download the Postman Chrome app
● https://www.getpostman.com/
● We'll use it shortly
REST
● REST = Representational State Transfer
● the software architectural style of the World Wide Web
● Levels of maturity
– “just add a REST API on top of it”
– Hypermedia as the engine of application state (HATEOAS)
– http://martinfowler.com/articles/richardsonMaturityModel.html
● Using HTTP to interact with the server in a constrained
machine-friendly way
● Constraints allow for scalability via standard web
technologies (stateless, cacheable, layered)
REST concepts
● Resource
– URI that addresses a collection or item in the system
– e.g. http://…/patient or http://…/patient/abc123
● Representation
– Specific state of the application. Based on one of these a client
can change application state
– Typically JSON or XML
● Hyperlinks
– what client can do from a given state
– e.g. {"rel": "next", "uri": "http://.../concept?startIndex=50"}
REST in OpenMRS
● Started in 2011
● Level 2 on the Richardson Maturity Model
– http://martinfowler.com/articles/richardsonMaturityModel.html
● RESTful CRUD access to the OpenMRS
platform data model
● We would like to be REST-first, but we're not
there yet. This is still second-class to our Java
API
REST in OpenMRS
● Documentation on the wiki at “REST Web Services
API For Clients”
– https://wiki.openmrs.org/x/P4IaAQ
– Big refresh coming in the next OpenMRS Platform release
(Swagger!)
● Basic Authentication
● Paging
● Different sized representations (ref, default, full)
– Also, custom representations
REST in OpenMRS: Let's play
● Use the Postman Chrome app (or something
else)
● http://demo.openmrs.org/openmrs/ws/rest/v1/concept
● .../concept?startIndex=50
● .../concept?q=malaria
● .../concept/CIEL:160152
● Add header… Accept: application/xml
● .../location?v=default
REST in OpenMRS: Exercise
● Create an encounter for an existing patient that
records their weight
– You will need to find a patient, look up some other
metadata, and figure out the encounter POST
format
AngularJS
●
https://angularjs.org/ (by Google)
– “HTML is great for declaring static documents, but it falters when we try to use it for declaring dynamic
views in web-applications. AngularJS lets you extend HTML vocabulary for your application. The resulting
environment is extraordinarily expressive, readable, and quick to develop.”
● Great framework for building client-side web applications
● Normally, one would build a complete app in AngularJS
– Bahmni
– OpenMRS Ebola Tablet App
● In the OpenMRS Reference Application we embed smaller AngularJS apps in a primarily-
server-side application
– but we're using AngularJS more and more
●
Clone: https://github.com/djazayeri/openmrs-module-angulartutorial
openmrs-core version 1.11.x
modules: appui, uiframework, appframework, uicommons, webservices.rest
AngularJS Concepts
● Directives
– Think of this as an “HTML tag/attribute handler”
– AngularJS code that is applied
– Built-in directives; Also write your own
● Scopes
– The dynamic thing that connects controller to view
– Directives have a $scope (sometimes inherited from a
parent, sometimes isolated)
– $rootScope
AngularJS Concepts
● Two-way data binding
– <input ng-model="myVariable" type="text"/>
– Editing the text box will update $scope.myVariable
– Setting $scope.myVariable will update the text box
● Templates
– with {{ interpolation }}
● Functions in the $scope
– <button ng-click="doSomething()">...</button>
● See example1 in the tutorial module
AngularJS Docs
● Developer Guide
– https://docs.angularjs.org/guide
● API Reference
– https://docs.angularjs.org/api
● More sophisticated: tutorial example2
AngularJS Magic
● Tutorial example3
AngularJS +/- GSP
● OpenMRS Reference Application includes a
non-standard mix of server-side GSP and
client-side AngularJS code
● Filters
– {{ visit.startDate | date }}
● tutorial example4
AngularJS + REST in OpenMRS
● Using raw $http
– Tutorial example5
● Using ngResource
– Tutorial example6
● Services in uicommons module

More Related Content

What's hot

Designing REST services with Spring MVC
Designing REST services with Spring MVCDesigning REST services with Spring MVC
Designing REST services with Spring MVCSerhii Kartashov
 
RESTful Web Services with Spring MVC
RESTful Web Services with Spring MVCRESTful Web Services with Spring MVC
RESTful Web Services with Spring MVCdigitalsonic
 
Building RESTful applications using Spring MVC
Building RESTful applications using Spring MVCBuilding RESTful applications using Spring MVC
Building RESTful applications using Spring MVCIndicThreads
 
Angular js for beginners
Angular js for beginnersAngular js for beginners
Angular js for beginnersMunir Hoque
 
Introduction to AngularJS
Introduction to AngularJSIntroduction to AngularJS
Introduction to AngularJSShyjal Raazi
 
Laravel + Restangular Introduction
Laravel + Restangular IntroductionLaravel + Restangular Introduction
Laravel + Restangular IntroductionAndrew Del Prete
 
Learn REST in 18 Slides
Learn REST in 18 SlidesLearn REST in 18 Slides
Learn REST in 18 SlidesSuraj Gupta
 
Server rendering-talk
Server rendering-talkServer rendering-talk
Server rendering-talkDaiwei Lu
 
Introduction to AJAX In WordPress
Introduction to AJAX In WordPressIntroduction to AJAX In WordPress
Introduction to AJAX In WordPressCaldera Labs
 
Single Page Application (SPA) using AngularJS
Single Page Application (SPA) using AngularJSSingle Page Application (SPA) using AngularJS
Single Page Application (SPA) using AngularJSM R Rony
 
ASP.NET MVC and ajax
ASP.NET MVC and ajax ASP.NET MVC and ajax
ASP.NET MVC and ajax Brij Mishra
 
Angular js tutorial slides
Angular js tutorial slidesAngular js tutorial slides
Angular js tutorial slidessamhelman
 
Ise312 Ec Presentation Jquery
Ise312 Ec Presentation JqueryIse312 Ec Presentation Jquery
Ise312 Ec Presentation Jqueryduygut
 
RoR 101: Session 6
RoR 101: Session 6RoR 101: Session 6
RoR 101: Session 6Rory Gianni
 

What's hot (19)

Designing REST services with Spring MVC
Designing REST services with Spring MVCDesigning REST services with Spring MVC
Designing REST services with Spring MVC
 
RESTful Web Services with Spring MVC
RESTful Web Services with Spring MVCRESTful Web Services with Spring MVC
RESTful Web Services with Spring MVC
 
Building RESTful applications using Spring MVC
Building RESTful applications using Spring MVCBuilding RESTful applications using Spring MVC
Building RESTful applications using Spring MVC
 
Angular js for beginners
Angular js for beginnersAngular js for beginners
Angular js for beginners
 
Introduction to AngularJS
Introduction to AngularJSIntroduction to AngularJS
Introduction to AngularJS
 
Laravel + Restangular Introduction
Laravel + Restangular IntroductionLaravel + Restangular Introduction
Laravel + Restangular Introduction
 
Introduction to Angular JS
Introduction to Angular JSIntroduction to Angular JS
Introduction to Angular JS
 
Learn REST in 18 Slides
Learn REST in 18 SlidesLearn REST in 18 Slides
Learn REST in 18 Slides
 
Server rendering-talk
Server rendering-talkServer rendering-talk
Server rendering-talk
 
Angular introduction basic
Angular introduction basicAngular introduction basic
Angular introduction basic
 
Introduction to AJAX In WordPress
Introduction to AJAX In WordPressIntroduction to AJAX In WordPress
Introduction to AJAX In WordPress
 
Single Page Application (SPA) using AngularJS
Single Page Application (SPA) using AngularJSSingle Page Application (SPA) using AngularJS
Single Page Application (SPA) using AngularJS
 
ASP.NET MVC and ajax
ASP.NET MVC and ajax ASP.NET MVC and ajax
ASP.NET MVC and ajax
 
Angularjs PPT
Angularjs PPTAngularjs PPT
Angularjs PPT
 
Angular js tutorial slides
Angular js tutorial slidesAngular js tutorial slides
Angular js tutorial slides
 
Ch. 11 deploying
Ch. 11 deployingCh. 11 deploying
Ch. 11 deploying
 
Ise312 Ec Presentation Jquery
Ise312 Ec Presentation JqueryIse312 Ec Presentation Jquery
Ise312 Ec Presentation Jquery
 
RoR 101: Session 6
RoR 101: Session 6RoR 101: Session 6
RoR 101: Session 6
 
Spring Mvc Rest
Spring Mvc RestSpring Mvc Rest
Spring Mvc Rest
 

Viewers also liked

OpenMRS: htmlforms
OpenMRS: htmlformsOpenMRS: htmlforms
OpenMRS: htmlformslnball
 
What Is Open M R S
What Is  Open M R SWhat Is  Open M R S
What Is Open M R Shamishfraser
 
OpenMRS Reference Application, Getting Started
OpenMRS Reference Application, Getting StartedOpenMRS Reference Application, Getting Started
OpenMRS Reference Application, Getting Starteddjazayeri
 
Openmrs Use Examples PPT
Openmrs Use Examples PPTOpenmrs Use Examples PPT
Openmrs Use Examples PPTdjazayeri
 
OpenMRS Concept Management Tutorial
OpenMRS Concept Management TutorialOpenMRS Concept Management Tutorial
OpenMRS Concept Management Tutoriallnball
 
BE/ ME / MTech / BTech Computer Engineering Project titles IEEE 2014 IEEE 2015
BE/ ME / MTech / BTech Computer Engineering Project titles IEEE 2014 IEEE 2015BE/ ME / MTech / BTech Computer Engineering Project titles IEEE 2014 IEEE 2015
BE/ ME / MTech / BTech Computer Engineering Project titles IEEE 2014 IEEE 2015Adz91 Digital Ads Pvt Ltd
 
Darius Open Mrs Examples
Darius Open Mrs ExamplesDarius Open Mrs Examples
Darius Open Mrs Exampleshamishfraser
 
OpenMRS Meeting Boston, Introduction
OpenMRS Meeting Boston, IntroductionOpenMRS Meeting Boston, Introduction
OpenMRS Meeting Boston, Introductionhamishfraser
 
FOSS Asia 2016 - OpenMRS networks for networks
FOSS Asia 2016 - OpenMRS networks for networksFOSS Asia 2016 - OpenMRS networks for networks
FOSS Asia 2016 - OpenMRS networks for networksSaptarshi Purkayastha
 
Cover front and back for leadership asg
Cover front and back for leadership asgCover front and back for leadership asg
Cover front and back for leadership asgSokunthea So
 
OpenMRS Concept Management Tutorial (addendum)
OpenMRS Concept Management Tutorial (addendum)OpenMRS Concept Management Tutorial (addendum)
OpenMRS Concept Management Tutorial (addendum)lnball
 
OpenMRS Presentation
OpenMRS PresentationOpenMRS Presentation
OpenMRS PresentationAnnieLGCI
 
OpenMRS presentation, part of Google Code-In 2015
OpenMRS presentation, part of Google Code-In 2015 OpenMRS presentation, part of Google Code-In 2015
OpenMRS presentation, part of Google Code-In 2015 Ioana-Andreea Berdei
 
MVP Open Mrs Update 052609
MVP Open Mrs Update 052609MVP Open Mrs Update 052609
MVP Open Mrs Update 052609hamishfraser
 
Seebregts Omrs Oasis Boston May09
Seebregts Omrs Oasis Boston May09Seebregts Omrs Oasis Boston May09
Seebregts Omrs Oasis Boston May09hamishfraser
 

Viewers also liked (20)

OpenMRS: htmlforms
OpenMRS: htmlformsOpenMRS: htmlforms
OpenMRS: htmlforms
 
What Is Open M R S
What Is  Open M R SWhat Is  Open M R S
What Is Open M R S
 
OpenMRS Reference Application, Getting Started
OpenMRS Reference Application, Getting StartedOpenMRS Reference Application, Getting Started
OpenMRS Reference Application, Getting Started
 
Openmrs Use Examples PPT
Openmrs Use Examples PPTOpenmrs Use Examples PPT
Openmrs Use Examples PPT
 
OpenMRS Concept Management Tutorial
OpenMRS Concept Management TutorialOpenMRS Concept Management Tutorial
OpenMRS Concept Management Tutorial
 
BE/ ME / MTech / BTech Computer Engineering Project titles IEEE 2014 IEEE 2015
BE/ ME / MTech / BTech Computer Engineering Project titles IEEE 2014 IEEE 2015BE/ ME / MTech / BTech Computer Engineering Project titles IEEE 2014 IEEE 2015
BE/ ME / MTech / BTech Computer Engineering Project titles IEEE 2014 IEEE 2015
 
Darius Open Mrs Examples
Darius Open Mrs ExamplesDarius Open Mrs Examples
Darius Open Mrs Examples
 
Health IT and OpenMRS
Health IT and OpenMRSHealth IT and OpenMRS
Health IT and OpenMRS
 
OpenMRS Meeting Boston, Introduction
OpenMRS Meeting Boston, IntroductionOpenMRS Meeting Boston, Introduction
OpenMRS Meeting Boston, Introduction
 
FOSS Asia 2016 - OpenMRS networks for networks
FOSS Asia 2016 - OpenMRS networks for networksFOSS Asia 2016 - OpenMRS networks for networks
FOSS Asia 2016 - OpenMRS networks for networks
 
Cover front and back for leadership asg
Cover front and back for leadership asgCover front and back for leadership asg
Cover front and back for leadership asg
 
OpenMRS Concept Management Tutorial (addendum)
OpenMRS Concept Management Tutorial (addendum)OpenMRS Concept Management Tutorial (addendum)
OpenMRS Concept Management Tutorial (addendum)
 
OpenMRS Presentation
OpenMRS PresentationOpenMRS Presentation
OpenMRS Presentation
 
OpenMRS presentation, part of Google Code-In 2015
OpenMRS presentation, part of Google Code-In 2015 OpenMRS presentation, part of Google Code-In 2015
OpenMRS presentation, part of Google Code-In 2015
 
MVP Open Mrs Update 052609
MVP Open Mrs Update 052609MVP Open Mrs Update 052609
MVP Open Mrs Update 052609
 
Seebregts Omrs Oasis Boston May09
Seebregts Omrs Oasis Boston May09Seebregts Omrs Oasis Boston May09
Seebregts Omrs Oasis Boston May09
 
Open MRS
Open MRSOpen MRS
Open MRS
 
OpenMRS presentation
OpenMRS presentationOpenMRS presentation
OpenMRS presentation
 
The open mrs hl7query module
The open mrs hl7query moduleThe open mrs hl7query module
The open mrs hl7query module
 
Open Mrs Vision 2
Open Mrs Vision 2Open Mrs Vision 2
Open Mrs Vision 2
 

Similar to AngularJS and REST - #omrs15 tutorial

JSFest 2019: Technology agnostic microservices at SPA frontend
JSFest 2019: Technology agnostic microservices at SPA frontendJSFest 2019: Technology agnostic microservices at SPA frontend
JSFest 2019: Technology agnostic microservices at SPA frontendVlad Fedosov
 
Introduction to Ember.js
Introduction to Ember.jsIntroduction to Ember.js
Introduction to Ember.jsVinoth Kumar
 
Beginning MEAN Stack
Beginning MEAN StackBeginning MEAN Stack
Beginning MEAN StackRob Davarnia
 
JS Fest 2019/Autumn. Влад Федосов. Technology agnostic microservices at SPA f...
JS Fest 2019/Autumn. Влад Федосов. Technology agnostic microservices at SPA f...JS Fest 2019/Autumn. Влад Федосов. Technology agnostic microservices at SPA f...
JS Fest 2019/Autumn. Влад Федосов. Technology agnostic microservices at SPA f...JSFestUA
 
Angular jS Introduction by Google
Angular jS Introduction by GoogleAngular jS Introduction by Google
Angular jS Introduction by GoogleASG
 
Intoduction to Angularjs
Intoduction to AngularjsIntoduction to Angularjs
Intoduction to AngularjsGaurav Agrawal
 
Angular webinar - Credo Systemz
Angular webinar - Credo SystemzAngular webinar - Credo Systemz
Angular webinar - Credo SystemzTraining Institute
 
Modern webtechnologies
Modern webtechnologiesModern webtechnologies
Modern webtechnologiesBesjan Xhika
 
angularjs_tutorial.docx
angularjs_tutorial.docxangularjs_tutorial.docx
angularjs_tutorial.docxtelegramvip
 
6 10-presentation
6 10-presentation6 10-presentation
6 10-presentationRemi Arnaud
 
AngularJS in Production (CTO Forum)
AngularJS in Production (CTO Forum)AngularJS in Production (CTO Forum)
AngularJS in Production (CTO Forum)Alex Ross
 
Global Logic sMash Overview And Experiences
Global Logic   sMash  Overview And  ExperiencesGlobal Logic   sMash  Overview And  Experiences
Global Logic sMash Overview And ExperiencesProject Zero
 

Similar to AngularJS and REST - #omrs15 tutorial (20)

JSFest 2019: Technology agnostic microservices at SPA frontend
JSFest 2019: Technology agnostic microservices at SPA frontendJSFest 2019: Technology agnostic microservices at SPA frontend
JSFest 2019: Technology agnostic microservices at SPA frontend
 
Introduction to Ember.js
Introduction to Ember.jsIntroduction to Ember.js
Introduction to Ember.js
 
Reactjs Basics
Reactjs BasicsReactjs Basics
Reactjs Basics
 
Beginning MEAN Stack
Beginning MEAN StackBeginning MEAN Stack
Beginning MEAN Stack
 
JS Fest 2019/Autumn. Влад Федосов. Technology agnostic microservices at SPA f...
JS Fest 2019/Autumn. Влад Федосов. Technology agnostic microservices at SPA f...JS Fest 2019/Autumn. Влад Федосов. Technology agnostic microservices at SPA f...
JS Fest 2019/Autumn. Влад Федосов. Technology agnostic microservices at SPA f...
 
What is mean stack?
What is mean stack?What is mean stack?
What is mean stack?
 
Top java script frameworks ppt
Top java script frameworks pptTop java script frameworks ppt
Top java script frameworks ppt
 
Angular jS Introduction by Google
Angular jS Introduction by GoogleAngular jS Introduction by Google
Angular jS Introduction by Google
 
Top 10 Javascript Frameworks For Easy Web Development
Top 10 Javascript Frameworks For Easy Web DevelopmentTop 10 Javascript Frameworks For Easy Web Development
Top 10 Javascript Frameworks For Easy Web Development
 
Single Page Application
Single Page ApplicationSingle Page Application
Single Page Application
 
Intro to AngularJS
Intro to AngularJS Intro to AngularJS
Intro to AngularJS
 
Intoduction to Angularjs
Intoduction to AngularjsIntoduction to Angularjs
Intoduction to Angularjs
 
Angular webinar - Credo Systemz
Angular webinar - Credo SystemzAngular webinar - Credo Systemz
Angular webinar - Credo Systemz
 
Modern webtechnologies
Modern webtechnologiesModern webtechnologies
Modern webtechnologies
 
Cloud APIs Overview Tucker
Cloud APIs Overview   TuckerCloud APIs Overview   Tucker
Cloud APIs Overview Tucker
 
angularjs_tutorial.docx
angularjs_tutorial.docxangularjs_tutorial.docx
angularjs_tutorial.docx
 
ExpressJS and REST API.pptx
ExpressJS and REST API.pptxExpressJS and REST API.pptx
ExpressJS and REST API.pptx
 
6 10-presentation
6 10-presentation6 10-presentation
6 10-presentation
 
AngularJS in Production (CTO Forum)
AngularJS in Production (CTO Forum)AngularJS in Production (CTO Forum)
AngularJS in Production (CTO Forum)
 
Global Logic sMash Overview And Experiences
Global Logic   sMash  Overview And  ExperiencesGlobal Logic   sMash  Overview And  Experiences
Global Logic sMash Overview And Experiences
 

Recently uploaded

LARYNGEAL CANCER.pptx Prepared by Neha Kewat
LARYNGEAL CANCER.pptx  Prepared by Neha KewatLARYNGEAL CANCER.pptx  Prepared by Neha Kewat
LARYNGEAL CANCER.pptx Prepared by Neha KewatNehaKewat
 
CECT NECK NECK ANGIOGRAPHY CAROTID ANGIOGRAPHY
CECT NECK NECK ANGIOGRAPHY CAROTID ANGIOGRAPHYCECT NECK NECK ANGIOGRAPHY CAROTID ANGIOGRAPHY
CECT NECK NECK ANGIOGRAPHY CAROTID ANGIOGRAPHYRMC
 
Hematinics and Erythropoietin- Pharmacology of Hematinics
Hematinics and Erythropoietin- Pharmacology of HematinicsHematinics and Erythropoietin- Pharmacology of Hematinics
Hematinics and Erythropoietin- Pharmacology of Hematinicsnetraangadi2
 
Assisted Living Care Residency - PapayaCare
Assisted Living Care Residency - PapayaCareAssisted Living Care Residency - PapayaCare
Assisted Living Care Residency - PapayaCareratilalthakkar704
 
ARTHRITIS.pptx Prepared by monika gopal Tutor
ARTHRITIS.pptx Prepared  by monika gopal TutorARTHRITIS.pptx Prepared  by monika gopal Tutor
ARTHRITIS.pptx Prepared by monika gopal TutorNehaKewat
 
Drug stability and chemical Kinetics UNIT V
Drug stability and chemical Kinetics UNIT VDrug stability and chemical Kinetics UNIT V
Drug stability and chemical Kinetics UNIT VDr Rakesh Kumar Sharma
 
Blood(The Applied Physiology) for Nurses.pptx
Blood(The Applied Physiology) for Nurses.pptxBlood(The Applied Physiology) for Nurses.pptx
Blood(The Applied Physiology) for Nurses.pptxNagamani Manjunath
 
Introduction to Evaluation and Skin Benefits
Introduction to Evaluation and Skin BenefitsIntroduction to Evaluation and Skin Benefits
Introduction to Evaluation and Skin Benefitssahilgabhane29
 
Govt releases guidelines to curb unethical pharma sector practices.pdf
Govt releases guidelines to curb unethical pharma sector practices.pdfGovt releases guidelines to curb unethical pharma sector practices.pdf
Govt releases guidelines to curb unethical pharma sector practices.pdfCompetitionPedia
 
Presentation on COUNSELING. 1ST YEAR GNM ,COMMUNITY HEALTH NURSING
Presentation on  COUNSELING. 1ST YEAR GNM ,COMMUNITY HEALTH NURSINGPresentation on  COUNSELING. 1ST YEAR GNM ,COMMUNITY HEALTH NURSING
Presentation on COUNSELING. 1ST YEAR GNM ,COMMUNITY HEALTH NURSINGKREDASONBANGALORE
 
Diseases of the Respiratory System (J00-J99),.pptx
Diseases of the Respiratory System (J00-J99),.pptxDiseases of the Respiratory System (J00-J99),.pptx
Diseases of the Respiratory System (J00-J99),.pptxEMADABATHINI PRABHU TEJA
 
Empathy Is a Stress Response - Choose Compassion instead
Empathy Is a Stress Response - Choose Compassion insteadEmpathy Is a Stress Response - Choose Compassion instead
Empathy Is a Stress Response - Choose Compassion insteadAlex Clapson
 
Living Well Every Day: Lyons Wellness Practice | Nurtures Your Complete Health
Living Well Every Day: Lyons Wellness Practice | Nurtures Your Complete HealthLiving Well Every Day: Lyons Wellness Practice | Nurtures Your Complete Health
Living Well Every Day: Lyons Wellness Practice | Nurtures Your Complete HealthLyons Health
 
Anatomy Shelf Notevbhhhhhhhhhhhhhhhs.pdf
Anatomy Shelf Notevbhhhhhhhhhhhhhhhs.pdfAnatomy Shelf Notevbhhhhhhhhhhhhhhhs.pdf
Anatomy Shelf Notevbhhhhhhhhhhhhhhhs.pdfhezamzaki1
 
EYE CANCER.pptx prepared by Neha kewat digital learning
EYE CANCER.pptx prepared by  Neha kewat digital learningEYE CANCER.pptx prepared by  Neha kewat digital learning
EYE CANCER.pptx prepared by Neha kewat digital learningNehaKewat
 
Eating Disorders in Athletes I Sports Psychology
Eating Disorders in Athletes I Sports PsychologyEating Disorders in Athletes I Sports Psychology
Eating Disorders in Athletes I Sports Psychologyshantisphysio
 

Recently uploaded (20)

Painting Rats White Angers Them to No End
Painting Rats White Angers Them to No EndPainting Rats White Angers Them to No End
Painting Rats White Angers Them to No End
 
SCOPE OF CRITICAL CARE ORGANIZATION
SCOPE OF CRITICAL CARE ORGANIZATIONSCOPE OF CRITICAL CARE ORGANIZATION
SCOPE OF CRITICAL CARE ORGANIZATION
 
LARYNGEAL CANCER.pptx Prepared by Neha Kewat
LARYNGEAL CANCER.pptx  Prepared by Neha KewatLARYNGEAL CANCER.pptx  Prepared by Neha Kewat
LARYNGEAL CANCER.pptx Prepared by Neha Kewat
 
CECT NECK NECK ANGIOGRAPHY CAROTID ANGIOGRAPHY
CECT NECK NECK ANGIOGRAPHY CAROTID ANGIOGRAPHYCECT NECK NECK ANGIOGRAPHY CAROTID ANGIOGRAPHY
CECT NECK NECK ANGIOGRAPHY CAROTID ANGIOGRAPHY
 
Annual Training
Annual TrainingAnnual Training
Annual Training
 
Hematinics and Erythropoietin- Pharmacology of Hematinics
Hematinics and Erythropoietin- Pharmacology of HematinicsHematinics and Erythropoietin- Pharmacology of Hematinics
Hematinics and Erythropoietin- Pharmacology of Hematinics
 
Assisted Living Care Residency - PapayaCare
Assisted Living Care Residency - PapayaCareAssisted Living Care Residency - PapayaCare
Assisted Living Care Residency - PapayaCare
 
ARTHRITIS.pptx Prepared by monika gopal Tutor
ARTHRITIS.pptx Prepared  by monika gopal TutorARTHRITIS.pptx Prepared  by monika gopal Tutor
ARTHRITIS.pptx Prepared by monika gopal Tutor
 
Drug stability and chemical Kinetics UNIT V
Drug stability and chemical Kinetics UNIT VDrug stability and chemical Kinetics UNIT V
Drug stability and chemical Kinetics UNIT V
 
The Power of Active listening - Tool in effective communication.pdf
The Power of Active listening - Tool in effective communication.pdfThe Power of Active listening - Tool in effective communication.pdf
The Power of Active listening - Tool in effective communication.pdf
 
Blood(The Applied Physiology) for Nurses.pptx
Blood(The Applied Physiology) for Nurses.pptxBlood(The Applied Physiology) for Nurses.pptx
Blood(The Applied Physiology) for Nurses.pptx
 
Introduction to Evaluation and Skin Benefits
Introduction to Evaluation and Skin BenefitsIntroduction to Evaluation and Skin Benefits
Introduction to Evaluation and Skin Benefits
 
Govt releases guidelines to curb unethical pharma sector practices.pdf
Govt releases guidelines to curb unethical pharma sector practices.pdfGovt releases guidelines to curb unethical pharma sector practices.pdf
Govt releases guidelines to curb unethical pharma sector practices.pdf
 
Presentation on COUNSELING. 1ST YEAR GNM ,COMMUNITY HEALTH NURSING
Presentation on  COUNSELING. 1ST YEAR GNM ,COMMUNITY HEALTH NURSINGPresentation on  COUNSELING. 1ST YEAR GNM ,COMMUNITY HEALTH NURSING
Presentation on COUNSELING. 1ST YEAR GNM ,COMMUNITY HEALTH NURSING
 
Diseases of the Respiratory System (J00-J99),.pptx
Diseases of the Respiratory System (J00-J99),.pptxDiseases of the Respiratory System (J00-J99),.pptx
Diseases of the Respiratory System (J00-J99),.pptx
 
Empathy Is a Stress Response - Choose Compassion instead
Empathy Is a Stress Response - Choose Compassion insteadEmpathy Is a Stress Response - Choose Compassion instead
Empathy Is a Stress Response - Choose Compassion instead
 
Living Well Every Day: Lyons Wellness Practice | Nurtures Your Complete Health
Living Well Every Day: Lyons Wellness Practice | Nurtures Your Complete HealthLiving Well Every Day: Lyons Wellness Practice | Nurtures Your Complete Health
Living Well Every Day: Lyons Wellness Practice | Nurtures Your Complete Health
 
Anatomy Shelf Notevbhhhhhhhhhhhhhhhs.pdf
Anatomy Shelf Notevbhhhhhhhhhhhhhhhs.pdfAnatomy Shelf Notevbhhhhhhhhhhhhhhhs.pdf
Anatomy Shelf Notevbhhhhhhhhhhhhhhhs.pdf
 
EYE CANCER.pptx prepared by Neha kewat digital learning
EYE CANCER.pptx prepared by  Neha kewat digital learningEYE CANCER.pptx prepared by  Neha kewat digital learning
EYE CANCER.pptx prepared by Neha kewat digital learning
 
Eating Disorders in Athletes I Sports Psychology
Eating Disorders in Athletes I Sports PsychologyEating Disorders in Athletes I Sports Psychology
Eating Disorders in Athletes I Sports Psychology
 

AngularJS and REST - #omrs15 tutorial

  • 1. AngularJS & REST Web Services #OMRS15 Darius Jazayeri darius@openmrs.org djazayeri@thoughtworks.com
  • 2. Download this... ● Download the Postman Chrome app ● https://www.getpostman.com/ ● We'll use it shortly
  • 3. REST ● REST = Representational State Transfer ● the software architectural style of the World Wide Web ● Levels of maturity – “just add a REST API on top of it” – Hypermedia as the engine of application state (HATEOAS) – http://martinfowler.com/articles/richardsonMaturityModel.html ● Using HTTP to interact with the server in a constrained machine-friendly way ● Constraints allow for scalability via standard web technologies (stateless, cacheable, layered)
  • 4. REST concepts ● Resource – URI that addresses a collection or item in the system – e.g. http://…/patient or http://…/patient/abc123 ● Representation – Specific state of the application. Based on one of these a client can change application state – Typically JSON or XML ● Hyperlinks – what client can do from a given state – e.g. {"rel": "next", "uri": "http://.../concept?startIndex=50"}
  • 5. REST in OpenMRS ● Started in 2011 ● Level 2 on the Richardson Maturity Model – http://martinfowler.com/articles/richardsonMaturityModel.html ● RESTful CRUD access to the OpenMRS platform data model ● We would like to be REST-first, but we're not there yet. This is still second-class to our Java API
  • 6. REST in OpenMRS ● Documentation on the wiki at “REST Web Services API For Clients” – https://wiki.openmrs.org/x/P4IaAQ – Big refresh coming in the next OpenMRS Platform release (Swagger!) ● Basic Authentication ● Paging ● Different sized representations (ref, default, full) – Also, custom representations
  • 7. REST in OpenMRS: Let's play ● Use the Postman Chrome app (or something else) ● http://demo.openmrs.org/openmrs/ws/rest/v1/concept ● .../concept?startIndex=50 ● .../concept?q=malaria ● .../concept/CIEL:160152 ● Add header… Accept: application/xml ● .../location?v=default
  • 8. REST in OpenMRS: Exercise ● Create an encounter for an existing patient that records their weight – You will need to find a patient, look up some other metadata, and figure out the encounter POST format
  • 9. AngularJS ● https://angularjs.org/ (by Google) – “HTML is great for declaring static documents, but it falters when we try to use it for declaring dynamic views in web-applications. AngularJS lets you extend HTML vocabulary for your application. The resulting environment is extraordinarily expressive, readable, and quick to develop.” ● Great framework for building client-side web applications ● Normally, one would build a complete app in AngularJS – Bahmni – OpenMRS Ebola Tablet App ● In the OpenMRS Reference Application we embed smaller AngularJS apps in a primarily- server-side application – but we're using AngularJS more and more ● Clone: https://github.com/djazayeri/openmrs-module-angulartutorial openmrs-core version 1.11.x modules: appui, uiframework, appframework, uicommons, webservices.rest
  • 10. AngularJS Concepts ● Directives – Think of this as an “HTML tag/attribute handler” – AngularJS code that is applied – Built-in directives; Also write your own ● Scopes – The dynamic thing that connects controller to view – Directives have a $scope (sometimes inherited from a parent, sometimes isolated) – $rootScope
  • 11. AngularJS Concepts ● Two-way data binding – <input ng-model="myVariable" type="text"/> – Editing the text box will update $scope.myVariable – Setting $scope.myVariable will update the text box ● Templates – with {{ interpolation }} ● Functions in the $scope – <button ng-click="doSomething()">...</button> ● See example1 in the tutorial module
  • 12. AngularJS Docs ● Developer Guide – https://docs.angularjs.org/guide ● API Reference – https://docs.angularjs.org/api ● More sophisticated: tutorial example2
  • 14. AngularJS +/- GSP ● OpenMRS Reference Application includes a non-standard mix of server-side GSP and client-side AngularJS code ● Filters – {{ visit.startDate | date }} ● tutorial example4
  • 15. AngularJS + REST in OpenMRS ● Using raw $http – Tutorial example5 ● Using ngResource – Tutorial example6 ● Services in uicommons module