Web Abstractions 1
       data models, user interface templates, access control


                            Lecture 3



                                                   Course IN4308
       Eelco Visser
                                        Master Computer Science
  http://eelcovisser.org            Delft University of Technology
Wednesday, March 10, 2010
Application Model = Domain Model + Interaction Design




                                      System




                                Domain Model = State?
                            Interaction Design = Behaviour?
Wednesday, March 10, 2010
From high-level declarative model      Model



                  automatically generate



                      efficient & complete
                        implementation      System


Wednesday, March 10, 2010
How to model applications?




Wednesday, March 10, 2010
Wat makes a blog?




Wednesday, March 10, 2010
Wat makes a webshop?




Wednesday, March 10, 2010
Wat makes a chair?




Wednesday, March 10, 2010
Wat makes a chair?




Wednesday, March 10, 2010
Purpose
                              =>
                            Features
                               ?
Wednesday, March 10, 2010
Application Model = Collection of UML Diagrams




                            generate implementation from model
Wednesday, March 10, 2010
Details make the difference


               -      Consider
                      ★ interaction styles
                      ★ layout
                      ★ color schemes
                      ★ fonts
                      ★ personalization
                      ★ ...

               -      Parameters of the modeling language?
                      ★ generic, orthogonal definition?



Wednesday, March 10, 2010
UI programming is like assembly programming




                             concerned with screen components

                            not with interaction styles & concepts




                            want: declaration of user interaction

Wednesday, March 10, 2010
Problem: ‘UI tweaking’



          - code generation produces standardized/limited UI

                              Alternative: extra ‘hand coding’
                            e.g. UI templates not part of model


                                    Conclusion:
                 - modeling not adequate for interaction design
                    - user interface programming is low-level
Wednesday, March 10, 2010
instead of a general purpose solution (UML)

                        address specific class of software systems




Wednesday, March 10, 2010
Intermediate Goal for MDSD



                        develop better programming abstractions

                                    for horizontal domains

                              before tackling vertical domains




                            ‘let’s first make it easier to build web apps’
Wednesday, March 10, 2010
vertical (‘business’) domains




                     UI



                    DM



                    DB



                            accounting   horizontal (technical) domains
Wednesday, March 10, 2010
Properties of Domain-Specific Languages

               DSL design requires tradeoff between
               -      Expressivity
               -      Coverage
               -      Portability
               -      Interoperability
               -      Completeness
               -      Maintainability
               Extensive discussion in Quarter 4


Wednesday, March 10, 2010
The Web Domain


Wednesday, March 10, 2010
browser                         server              database




                                          app.war


                            a web application lives on the server
Wednesday, March 10, 2010
Concerns in Web Programming

               -      Persistent data
                      ★ data integrity
                      ★ search

               -      User interface
                      ★ data validation
                      ★ styling, layout
                      ★ navigation
                      ★ actions

               -      Workflow
                                               d mo re ...
               -      Access control         an
Wednesday, March 10, 2010
Problems in Web Programming



               -      Separate language for separate concerns
                      ★ (that’s good)

               -      Lack of integration
                      ★ no consistency checking
                      ★ different language styles

               -      Low-level configuration
                      ★ boilerplate code




Wednesday, March 10, 2010
WebDSL
          a domain-specific language for web applications




                  separation of concerns & linguistic integration


Wednesday, March 10, 2010
<screenshot webdsl.org>




Wednesday, March 10, 2010
<screenshot researchr>




Wednesday, March 10, 2010
<screenshot tweetview>




Wednesday, March 10, 2010
<screenshot yellowgrass>




Wednesday, March 10, 2010
<screenshot department>




Wednesday, March 10, 2010
Web Abstractions
                                     from a declarative point of view
                            (we’ll investigate underlying mechanisms later)

      Eelco Visser. WebDSL: A Case Study in Domain-Specific Language Engineering. GTTSE 2008: 291-373

Wednesday, March 10, 2010
Data Model Definition

   entity declaration
                                                   property




Wednesday, March 10, 2010
Data Model for Wiki

                                                  object identifier




                                          domain-specific type

Wednesday, March 10, 2010
Page Definition & Navigation


     page navigation (page call)




   page definiti
                            on
Wednesday, March 10, 2010
Displaying Data


                                              rendering values




     markup




Wednesday, March 10, 2010
Templates (Page Fragments)

         template definition




        template call
                                                         parameter




Wednesday, March 10, 2010
wiki.css

Wednesday, March 10, 2010
Modifying Data




     data
    binding

                   submit

                                             page
                                             flow
Wednesday, March 10, 2010
Core Wiki




                            navigate




        action
Wednesday, March 10, 2010
Core Wiki


                               navigate




        action
