SlideShare a Scribd company logo
Introducing Metaworks3 –




 •    Metaworks is ‘metadata-oriented framework’
 •    Concurrent Web-based (and mobile) Applications are degrading
      the Object’s own property – Cohesion of metadata.
 •    For example, you need to keep the properties’ type as same value
      in DHTML scripts, Server Object, Data Object(Hibernate), and the
      DDL script as well.
 •    Centralizing metadata and behaviors – it’s Object-Oriented
      Manner itself!
 •    Metaworks automatically synchronizes(or hides the operation) …
      •   Stubs for calling Javascript to the server function (using DWR)
      •   DAO object and relational query (not completely, SQL is still good)
      •   Keeps intuitive and Sophisticated Programming Model… Don’t be a
          dog!
 •    By managing the metadata
Introducing Metaworks3
   – Lifecycle of metadata


            General Approach:                                        Using Metaworks3:
    Spring MVC, JSON, jQuery, Hibernate

                    meta
                    data                                                        Controller
                       Domain
       Controller     class (java
                       version)                             View                                    DAO


                        You have to
        meta        Synchronize the gap      meta
                                                            Metaworks                             Metaworks
View    data                        DAO      data
                                                       Synchronizes the Proxy
                                                                                  meta
                                                                                             Synchronizes the Proxy
                                                                                  data
                                           Domain
       Domain
                                             class                              Domain
       class (JS
                                          (Hibernate                             Class
       version)
                                           version)                              (Java)
No more words, Seeing is believing:
 #Domain Class (Posting.java)                                 #Presentation (Posting.ejs)

 @Table(name = “fb_posting”)
 public class Posting extends MetaworksObject<IPosting>        <%=fields.document.here() %>
 implements IPosting{
                                                              <%
        String document;                                             if(mw3.when == mw3.WHEN_EDIT){
                @Id                                           %>
                public String getDocument() {                        <%=methods.share.here()%>
                        return document;                      <%
                }                                                    }
                public void setDocument(String document) {    %>
                        this.document = document;
                }
        @ServiceMethod
        public void share() throws Exception{
                createDatabaseMe();
        }
 }

#Application (application.html)                              #Result
<script>
        mw3.setContextWhen(mw3.WHEN_EDIT);
        mw3.locateObject(
             { document:"",
               __className:
"org.metaworks.example.Posting”
},
               null,
               'newEntry’
        );
</script>
...
<div id=‘newEntry’></div>
FaceBook example
Steps:
1. Recognizing what is (was) ‘Object’ in your
   application
2. Modeling the Objects
3. Face making and Context-awaring for the
   Objects
4. Creating Application with highly-abstracted
   programming Model – almost natural language!
 Humanity-Recovery !
Step 1.
Recognizing what is (was)
‘Object’ in your application
1. Recognizing Objects in facebook




   Person object           Posting object   Doc object   Group object
1. Recognizing Objects in facebook
1.1. Person objects in different ‘Context’




   Where: NORMAL                  Where: MINIMISED   Where: MEDIUM
1. Recognizing Objects in facebook
1.2. Posting objects in different ‘Context’




           Where: NORMAL                  Where: NORMAL   Where: MINIMISED
           When: EDIT                     When: VIEW      When: EDIT
Step 2.
Modeling the ‘Cohesive’
Objects
2. Modeling Objects - Posting object Design –
2.1. create interface

import org.metaworks.dao.IDAO;

public interface IPosting extends IDAO{

       public Person getWriter(); // 작성자
       public void setWriter(Person writer);

       public String getDocument(); // 글
       public void setDocument(String document);

       public boolean isLikeIt(); // 좋아요 여부
       public void setLikeIt(boolean likeIt);

}
2. Modeling Objects - Posting object Design –
2.2. add metadata

import org.metaworks.dao.IDAO;

@Table(name="Posting")
public interface IPosting extends IDAO{

       public Person getWriter();
       public void setWriter(Person writer);

       @Id
       public String getDocument();
       public void setDocument(String document);

       public boolean isLikeIt();
       public void setLikeIt(boolean likeIt);

       @ServiceMethod
       public void post() throws Exception;

       @ServiceMethod
       public void like() throws Exception;
}
2. Modeling Objects – Posting object
2.3. create implementation object

public class Posting extends Database<IPosting> implements IPosting{

       Person writer;
              public Person getWriter() {
                      return writer;
              }
              public void setWriter(Person writer) {
                      this.writer = writer;
              }

       String document;
               public String getDocument() {
                       return document;
               }
               public void setDocument(String document) {
                       this.document = document;
               }

