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

Wanna scale up? Make sure your CMS is ready for it!

Wanna scale up? Make sure your CMS is ready for it!

22725c2d3eb331146549bf0d5d3c050c?s=128

stefan judis

July 15, 2021
Tweet

Transcript

  1. @stefanjudis Wanna scale up? Make sure your CMS is ready

    for it!
  2. @stefanjudis www.stefanjudis.com Heyo, I'm Stefan!

  3. It's a great time to be a developer. The world

    is full of APIs!
  4. None
  5. jamstack.org

  6. stefanjudis.com

  7. None
  8. css-tricks.com/the-all-powerful-front-end-developer/

  9. Buying is almost always cheaper and faster than building.

  10. The concept of decoupled content management

  11. Content platform architecture Content Delivery Content Management Content Preview Scalable

    APIs READ READ / WRITE READ Editor Interface
  12. Content platform architecture Editor Interface You and not your CMS

    make technology decisions. Content Delivery Content Management Content Preview Scalable APIs READ READ / WRITE READ
  13. APIs at Scale !== Content at Scale

  14. Building a single site is "easy"

  15. None
  16. None
  17. What's important when content requirements scale up?

  18. How fast can you move? What's your TTC? (time to

    content)
  19. Are your developers productive (and happy) working with the platform?

  20. 0 % 14 % 28 % 42 % 56 %

    70 % Better compensation Wanting to work with new tech Curious about new opportunities Better work/life balance insights.stackover fl ow.com/survey/2020#work-job-hunt-factors Developer job hunt factors
  21. 0 % 14 % 28 % 42 % 56 %

    70 % Better compensation Wanting to work with new tech Curious about new opportunities Better work/life balance insights.stackover fl ow.com/survey/2020#work-job-hunt-factors Developer job hunt factors 58.5%
  22. Do your marketers and content creators like the platform?

  23. Does the platform integrate well with other systems?

  24. Is it fl exible?

  25. Does it scale? (whatever this means)

  26. A few lessons learned from growing with our customers

  27. Content modelling is an art

  28. Title Body Tags Author Description Title Body Tags Author Description

    Title Body Tags Author Description Posts / Pages Title Body Tags Description Author ARTICLE Name Date Talk EVENT Name Number of slides TALK Speaker A content graph Name Pro fi le image PERSON Avoid content duplication. De fi ne the required content structures.
  29. Title Body Tags Description Author ARTICLE Name Date Talk EVENT

    Name Number of slides TALK Speaker Name Pro fi le image PERSON RESTful APIs with Client Libraries
  30. Title Body Tags Description Author ARTICLE Name Date Talk EVENT

    Name Number of slides TALK Speaker Name Pro fi le image PERSON RESTful APIs with Client Libraries Fetch what you need
  31. Title Body Tags Description Author ARTICLE Name Date Talk EVENT

    Name Number of slides TALK Speaker Name Pro fi le image PERSON RESTful APIs with Client Libraries Fetch what you need
  32. contentmodel.io

  33. None
  34. Consider your content model very carefully!

  35. Avoid WYSIWYG and Markdown content!

  36. HTML in your content

  37. Hardcoded links

  38. JSON-based Rich Text

  39. { "nodeType": "document" , "data": {} , "content": [ {

    "nodeType": "paragraph" , "data": {} , "content": [ { "nodeType": "text" , "value": "This text is " , "data": {} , "marks": [ ] } , { "nodeType": "text" , "value": "important" , , Rich Text is clean JSON! const options = { renderMark: { [MARKS.BOLD] : text = > <Bold>{text} < / Bold>, }, renderNode: { [BLOCKS.PARAGRAPH] : (node, children) = > { return <Text>{children} < / Text>; } }, renderText: text = > text.replace('!', '?'), }; documentToReactComponents(document, options);
  40. github.com/contentful/rich-text

  41. You will make mistakes in your content model

  42. Name Pro fi le image PERSON First Name Pro fi

    le image PERSON Last Name
  43. There has to be a way for programmatic content and

    content model changes. module.exports = function (migration) { const categoryFromTags = (tagList) = > { if (tagList.includes('javascript')) { return 'Development' } return 'General'; } migration.transformEntries({ contentType: 'blogPost', from: ['tags'], to: ['category'], transformEntryForLocale: async (from, locale) = > { return { category: categoryFromTags(from.tags[locale]) } } }); }
  44. But even then, you can't "just YOLO " it! *

    You Only Live Once – similar to "Just do it"!
  45. Environments MASTER

  46. Environments MASTER

  47. Environments MASTER Create development environment. (a copy of MASTER) FEATURE

  48. Environments MASTER FEATURE Change content and content model. Write a

    migration script.
  49. Environments MASTER FEATURE Apply migration to MASTER.

  50. Environments and Aliases RELEASE-1 RELEASE-2 Create a MASTER alias.

  51. Environments and Aliases RELEASE-1 RELEASE-2

  52. Environments and Aliases RELEASE-1 RELEASE-2

  53. Environments and Aliases RELEASE-1 RELEASE-2 Roll back if you need

    to.
  54. Safe development environments CI/CD ready Quick migrations and rollbacks Environments

    and Aliases
  55. www.contentful.com/help/cms-as-code/ www.contentful.com/developers/docs/concepts/deployment-pipeline/

  56. Developers have to be safe to be productive.

  57. Your content creators have to feel at home.

  58. Stefan First Name PERSON Judis Last Name Content Delivery API

    Published content Content Preview Stefano First Name PERSON Judis Last Name Content Preview API Unpublished content
  59. Preview API

  60. The editing interface has to be extensible!

  61. Content platform architecture Editor Interface Content Delivery Content Management Content

    Preview Scalable APIs READ READ / WRITE READ How do to extend and adjust an interface in the cloud?
  62. The App Framework

  63. None
  64. Custom validations Open source components The App Framework

  65. f36.contentful.com contentful- fi eld-editors.netlify.app

  66. A 3rd party ecosystem

  67. None
  68. . . . . . .

  69. None
  70. Access controls are essential in larger teams

  71. Only certain people should be allowed to change the content

    model!
  72. Image optimisation

  73. None
  74. None
  75. None
  76. None
  77. None
  78. Isn't it "just" an interface on a NoSQL database?

  79. Summary Flexible and fast content modelling CI/CD ready via programmatic

    content changes Environments and aliases JSON based Rich Text Preview functionality Roles & permissions Extensible interface Work fl ows Images API 3rd party integrations Uptime, SLAs, support Developer community Open source libraries
  80. www.smashingmagazine.com/2021/07/how-to-choose-a-headless-cms/

  81. @stefanjudis www.stefanjudis.com news.stefanjudis.com Thanks.