Wednesday, March 10, 2010
Creating Objects

                                         find/create object by id




Wednesday, March 10, 2010
Modifying Data




                                     pass string

Wednesday, March 10, 2010
Core Wiki


                               navigate creates page




        action
Wednesday, March 10, 2010
Page Index




Wednesday, March 10, 2010
Output Object = Navigation




Wednesday, March 10, 2010
Output Object = Navigation




  custom definition                                 default definition


Wednesday, March 10, 2010
Access Control

         Danny M. Groenewegen, Eelco Visser. Declarative Access Control for WebDSL:
         Combining Language Integration and Separation of Concerns. ICWE 2008: 175-188


Wednesday, March 10, 2010
Principal




                                  representation of principal




  turn on access control

Wednesday, March 10, 2010
Principal




                                  representation of principal




  turn on access control

Wednesday, March 10, 2010
Authentication




Wednesday, March 10, 2010
Authentication




Wednesday, March 10, 2010
Authentication




Wednesday, March 10, 2010
Registration




Wednesday, March 10, 2010
Access Control Rules

                                              ‘may access page f with
                                               argument x if boolean
                                                expression e is true’




Wednesday, March 10, 2010
Wiki Access Control Rules




                                                                     ‘anyone can view
                                                                    existing pages, only
                                                                    logged in users can
                                                                       create pages’


                            ‘only logged in users may edit pages’


Wednesday, March 10, 2010
Wiki Access Control Rules




Wednesday, March 10, 2010
Wiki Access Control Rules




Wednesday, March 10, 2010
Wiki Access Control Rules




Wednesday, March 10, 2010
Wiki Access Control Rules




Wednesday, March 10, 2010
More Web Abstractions

               -      Access control policies
                      ★ constraints over objects
                      ★ role-based AC, discretionary AC

               -      Data validation
                      ★ form validation
                      ★ data integrity

               -      Loading/accessing templates (partial pages)
                      ★ (AJAX)

               -      Search
               -      Workflow

Wednesday, March 10, 2010
The Future of Quarter 3

               -      Lecture 4
                      ★ More web abstractions

               -      Lecture 5
                      ★ What does WebDSL abstract from?
                      ★ Or: from DSL to Code

               -      Lecture 6
                      ★ Language workbenches
                      ★ Grammars

               -      Lecture 7
                      ★ Language modeling

Wednesday, March 10, 2010
Schedule
               Lab this week
                      ★ Finish & submit proposal Design 1
                      ★ Entity declarations
                      ★ Basic setup for user interface

               Cases
                      ★ Case 1: domain analysis in digital library domain
                      ★ Case 2: web abstractions

               Next
                      ★ Week 4 is ‘spring’ break; Week 5: lecture no, lab yes
                      ★ Week 6: access control policies, validation, search, ...

Wednesday, March 10, 2010