       boolean likeIt;
             public boolean isLikeIt() {
                       return likeIt;
             }
             public void setLikeIt(boolean likeIt) {
                       this.likeIt = likeIt;
             }
}
2. Modeling Objects - Posting object
2.4. add behaviors
public class Posting extends Database<IPosting> implements IPosting{

       Person writer;
              public Person getWriter() {
                      return writer;
              }
              public void setWriter(Person writer) {
                      this.writer = writer;
              }

       String document;
               public String getDocument() {
                       return document;
               }
               public void setDocument(String document) {
                       this.document = document;
               }

       boolean likeIt;
             public boolean isLikeIt() {
                       return likeIt;
             }
             public void setLikeIt(boolean likeIt) {
                       this.likeIt = likeIt;
             }

       public void post() throws Exception{
               createDatabaseMe();
       }
       public void like() throws Exception{
               databaseMe().setLikeIt(true); //will automatically synchronize the value
       }
}
Step 3
Face making and Context-awaring for
the Objects
3. Face Making
3.1. creating ‘Face’ – Posting.ejs
 <table>

         <tr>
                 <td><%=fields.writer.here() %></td>
                 <td><%=fields.document.here() %>

 <%
         if(value.likeIt){
 %>
 You like this
 <% }else{%>

 <a onclick=<%=methods.like.caller()%>>좋아요</a>
 <%}%>

                 </td>

         </tr>

 </table>
3. Face Making
3.1. considering the Contexts – WHEN_EDIT
<%
          if(mw3.when == mw3.WHEN_EDIT){
                 value.document = 'Share your status...';
          }
%>
<table>
          <tr>
                   <td><%=fields.writer.here()%></td>
                   <td><%=fields.document.here()%>
<%
          if(mw3.when == mw3.WHEN_EDIT){
%>
          <%=methods.post.here()%>
<%
          }

         if(value.likeIt){
%>
You like this
<% }else{%>
         <%=methods.like.here()%>
<%}%>

<%
          if(mw3.when == mw3.WHEN_EDIT){
%>
                   <input type=button value="save">
<%
          }else{
%>
                   <input type=button onclick="<%=editFunction%>" value="edit"a>
<%
          }
%>
                   </td>
        </tr>
</table>
Next, Do 1~3 for Person object – Person.java & Person.ejs
#Person.java
                                                         #Person.ejs
public interface Person extends IDAO{
                                                         <%if (!value){%>
       @org.metaworks.Metadata(isKey = true)             Writer is not specified
       public String getName();                          <%}else{%>
       public void setName(String name);
                                                         <img src="<%=value.portraitURL%>" width=50><br>
       public int getAge();                              <b><%=value.name%></b>
       public void setAge(int age);
                                                         <%}%>
       @org.metaworks.Metadata(face="faces/image.ejs”)
       public String getPortraitURL();
       public void setPortraitURL(String portraitURL);

       public boolean isMyFried();
       public void setMyFried(boolean isMyFried);
}
Step 4
Creating Application with
highly-abstracted
programming Model –
Write a Novel or Poet, not
the alien language
4. Now, create the Application


          <script type="text/javascript">


                  lastEntryId = new MetaworksObject(
                           {       document:"",
                                   writer: loginUser,
                                   __className: "org.metaworks.example.Posting"
                           },

                           'newEntry'

                  );

          </script>

          <div id=”newEntry"></div>
Result
Conclusion
• No duplicated metadata mapping
  e.g. JSON object mapping in Spring Controller and DAO
  mapping for Hibernate.
 No errors from duplicated metadata source.
• Cohesive User Interface management by EJS-
  object mapping.
• Intuitive Programming Model – model and
  metadata-driven, not implementation-driven.

Only thing you have to do is… just forgetting the old
manners!
All the Source Code available here:
 http://www.largedocument.com/2/99c863a7/mw3
 _facebook_example_MetaworksObject.zip

