Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Contentful's Fast Forward 2021 Day 2 Keynote

whitep4nth3r
November 04, 2021
61

Contentful's Fast Forward 2021 Day 2 Keynote

Join Salma Alam-Naylor and Stefan Judis on a journey through time where they explore how content management and software development has evolved.

The need for flexible content started with native mobile apps ten years ago, but the solution became so much more. Let's find out how Contentful's idea of API-first content unlocked speed, flexibility, developer happiness and most importantly — innovation on the web.

whitep4nth3r

November 04, 2021
Tweet

Transcript

  1. © 2021 Contentful
    Salma Alam-Naylor (she/her)
    Stefan Judis (he/him)
    Opening keynote
    D A Y 2

    View full-size slide

  2. © 2021 Contentful
    How did we get here?

    View full-size slide

  3. © 2021 Contentful
    Why is there no CMS
    for mobile applications?
    2011

    View full-size slide

  4. © 2021 Contentful
    JSON CMS

    View full-size slide

  5. © 2021 Contentful
    JSON CMS

    View full-size slide

  6. © 2021 Contentful

    View full-size slide

  7. © 2021 Contentful
    Sites were built entirely
    in-house
    2011

    View full-size slide

  8. © 2021 Contentful
    There was no serious
    Frontend development yet
    2011

    View full-size slide

  9. © 2021 Contentful
    Frontend and Backend
    development were divided
    2011

    View full-size slide

  10. © 2021 Contentful
    Everyone was forced to
    reinvent the wheel
    2011

    View full-size slide

  11. © 2021 Contentful
    Development was hard,
    expensive and slow
    2011

    View full-size slide

  12. © 2021 Contentful
    But… things started
    to change
    2011

    View full-size slide

  13. © 2021 Contentful
    Backbone.js
    Initial commit
    Sep 30 2010
    First release
    Oct 13 2010
    AngularJS
    Initial commit
    Jan 6 2010
    First release
    Oct 20 2010
    2010

    View full-size slide

  14. © 2021 Contentful
    ReactJS
    First public commit
    May 29 2013
    First public release
    July 2 2013
    2013

    View full-size slide

  15. © 2021 Contentful
    Frontend
    development
    evolved
    Cloud
    computing
    arrived
    Content
    requirements
    changed

    View full-size slide

  16. © 2021 Contentful
    [We need to] create mobile apps faster
    and combine the advantage of native
    mobile applications with the ease of
    maintenance of websites.
    — Sascha Konietzke, Co-Founder, CSO
    On Hacker News, some time in 2011

    View full-size slide

  17. © 2021 Contentful
    Today — content needs
    to go anywhere
    Now

    View full-size slide

  18. © 2021 Contentful
    The Internet of
    Things is vast

    View full-size slide

  19. © 2021 Contentful
    And you better
    be fast!
    Now

    View full-size slide

  20. © 2021 Contentful
    Fast development

    View full-size slide

  21. © 2021 Contentful
    Fast & cutting-edge products

    View full-size slide

  22. © 2021 Contentful
    Innovation

    View full-size slide

  23. © 2021 Contentful
    Builders and technology
    companies are
    changing the game
    Now

    View full-size slide

  24. © 2021 Contentful
    Since moving to Contentful we've been able to
    create our own stack that's super fast. [...] and
    all of that has reduced that page load time
    significantly, which [...] is a key indicator for
    Google to determine your ranking on pages.
    — Ty Magnin
    Director of Content and Web, UI Path

    View full-size slide

  25. © 2021 Contentful
    Today we are more connected.
    We work faster. And everything
    we do can be updated instantly.
    — Claudia Kim
    Vice President and Global Brand Director , Shiseido Professional

    View full-size slide

  26. © 2021 Contentful
    Contentful allows us to
    build new pages in just hours
    rather than days.
    — Candace Green-O’Leary
    Director of Marketing , Rangle

    View full-size slide

  27. © 2021 Contentful
    What makes them fast?

    View full-size slide

  28. © 2021 Contentful
    Technology
    Content

    View full-size slide

  29. © 2021 Contentful
    Content

    View full-size slide

  30. © 2021 Contentful
    API-first
    Keep on movin’

    View full-size slide

  31. © 2021 Contentful
    Structured and scaleable
    content
    Keep on movin’

    View full-size slide

  32. © 2021 Contentful

    View full-size slide

  33. © 2021 Contentful
    Open source tooling
    Keep on movin’

    View full-size slide

  34. © 2021 Contentful

    View full-size slide

  35. © 2021 Contentful
    Content Management
    System
    Keep on movin’

    View full-size slide

  36. © 2021 Contentful
    Content Management
    System
    Keep on movin’

    View full-size slide

  37. © 2021 Contentful
    Content Management
    Platform
    Keep on movin’

    View full-size slide

  38. © 2021 Contentful
    A platform enables
    business-specific workflows
    We heard from Paolo yesterday…

    View full-size slide

  39. © 2021 Contentful
    A platform lets you easily
    add new capabilities
    We heard from Paolo yesterday…

    View full-size slide

  40. © 2021 Contentful
    A platform brings
    teams and systems together
    We heard from Paolo yesterday…

    View full-size slide

  41. © 2021 Contentful
    Technology

    View full-size slide

  42. © 2021 Contentful
    Server +
    Database
    Set up
    Maintain
    CMS
    Set up
    Maintain
    Locked into
    front end
    templates
    Scale
    Manually up
    and down
    Down time!
    Things
    broke
    Updates
    Migrations
    Bad data

    View full-size slide

  43. © 2021 Contentful
    It was time to break free
    and go faster

    View full-size slide

  44. © 2021 Contentful
    The JAMstack
    2015

    View full-size slide

  45. © 2021 Contentful
    JavaScript
    APIs
    Markup

    View full-size slide

  46. © 2021 Contentful
    J
    A
    M

    View full-size slide

  47. © 2021 Contentful
    JS
    Client-side
    JavaScript
    APIs
    Services
    Decoupled from
    monolithic CMS’
    Markup
    Static HTML
    Served from
    CDNs
    PROFIT
    Move at the
    speed of light!

    View full-size slide

  48. © 2021 Contentful
    This brought a proper software
    architecture to the frontend workflow
    and empowered frontend developers
    to iterate much faster.
    “Modern Web Development on the Jamstack”
    — O’Reilly and Netlify (2019)

    View full-size slide

  49. © 2021 Contentful

    View full-size slide

  50. © 2021 Contentful

    View full-size slide

  51. © 2021 Contentful
    jamstack.org/generators

    View full-size slide

  52. © 2021 Contentful
    2021 Community Survey

    View full-size slide

  53. © 2021 Contentful

    View full-size slide

  54. © 2021 Contentful
    But… things started
    to change again

    View full-size slide

  55. © 2021 Contentful
    How has the
    JAMstack evolved?
    Now

    View full-size slide

  56. © 2021 Contentful
    Serverless
    Cloud computing arrived

    View full-size slide

  57. © 2021 Contentful
    mycool.app/hello.js

    View full-size slide

  58. © 2021 Contentful
    Built-in
    Modern hosting
    and frameworks
    provide
    Serverless
    functions
    Fast + cheap
    Do “back end stuff”
    without a full hosted
    application
    Accessible
    Low barrier to
    entry
    No server
    maintenance
    Auto scale
    Your CDN takes
    care of it!

    View full-size slide

  59. © 2021 Contentful
    “Modern Web Development on the Jamstack”
    — O’Reilly and Netlify (2019)
    Small frontend teams can take on
    large projects with little or no
    operations and backend support.

    View full-size slide

  60. © 2021 Contentful
    JAMstack is more than
    pre-rendered HTML files!
    Now

    View full-size slide

  61. © 2021 Contentful
    Jamstack
    JAMstack

    View full-size slide

  62. © 2021 Contentful
    JavaScript
    APIs
    Markup

    View full-size slide

  63. © 2021 Contentful
    JavaScript
    Pre-rendering
    Serverless functions
    Software as a Service
    Git integration
    JSON APIs Markup
    Automated releases
    Preview URLs
    Infrastructure
    CDNs at the edge
    JavaScript
    APIs
    Markup

    View full-size slide

  64. © 2021 Contentful
    Innovation

    View full-size slide

  65. © 2021 Contentful
    SSR
    HTML
    Generated at
    request-time,
    every time
    SSG
    Static HTML
    Generated at
    build-time
    ISR
    Static HTML
    Revalidated at
    intervals
    Regenerated via
    SSG in the
    background
    DPR
    Static HTML
    Generated once
    at request-time
    Cached at the
    edge for future
    requests

    View full-size slide

  66. © 2021 Contentful
    We love the Jamstack!

    View full-size slide

  67. © 2021 Contentful
    Tech term for the use of
    one's own products
    Dogfooding

    View full-size slide

  68. © 2021 Contentful
    contentful.com

    View full-size slide

  69. © 2021 Contentful

    View full-size slide

  70. © 2021 Contentful
    Content powers more
    than marketing sites

    View full-size slide

  71. © 2021 Contentful
    Internal people directory

    View full-size slide

  72. © 2021 Contentful

    View full-size slide

  73. © 2021 Contentful
    All of this —
    in just two weeks!

    View full-size slide

  74. © 2021 Contentful
    Thanks to the innovators [...], the
    amount of work that is possible by a
    single developer is now astronomical.
    “Modern Web Development on the Jamstack”
    — O’Reilly and Netlify (2019)

    View full-size slide

  75. © 2021 Contentful
    It’s all about speed!
    Keep on movin’

    View full-size slide

  76. © 2021 Contentful
    JSON CMS

    View full-size slide

  77. © 2021 Contentful
    Content was unlocked
    with new technology
    Keep on movin’

    View full-size slide

  78. © 2021 Contentful
    Speed was unlocked
    with new technology
    Keep on movin’

    View full-size slide

  79. © 2021 Contentful
    Innovation was unlocked
    with new technology
    Keep on movin’

    View full-size slide

  80. © 2021 Contentful
    Skills were unlocked
    with new technology
    Keep on movin’

    View full-size slide

  81. © 2021 Contentful
    I’m YOLO-deploying
    new projects every day!
    — Salma Alam-Naylor
    Jamstack enthusiast

    View full-size slide

  82. © 2021 Contentful
    Would you make your
    own bricks to build
    a new house?

    View full-size slide

  83. © 2021 Contentful
    You really don’t want to
    build your own CMS
    Don’t reinvent the wheel!

    View full-size slide

  84. © 2021 Contentful
    Or your own
    payment gateway
    Don’t reinvent the wheel!

    View full-size slide

  85. © 2021 Contentful
    Or your own
    analytics tools
    Don’t reinvent the wheel!

    View full-size slide

  86. © 2021 Contentful
    SaaS vendors for
    everything!

    View full-size slide

  87. © 2021 Contentful

    View full-size slide

  88. © 2021 Contentful
    Developers should be
    building your core product
    Don’t reinvent the wheel!

    View full-size slide

  89. © 2021 Contentful
    Trust the experts!

    View full-size slide

  90. © 2021 Contentful
    How do you connect your
    content with these technologies?

    View full-size slide

  91. © 2021 Contentful
    We love the
    Contentful App
    Framework

    View full-size slide

  92. © 2021 Contentful
    The App Framework is low-code tools
    for developers to build apps
    for content creation and
    orchestration

    View full-size slide

  93. © 2021 Contentful
    At the core of every
    business is content
    Don’t reinvent the wheel!

    View full-size slide

  94. © 2021 Contentful

    View full-size slide

  95. © 2021 Contentful
    Browse the
    marketplace or roll
    your own apps

    View full-size slide

  96. © 2021 Contentful
    Sidebar apps

    View full-size slide

  97. © 2021 Contentful
    Full page apps

    View full-size slide

  98. © 2021 Contentful
    Entry field apps

    View full-size slide

  99. © 2021 Contentful
    Backend apps

    View full-size slide

  100. © 2021 Contentful
    Innovation

    View full-size slide

  101. © 2021 Contentful
    Technology
    Content

    View full-size slide

  102. © 2021 Contentful
    contentful.com/developers

    View full-size slide

  103. © 2021 Contentful
    contentful.com/slack

    View full-size slide