Successfully reported this slideshow.
Your SlideShare is downloading. ×

Towards a UML and IFML mapping to GraphQL

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Loading in …3
×

Check these out next

1 of 13 Ad

More Related Content

Slideshows for you (20)

Similar to Towards a UML and IFML mapping to GraphQL (20)

Advertisement

More from Jordi Cabot (20)

Recently uploaded (20)

Advertisement

Towards a UML and IFML mapping to GraphQL

  1. 1. Towards a UML and IFML mapping to GraphQL Roberto Rodriguez-Echeverria, Javier L. Canovas, Jordi Cabot ICWE 2017
  2. 2. Motivation JSON APIs first-class citizens on the Web Primary means to data access
  3. 3. Motivation Payloads got larger and larger Performance issues (mobile-devices) Performance issues (more hits to DBs) Parsing Querying Storing JSON
  4. 4. Motivation GraphQL Schema (DB agnostic) Fetching, querying & providing data Clients get what they need
  5. 5. Motivation JSON MDE widely used in Web Engineering MDE MDE MDE MDE Even for REST APIs data publication INTEGRATION Poor integration of data backends MDE MDE MDE MDWE
  6. 6. Why not? MDE tool: UML/IFML to GraphQL Mapping from client-side artifacts Easy exploitation of data sources UML IFML GraphQL Schema MDE
  7. 7. How UML IFML GraphQL Schema M2M Transformation Grammar Metamodel https://github.com/SOM-Research/graphQL-xtext-grammar Client-side Server-side GraphQL Schema Editor Manually
  8. 8. Example
  9. 9. Example interface Character { id: ID! name: String! friends: [Character] appearsIn: [Episode]! } type Human implements Character { id: ID! name: String! friends: [Character] appearsIn: [Episode]! starships: [Starship] totalCredits: Int }
  10. 10. Example input ReviewInput { id: ID! stars: Int! commentary: String episode: Episode! } type Query { casting(episode: Episode): [Character] character(id:ID!): Character } type Mutation { createReview(episode: Episode, review: ReviewInput): ReviewInput } schema{ query: Query mutation: Mutation }
  11. 11. Conclusions and Future Work Our approach properly aligns with current MDWE approaches enabling designers to deploy their applications into GraphQL-enabled infrastructures. Just a first step, so next ideas: - Providing support for other languages: OCL - Reverse Engineering Non-MDE Web Apps to make them GraphQL-enabled - GraphQL schema generation starting from the Web APIs - Complex scenarios of data integration - Integration with other technologies - Hamza Ed-Douibi, Javier Luis Canovas Izquierdo and Jordi Cabot. A UML profile for OData Web API. ICWE 2017, Web Data Management Session 2, Wednesday
  12. 12. A small milestone in a Project “the goal of the project is to make the promise of open data a reality by giving non- technical users tools they can use to find and compose the information they need” http://modeling-languages.com/open-data-for-all-api/
  13. 13. A small milestone in a Project “the goal of the project is to make the promise of open data a reality by giving non- technical users tools they can use to find and compose the information they need” http://modeling-languages.com/open-data-for-all-api/