 - it’s very early stage now! You are welcomed to
   participate this Open Source Project. E-mail me:
   jyjang at uengine.org
You are the mother, How about your Object ?

Mother cares All the things?                   Do that by himself ?

More Related Content

PPTX
웹기반 Ajax개발을 위한 프레임워크 - metaworks3 (메타웍스3)
PPTX
DOM and Events
ODP
Codemotion appengine
PDF
Windows 8 Training Fundamental - 1
PDF
Web 5 | JavaScript Events
PDF
Lecture17
PDF
First java-server-faces-tutorial-en
PDF
Session06 handling xml data
웹기반 Ajax개발을 위한 프레임워크 - metaworks3 (메타웍스3)
DOM and Events
Codemotion appengine
Windows 8 Training Fundamental - 1
Web 5 | JavaScript Events
Lecture17
First java-server-faces-tutorial-en
Session06 handling xml data

What's hot (20)

PDF
Linked In Presentation
PDF
Web 6 | JavaScript DOM
PPT
Simple Data Binding
PPTX
Javascript 2
PDF
Web 2 | CSS - Cascading Style Sheets
PDF
Data Binding and Data Grid View Classes
PDF
Architecture Components
PDF
Vaadin JPAContainer
DOCX
My Portfolio
PDF
Android - Saving data
PPTX
Data binding в массы! (1.2)
PDF
Backendless apps
PDF
Anton Minashkin Dagger 2 light
PPT
Spring data presentation
PDF
Symfony2 from the Trenches
KEY
Introduction to Restkit
PPTX
Bringing the light to the client with KnockoutJS
PDF
JS Fest 2019. Glenn Reyes. With great power comes great React hooks!
PDF
Doctrine MongoDB Object Document Mapper
PDF
Hibernate Tutorial
Linked In Presentation
Web 6 | JavaScript DOM
Simple Data Binding
Javascript 2
Web 2 | CSS - Cascading Style Sheets
Data Binding and Data Grid View Classes
Architecture Components
Vaadin JPAContainer
My Portfolio
Android - Saving data
Data binding в массы! (1.2)
Backendless apps
Anton Minashkin Dagger 2 light
Spring data presentation
Symfony2 from the Trenches
Introduction to Restkit
Bringing the light to the client with KnockoutJS
JS Fest 2019. Glenn Reyes. With great power comes great React hooks!
Doctrine MongoDB Object Document Mapper
Hibernate Tutorial
Ad

Viewers also liked (6)

PPTX
웹표준 프레임워크 메타웍스3의 적용 사례와 생산성
PPTX
스마트워크플레이스 플랫폼 프로세스 코디
PPTX
Metaworks3 Framework workbook 2015
PPTX
SaaS transformation with OCE - uEngineCloud
PDF
SAP 플랫폼을 활용한 혁신전략
PPTX
기업 잠재력과 엔터프라이즈 2.0
웹표준 프레임워크 메타웍스3의 적용 사례와 생산성
스마트워크플레이스 플랫폼 프로세스 코디
Metaworks3 Framework workbook 2015
SaaS transformation with OCE - uEngineCloud
SAP 플랫폼을 활용한 혁신전략
기업 잠재력과 엔터프라이즈 2.0
Ad

Similar to Metaworks3 (20)

PPT
比XML更好用的Java Annotation
PDF
Rails vs Web2py
PDF
Devoxx08 - Nuxeo Core, JCR 2, CMIS
DOC
No Coding Necessary: Building Confluence User Macros Cheat Sheet - Atlassian ...
PPTX
PPTX
Entity Framework Database and Code First
PDF
Powerful persistence layer with Google Guice & MyBatis
PDF
Data access 2.0? Please welcome: Spring Data!
PPTX
Spring dependency injection
PDF
Doctrine and NoSQL
PPT
jdbc_presentation.ppt
PDF
Multilingualism makes better programmers
PDF
Having Fun with Play
PDF
Doctrine for NoSQL
DOCX
Java beans
PDF
Introduction to Spring MVC
PDF
PDF
Михаил Анохин "Data binding 2.0"
PPTX
Entity Framework: Nakov @ BFU Hackhaton 2015
比XML更好用的Java Annotation
Rails vs Web2py
Devoxx08 - Nuxeo Core, JCR 2, CMIS
No Coding Necessary: Building Confluence User Macros Cheat Sheet - Atlassian ...
Entity Framework Database and Code First
Powerful persistence layer with Google Guice & MyBatis
Data access 2.0? Please welcome: Spring Data!
Spring dependency injection
Doctrine and NoSQL
jdbc_presentation.ppt
Multilingualism makes better programmers
Having Fun with Play
Doctrine for NoSQL
Java beans
Introduction to Spring MVC
Михаил Анохин "Data binding 2.0"
Entity Framework: Nakov @ BFU Hackhaton 2015

More from uEngine Solutions (20)

PPTX
이벤트스토밍과 BDD 를 혼합하여 소프트웨어 디자인과 테스트 자동화하기
PDF
Event storming based msa training commerce example add_handson_v3
PDF
Event storming based msa training commerce example v2
PDF
Event storming based msa training commerce example
PPTX
Event Storming and Implementation Workshop
PDF
designing, implementing and delivering microservices with event storming, spr...
PPTX
Microservice coding guide
PPTX
Safe cloud native transformation approaches
PPTX
microservice architecture public education v2
PPTX
유엔진 오픈소스 클라우드 플랫폼 (uEngine Microservice architecture Platform)
PPTX
Distributed transanction in microservices
PPTX
Micro service architecture
PPTX
Open Cloud Engine PaaS Snapshots
PDF
Private PaaS with Docker, spring cloud and mesos
PPTX
Bluemix paas 기반 saas 개발 사례
PPTX
Process Oriented Architecture
PPTX
Building multi tenancy enterprise applications - quick
PDF
Building multi tenancy enterprise applications
PPTX
Metaworks4 intro
PPTX
아키텍트대회 유엔진-장진영-Sw공학표준을 기반한 alm
이벤트스토밍과 BDD 를 혼합하여 소프트웨어 디자인과 테스트 자동화하기
Event storming based msa training commerce example add_handson_v3
Event storming based msa training commerce example v2
Event storming based msa training commerce example
Event Storming and Implementation Workshop
designing, implementing and delivering microservices with event storming, spr...
Microservice coding guide
Safe cloud native transformation approaches
microservice architecture public education v2
유엔진 오픈소스 클라우드 플랫폼 (uEngine Microservice architecture Platform)
Distributed transanction in microservices
Micro service architecture
Open Cloud Engine PaaS Snapshots
Private PaaS with Docker, spring cloud and mesos
Bluemix paas 기반 saas 개발 사례
Process Oriented Architecture
Building multi tenancy enterprise applications - quick
Building multi tenancy enterprise applications
Metaworks4 intro
아키텍트대회 유엔진-장진영-Sw공학표준을 기반한 alm

Metaworks3

