The Evolution of Web Publishing from 1990 to 2020 - Joomlashack Conference 2020

As Steve Job once said, you can't connect the dots looking forward; you can only connect them looking backward.

This talk will take us back to the very beginning, 1991, the birth of html and the start of the HTMLolithic era, from there we will explore the Dynamolithic, Webpublolithic, and Sepratolithic eras, ... to eventually arrive in the Pageolitic era and to the birth of Joomlatools Pages.

Expect a fun entertaining talk, a mix of web technology and Joomla history, illustrated with very simple code examples. If you always wanted to know why things in Joomla are as they are, where Itemid's come from, or template overrides, or what the is up with the MVC thing developers talk about, and how all these dots once connected lead to Joomlatools Pages, then this talk is for you.

Event: https://www.joomlashack.com/conference/
Video: https://www.youtube.com/watch?v=srOb8VgEOmw

Transcript

1. http://www.joomlatools.com/developer @joomlatools
   There and back again
   A story about the evolution of web
   publishing from 1990 to 2020
   

   View Slide

2. View Slide

3. The HTMLolithic era
   In the beginning, let’s call it the HTMLolithic era, if you wanted to
   publish on the internet you had no choice but to learn HTML, and
   produce a static HTML page that you could link to by its Unique
   Resource Location (URL).
   

   View Slide

4. 1991, the www is born ….
   

   View Slide

5. 1
   The first web page went live on August 6, 1991. It was dedicated to information
   on the World Wide Web project and was made by Tim Berners-Lee. It ran on a
   NeXT computer at the European Organization for Nuclear Research, CERN.
   
   
   The first web page address was http://info.cern.ch/hypertext/WWW/
   TheProject.html.
   
   
   

   View Slide

6. 2
   http://info.cern.ch/hypertext/WWW/TheProject.html
   

   View Slide

7. 3
   The Hypertext Markup Language (HTML) is a simple markup language used to create
   hypertext documents that are platform independent. HTML documents are SGML
   documents with generic semantics that are appropriate for representing information
   from a wide range of domains.
   

   

   HTML markup can represent hypertext news, mail, documentation, and hypermedia;
   menus of options; database query results; simple structured documents with in-lined
   graphics; and hypertext views of existing bodies of information.
   
   
   From: https://www.w3.org/MarkUp/html-spec/
   

   View Slide

8. 4
   HTML 2.0 included everything from the original 1.0 specifications but added a few new features to
   the mix. » HTML 2.0 was the standard for website design until January 1997 and defined many
   core HTML features for the first time.
   
   
   For more history: https://www.yourhtmlsource.com/starthere/historyofhtml.html
   
   
   Features
   
   
   • Single file
   
   
   • Dynamic
   
   
   • Separated
   
   
   • Any-datasource
   
   
   • Copy-paste
   
   
   • Cacheable
   
   
   • Itemid
   

   View Slide

9. The Dynamolithic era
   In evolutionary terms, the next step for web publishing didn’t take too long.
   In the Dynamolithic era, instead of a single
   fl
   at
   fi
   le to build and display a
   page, pages were split up into re-useable blocks and could be coupled to a
   database.
   This made the task of publishing articles a lot easier as the developer could
   build multiple pages whilst reusing code for common areas like headers and
   footers, as well as import data that was held in a database, in order to
   display an HTML page.
   

   View Slide

10. 1995, PHP/FI is announced….
    

    View Slide

11. 5
    PHP development began in 1994 when Rasmus Lerdorf wrote several Common
    Gateway Interface (CGI) programs in C, which he used to maintain his personal
    homepage. He extended them to work with web forms and to communicate
    with databases, and called this implementation "Personal Home Page/
    Forms Interpreter" or PHP/FI.
    

    

    PHP/FI could be used to build simple, dynamic web applications. To
    accelerate bug reporting and improve the code, Lerdorf initially announced the
    release of PHP/FI as "Personal Home Page Tools (PHP Tools) version 1.0”.
    

    View Slide

12. 6
    Early PHP was not intended to be a new programming language, and grew organically, with Lerdorf
    noting in retrospect: "I don't know how to stop it, there was never any intent to write a
    programming language [...] I have absolutely no idea how to write a programming language, I just
    kept adding the next logical step on the way."
    A development team began to form and, after months of work and beta testing, officially released
    PHP/FI 2 in November 1997.
    

    View Slide

13. 7
    Zeev Suraski and Andi Gutmans rewrote the parser in 1997 and formed the base of
    PHP 3, changing the language's name to the recursive acronym PHP: Hypertext
    Preprocessor Afterwards, public testing of PHP 3 began, and the official launch
    came in June 1998.
    They then started a new rewrite of PHP's core, producing the Zend Engine in 1999
    They also founded Zend Technologies in Ramat Gan, Israel. On May 22, 2000,
    PHP 4, powered by the Zend Engine 1.0, was released.
    

    View Slide

14. 8
    Selecting data from an MySQL database and rendering HTML 4 using PHP. Features
    
    
    • Single file
    
    
    • Dynamic
    
    
    • Separated logic
    
    
    • Any-datasource
    
    
    • Copy-paste
    
    
    • Cacheable (yes but …)
    
    
    • Itemid
    

    View Slide

15. The Webpubolithic era
    Once the permanency of the internet had been established, individuals
    and businesses all over the world were clamouring to get a website
    online. This led to the natural evolution of web publishing systems that
    would allow non-developers to write and publish articles to a website.
    Like their ancestors in the dynamolithic, web publishing systems could
    be connected to a database in order to provide dynamic content to an
    otherwise static HTML page.
    

    View Slide

16. 2002, Mambo Open Source
    

    View Slide