Model-Driven Software Development - Web Abstractions 1

  • 1.
    Web Abstractions 1 data models, user interface templates, access control Lecture 3 Course IN4308 Eelco Visser Master Computer Science http://eelcovisser.org Delft University of Technology Wednesday, March 10, 2010
  • 2.
    Application Model =Domain Model + Interaction Design System Domain Model = State? Interaction Design = Behaviour? Wednesday, March 10, 2010
  • 3.
    From high-level declarativemodel Model automatically generate efficient & complete implementation System Wednesday, March 10, 2010
  • 4.
    How to modelapplications? Wednesday, March 10, 2010
  • 5.
    Wat makes ablog? Wednesday, March 10, 2010
  • 6.
    Wat makes awebshop? Wednesday, March 10, 2010
  • 7.
    Wat makes achair? Wednesday, March 10, 2010
  • 8.
    Wat makes achair? Wednesday, March 10, 2010
  • 9.
    Purpose => Features ? Wednesday, March 10, 2010
  • 10.
    Application Model =Collection of UML Diagrams generate implementation from model Wednesday, March 10, 2010
  • 11.
    Details make thedifference - Consider ★ interaction styles ★ layout ★ color schemes ★ fonts ★ personalization ★ ... - Parameters of the modeling language? ★ generic, orthogonal definition? Wednesday, March 10, 2010
  • 12.
    UI programming islike assembly programming concerned with screen components not with interaction styles & concepts want: declaration of user interaction Wednesday, March 10, 2010
  • 13.
    Problem: ‘UI tweaking’ - code generation produces standardized/limited UI Alternative: extra ‘hand coding’ e.g. UI templates not part of model Conclusion: - modeling not adequate for interaction design - user interface programming is low-level Wednesday, March 10, 2010
  • 14.
    instead of ageneral purpose solution (UML) address specific class of software systems Wednesday, March 10, 2010
  • 15.
    Intermediate Goal forMDSD develop better programming abstractions for horizontal domains before tackling vertical domains ‘let’s first make it easier to build web apps’ Wednesday, March 10, 2010
  • 16.
    vertical (‘business’) domains UI DM DB accounting horizontal (technical) domains Wednesday, March 10, 2010
  • 17.
    Properties of Domain-SpecificLanguages DSL design requires tradeoff between - Expressivity - Coverage - Portability - Interoperability - Completeness - Maintainability Extensive discussion in Quarter 4 Wednesday, March 10, 2010
  • 18.
  • 19.
    browser server database app.war a web application lives on the server Wednesday, March 10, 2010
  • 20.
    Concerns in WebProgramming - Persistent data ★ data integrity ★ search - User interface ★ data validation ★ styling, layout ★ navigation ★ actions - Workflow d mo re ... - Access control an Wednesday, March 10, 2010
  • 21.
    Problems in WebProgramming - Separate language for separate concerns ★ (that’s good) - Lack of integration ★ no consistency checking ★ different language styles - Low-level configuration ★ boilerplate code Wednesday, March 10, 2010
  • 22.
    WebDSL a domain-specific language for web applications separation of concerns & linguistic integration Wednesday, March 10, 2010
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
    Web Abstractions from a declarative point of view (we’ll investigate underlying mechanisms later) Eelco Visser. WebDSL: A Case Study in Domain-Specific Language Engineering. GTTSE 2008: 291-373 Wednesday, March 10, 2010
  • 29.
    Data Model Definition entity declaration property Wednesday, March 10, 2010
  • 30.
    Data Model forWiki object identifier domain-specific type Wednesday, March 10, 2010
  • 31.
    Page Definition &Navigation page navigation (page call) page definiti on Wednesday, March 10, 2010
  • 32.
    Displaying Data rendering values markup Wednesday, March 10, 2010
  • 33.
    Templates (Page Fragments) template definition template call parameter Wednesday, March 10, 2010
  • 34.
  • 35.
    Modifying Data data binding submit page flow Wednesday, March 10, 2010
  • 36.
    Core Wiki navigate action Wednesday, March 10, 2010
  • 37.
    Core Wiki navigate action Wednesday, March 10, 2010
  • 38.
    Creating Objects find/create object by id Wednesday, March 10, 2010
  • 39.
    Modifying Data pass string Wednesday, March 10, 2010
  • 40.
    Core Wiki navigate creates page action Wednesday, March 10, 2010
  • 41.
  • 42.
    Output Object =Navigation Wednesday, March 10, 2010
  • 43.
    Output Object =Navigation custom definition default definition Wednesday, March 10, 2010
  • 44.
    Access Control Danny M. Groenewegen, Eelco Visser. Declarative Access Control for WebDSL: Combining Language Integration and Separation of Concerns. ICWE 2008: 175-188 Wednesday, March 10, 2010
  • 45.
    Principal representation of principal turn on access control Wednesday, March 10, 2010
  • 46.
    Principal representation of principal turn on access control Wednesday, March 10, 2010
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
    Access Control Rules ‘may access page f with argument x if boolean expression e is true’ Wednesday, March 10, 2010
  • 52.
    Wiki Access ControlRules ‘anyone can view existing pages, only logged in users can create pages’ ‘only logged in users may edit pages’ Wednesday, March 10, 2010
  • 53.
    Wiki Access ControlRules Wednesday, March 10, 2010
  • 54.
    Wiki Access ControlRules Wednesday, March 10, 2010
  • 55.
    Wiki Access ControlRules Wednesday, March 10, 2010
  • 56.
    Wiki Access ControlRules Wednesday, March 10, 2010
  • 57.
    More Web Abstractions - Access control policies ★ constraints over objects ★ role-based AC, discretionary AC - Data validation ★ form validation ★ data integrity - Loading/accessing templates (partial pages) ★ (AJAX) - Search - Workflow Wednesday, March 10, 2010
  • 58.
    The Future ofQuarter 3 - Lecture 4 ★ More web abstractions - Lecture 5 ★ What does WebDSL abstract from? ★ Or: from DSL to Code - Lecture 6 ★ Language workbenches ★ Grammars - Lecture 7 ★ Language modeling Wednesday, March 10, 2010
  • 59.
    Schedule Lab this week ★ Finish & submit proposal Design 1 ★ Entity declarations ★ Basic setup for user interface Cases ★ Case 1: domain analysis in digital library domain ★ Case 2: web abstractions Next ★ Week 4 is ‘spring’ break; Week 5: lecture no, lab yes ★ Week 6: access control policies, validation, search, ... Wednesday, March 10, 2010