  • 1. Introducing Metaworks3 – • Metaworks is ‘metadata-oriented framework’ • Concurrent Web-based (and mobile) Applications are degrading the Object’s own property – Cohesion of metadata. • For example, you need to keep the properties’ type as same value in DHTML scripts, Server Object, Data Object(Hibernate), and the DDL script as well. • Centralizing metadata and behaviors – it’s Object-Oriented Manner itself! • Metaworks automatically synchronizes(or hides the operation) … • Stubs for calling Javascript to the server function (using DWR) • DAO object and relational query (not completely, SQL is still good) • Keeps intuitive and Sophisticated Programming Model… Don’t be a dog! • By managing the metadata
  • 2. Introducing Metaworks3 – Lifecycle of metadata General Approach: Using Metaworks3: Spring MVC, JSON, jQuery, Hibernate meta data Controller Domain Controller class (java version) View DAO You have to meta Synchronize the gap meta Metaworks Metaworks View data DAO data Synchronizes the Proxy meta Synchronizes the Proxy data Domain Domain class Domain class (JS (Hibernate Class version) version) (Java)
  • 3. No more words, Seeing is believing: #Domain Class (Posting.java) #Presentation (Posting.ejs) @Table(name = “fb_posting”) public class Posting extends MetaworksObject<IPosting> <%=fields.document.here() %> implements IPosting{ <% String document; if(mw3.when == mw3.WHEN_EDIT){ @Id %> public String getDocument() { <%=methods.share.here()%> return document; <% } } public void setDocument(String document) { %> this.document = document; } @ServiceMethod public void share() throws Exception{ createDatabaseMe(); } } #Application (application.html) #Result <script> mw3.setContextWhen(mw3.WHEN_EDIT); mw3.locateObject( { document:"", __className: "org.metaworks.example.Posting” }, null, 'newEntry’ ); </script> ... <div id=‘newEntry’></div>
  • 4. FaceBook example Steps: 1. Recognizing what is (was) ‘Object’ in your application 2. Modeling the Objects 3. Face making and Context-awaring for the Objects 4. Creating Application with highly-abstracted programming Model – almost natural language!  Humanity-Recovery !
  • 5. Step 1. Recognizing what is (was) ‘Object’ in your application
  • 6. 1. Recognizing Objects in facebook Person object Posting object Doc object Group object
  • 7. 1. Recognizing Objects in facebook 1.1. Person objects in different ‘Context’ Where: NORMAL Where: MINIMISED Where: MEDIUM
  • 8. 1. Recognizing Objects in facebook 1.2. Posting objects in different ‘Context’ Where: NORMAL Where: NORMAL Where: MINIMISED When: EDIT When: VIEW When: EDIT
  • 9. Step 2. Modeling the ‘Cohesive’ Objects
  • 10. 2. Modeling Objects - Posting object Design – 2.1. create interface import org.metaworks.dao.IDAO; public interface IPosting extends IDAO{ public Person getWriter(); // 작성자 public void setWriter(Person writer); public String getDocument(); // 글 public void setDocument(String document); public boolean isLikeIt(); // 좋아요 여부 public void setLikeIt(boolean likeIt); }
  • 11. 2. Modeling Objects - Posting object Design – 2.2. add metadata import org.metaworks.dao.IDAO; @Table(name="Posting") public interface IPosting extends IDAO{ public Person getWriter(); public void setWriter(Person writer); @Id public String getDocument(); public void setDocument(String document); public boolean isLikeIt(); public void setLikeIt(boolean likeIt); @ServiceMethod public void post() throws Exception; @ServiceMethod public void like() throws Exception; }
  • 12. 2. Modeling Objects – Posting object 2.3. create implementation object public class Posting extends Database<IPosting> implements IPosting{ Person writer; public Person getWriter() { return writer; } public void setWriter(Person writer) { this.writer = writer; } String document; public String getDocument() { return document; } public void setDocument(String document) { this.document = document; } boolean likeIt; public boolean isLikeIt() { return likeIt; } public void setLikeIt(boolean likeIt) { this.likeIt = likeIt; } }
  • 13. 2. Modeling Objects - Posting object 2.4. add behaviors public class Posting extends Database<IPosting> implements IPosting{ Person writer; public Person getWriter() { return writer; } public void setWriter(Person writer) { this.writer = writer; } String document; public String getDocument() { return document; } public void setDocument(String document) { this.document = document; } boolean likeIt; public boolean isLikeIt() { return likeIt; } public void setLikeIt(boolean likeIt) { this.likeIt = likeIt; } public void post() throws Exception{ createDatabaseMe(); } public void like() throws Exception{ databaseMe().setLikeIt(true); //will automatically synchronize the value } }
  • 14. Step 3 Face making and Context-awaring for the Objects
  • 15. 3. Face Making 3.1. creating ‘Face’ – Posting.ejs <table> <tr> <td><%=fields.writer.here() %></td> <td><%=fields.document.here() %> <% if(value.likeIt){ %> You like this <% }else{%> <a onclick=<%=methods.like.caller()%>>좋아요</a> <%}%> </td> </tr> </table>
  • 16. 3. Face Making 3.1. considering the Contexts – WHEN_EDIT <% if(mw3.when == mw3.WHEN_EDIT){ value.document = 'Share your status...'; } %> <table> <tr> <td><%=fields.writer.here()%></td> <td><%=fields.document.here()%> <% if(mw3.when == mw3.WHEN_EDIT){ %> <%=methods.post.here()%> <% } if(value.likeIt){ %> You like this <% }else{%> <%=methods.like.here()%> <%}%> <% if(mw3.when == mw3.WHEN_EDIT){ %> <input type=button value="save"> <% }else{ %> <input type=button onclick="<%=editFunction%>" value="edit"a> <% } %> </td> </tr> </table>
  • 17. Next, Do 1~3 for Person object – Person.java & Person.ejs #Person.java #Person.ejs public interface Person extends IDAO{ <%if (!value){%> @org.metaworks.Metadata(isKey = true) Writer is not specified public String getName(); <%}else{%> public void setName(String name); <img src="<%=value.portraitURL%>" width=50><br> public int getAge(); <b><%=value.name%></b> public void setAge(int age); <%}%> @org.metaworks.Metadata(face="faces/image.ejs”) public String getPortraitURL(); public void setPortraitURL(String portraitURL); public boolean isMyFried(); public void setMyFried(boolean isMyFried); }
  • 18. Step 4 Creating Application with highly-abstracted programming Model – Write a Novel or Poet, not the alien language
  • 19. 4. Now, create the Application <script type="text/javascript"> lastEntryId = new MetaworksObject( { document:"", writer: loginUser, __className: "org.metaworks.example.Posting" }, 'newEntry' ); </script> <div id=”newEntry"></div>
  • 21. Conclusion • No duplicated metadata mapping e.g. JSON object mapping in Spring Controller and DAO mapping for Hibernate.  No errors from duplicated metadata source. • Cohesive User Interface management by EJS- object mapping. • Intuitive Programming Model – model and metadata-driven, not implementation-driven. Only thing you have to do is… just forgetting the old manners!
  • 22. All the Source Code available here: http://www.largedocument.com/2/99c863a7/mw3 _facebook_example_MetaworksObject.zip - it’s very early stage now! You are welcomed to participate this Open Source Project. E-mail me: jyjang at uengine.org
  • 23. You are the mother, How about your Object ? Mother cares All the things? Do that by himself ?