Editor's Notes

  • 15-17 minutes
  • Let’s begin by analyzing which are the main forces leading this work
    First of all, we consider Web APIs are first-class citizens on the Web, because most Web & Mobile apps make an extensive use of them to provide the user with live data and expanded functionality. At the same time, organizations all over the world have adopted Web APIs as the primary means to publish data on the Web.
  • However, Web APIs present some clear limitations:
    Server-side solutions and provide limited query capabilities
    Then response payloads get larger as requirements grew. Although different apps present different requirements, the most common solution is to return the same response to all those different clients
    As a result, performance quickly becomes an issue in two distinct ways.
    Firstly, mobile app sometimes struggle with the amount of effort it take to parse, deserialize, and store ever-growing JSON data.
    Secondly, composing those large JSON files imply more hits to DBs.
  • In order to partially alleviate those issues, FB has recently released GraphQL, which is a kind of DSL on top of your own backend data fetching logic.
    It does not connect directly to a database. It provides a way to describe a request for structured data, but it is then up to your backend to fulfill that request.
    GraphQL is not just for APIs access, it may replace them. But we plan to use it as a uniform data access over Web APIs mainly.
    GraphQL can fix the aforementioned performance problems because clients can now request only the data they need and the response then suppose to fetch just relevant data.
  • Let’s review now how MDE has been used for more than a decade in Web Engineering.
    MDE approaches widely used in the web engineering community to simplify app development.
    Even, some of them have been extended to support REST APIs for data publication.
    However, not enough done to really enable the publication and consumption of open data on the Web.
    Limitation: MDE tools fall short especially when integrating heterogeneous data backends, which are usually performed in an ad-hoc manner.
  • Why not use GraphQL to implement the integration of heterogeneous backends in a systematic way?
    In order to follow a MDE approach, we think we can easily extend current MDE tools for Web Engineering to generate GraphQL specifications from client-side development artifacts as UML and IFML.

    Data Model (UML) --> GraphQL Schema
    Data Interaction (IFML) --> GraphQL Schema
    Alternative: from Web APIs (more complex problem). There might be other alternatives but we are presenting that approach in this work.
    Key tool to facilitating the exploitation of online data sources.
    At the end GraphQL is a technology partially supporting our ideas of Web APIs integration.
    Two-way interaction: query & mutation.
  • From a MDE perspective, we decide to implement such process into Eclise Modeling Framework, so we can build and deploy an Eclipse plugin.
    Previously, we had to define an Xtext grammar from the GraphQL specification by FB.
    We did it by studying such specification and defining a Xtext Grammar which produces a GraphQL metamodel as by-product.
    Such GraphQL metamodel is useful to define the mapping as a model2model transformation.

    Talk about issues to get the specification of GraphQL IDL?

  • As an illustrative example we have partially modeled with UML and IFML a Web application resembling the star wars example from GraphQL specification.
    So in this case, we have defined a UML class diagram to represent the data model of this example, concerning human and droid characters, starships and so on. Additionally, we have modeled a basic interaction scenario by IFML so that the user can browse the heroes of the different episodes (in a traditional master/slave pattern) of the saga and they can also add reviews to a concrete episode.
  • From the UML class diagram we can extract the fundamental structure of the graphql schema which is basically defined as a graph of Type Objects.
    One of the main problems to solve is that hierarchies are not supported in GraphQL, a strategy to flatten these hierarchies (view in paper).
    For example, red box, from every interface or abstract class in UML, we generate an interface in GraphQL, as shown. Character abstract class becomes Character interface in GraphQL. All its properties and relationships are transformed into object members. Note that onetomany relationships generate members of type array.
    While, blue box is highlighting the generation of a type object from a UML class, whose members generation follows the same rules as before. Note that in GraphQL all the members of the implemented interface have to be redefined within the type object.
  • From the IFML model we can extract how that GraphQL schema would be used by means of queries and mutations.
    Every GraphQL has a query type and may have an additional mutation type as root types.
    They are defined as regular object types, but they are special because they define the entry point of every GraphQL query or mutation.
    In particular, GraphQL queries and mutations can be generated out of View Component definitions in the IFML model.
    {«list»} and \emph{«details»} stereotypes become queries since they define a view over a data entity by filtering which data objects to show (parameter binding) and which attributes to present (fields).
    Additionally, \emph{«form»} stereotyped view components would be transformed into mutations and input types, which collects the data fields parameterizing the invoked mutation.
    In our example, the \emph{«form»} view component and its associated action \texttt{Add} are transformed into the mutation \texttt{createReview} which is listed in the \texttt{Mutation} type (root mutation) of the resulting GraphQL schema.

  • This work I’ve just presented today is not more than a small milestones in a challenging project: ODA, whose main motto is ...
  • If you are interested, please get in touch
    Thank you very much for your attention

×