17. 9
    Miro Construct Pty Ltd, registered in March 2000 in Melbourne […] starts development
    of Mambo, a closed-source, proprietary content management system. The company
    adopted a dual licensing policy, releasing Mambo Site Server under the GPL on
    Sourceforge in April 2001.
    

    

    From this time until the middle of 2002, Miro was the only developer of Mambo,
    contributing bug-fixes and security patches but not really extending the code or adding to
    the feature sets.
    

    

    With version 3.0.x, the open source Mambo Site Server becomes "Mambo Open
    Source" (commonly referred to as “MOS”). Robert Castley becomes Project Director of
    Mambo Open Source. By the end of 2002, Robert Castley had pulled together a volunteer
    team of developers. Mambo Open Source 4.0 is released.
    
    
    

    View Slide

18. 10
    Rendering a list of weblink in Mambo 4.5
    Features
    
    
    • Single file
    
    
    • Dynamic
    
    
    • Separated logic
    
    
    • Any-datasource
    
    
    • Copy-paste
    
    
    • Cacheable
    
    
    • Itemid
    

    View Slide

19. 11
    Mambo 4.0 menu item manager
    

    View Slide

20. 12
    Mambo 4.5 menu item manager
    

    View Slide

21. The Separatolithic era
    In the sepratolithic the number of websites on the internet multiplied exponentially,
    this was in response to the emergence of CMS systems that used separation of
    content and presentation architectures, for example using Model View Controller
    (MVC) design pattern. 

    

    Coupled to their mysql databases, to separate the logic of page building from the
    display of the page, CMSs made it painless and easy for even the least-technical
    person on the editorial team to create and publish an article as a HTML page. The
    developer could even use the same data to output a really simple syndicated (RSS)
    feed of a website’s articles.
    

    View Slide

22. 2008, Joomla 1.5.0 released
    

    View Slide

23. 13
    Designers will notice marked improvements with Joomla! 1.5. Under the hood, the code
    base was better organized by separating program logic from presentation logic.
    What this does is empower designers with 100% control over how Joomla!'s content is
    presented. Now, template designers can use custom layouts, often referred to as template
    overrides, instead of the typical table heavy output from Joomla! core.
    
    
    … Some highlights of the new framework include the document package which gives the
    extension developer control over the entire document rendered on any given page load
    whether it be an Atom or RSS feed, a PDF document, or a standard HTML page …
    

    

    … Perhaps one of the most powerful features of the framework is the new MVC based
    component objects. The clear separation between logic and presentation helps
    ensure code reusability and maintainability.
    
    
    From: https://www.joomla.org/announcements/release-news/4483-joomla-15-
    overview.html
    

    View Slide

24. 14
    Rendering a list of weblink in Joomla 1.5
    Features
    
    
    • Single file
    
    
    • Dynamic
    
    
    • Separated logic
    
    
    • Any-datasource
    
    
    • Copy-paste (partly)
    
    
    • Cacheable
    
    
    • Itemid
    

    View Slide

25. 15
    Joomla 1.5 menu item manager
    Evolution: http://joomla15.blogspot.com/2006/10/evolution-adding-new-menu-item.html
    

    View Slide

26. The Pageolithic era
    Welcome to the future, you have now stepped into the Pageolithic era. This era has
    heralded the dawn of the dynamic page generator. Using MVC structured code and
    consuming source-agnostic data, which can come from any combination of a mysql
    database; a
    fi
    lesystem; or even a webservice. Dynamic page generators will allow
    you to display your content in almost anyway you want. 

    

    You’re no longer limited to just HTML and RSS output, you can now publish your
    content as HTML web pages, as an RSS feed, as a CSV spreadsheet, even as a JSON
    API that you could, for instance, use to populate a mobile app. The possibilities are
    endless, limited only by your imagination.
    

    View Slide

27. 2020, Joomlatools Pages announced
    

    View Slide

28. 16
    Joomlatools Pages is a page generator inspired by the ideas and concepts of flat-file
    CMS systems like Grav and Statamic and static site generators like Jekyll.
    
    
    Pages is not a static site generator (SSG), Pages works in a dynamic, lazy and smart way.
    A page is dynamically generated, cached and only re-generated when its content or layout
    has changed.
    

    

    Pages has a flat-file bias, and doesn't require a database to work you can use any kind of
    data source, for example you could use, a Joomla component, a database table, a headless
    CMS like Strapi, or even a webservice like Airtable or Google Sheets.
    
    
    From: https://www.joomlatools.com/blog/developer/joomlatools-pages-the-page-
    generator-for-joomla
    

    View Slide

29. 17
    Rendering a list of weblink in Joomlatools Pages
    Features
    
    
    • Single file
    
    
    • Dynamic
    
    
    • Separated logic
    
    
    • Any-datasource
    
    
    • Copy-paste
    
    
    • Cacheable
    
    
    • Itemid
    

    View Slide

30. 18
    Joomlatools Pages provides a no-code MVC
    Model
    Template
    

    View Slide

31. 19
    Joomlatools Pages menu item manager (you still can create dummy menu items)
    

    View Slide

32. A little treat, Agrea.ph
    

    View Slide

33. https://www.agrea.ph
    

    View Slide

34. Rendering a list of weblink in Joomlatools Pages
    20
    https://github.com/johanjanssens/agrea.ph
    

    View Slide

35. Merry Christmas, Happy NY!
    

    View Slide

36. Johan Janssens

    Joomla Co-Founder / Former Lead Developer
    http://about.me/johanjanssens
    @johanjanssens
    johanjanssens
    johanjanssens
    

    View Slide

37. More Info
    http://twitter.com/joomlatools
    http://github.com/joomlatools
    http://facebook.com/joomlatools
    http://developer.joomlatools.com
    

    View Slide