kickstartDS GraphQL-API PoC

Query

query MyQuery {
  allKickstartDsPage {
    edges {
      node {
        content {
          content {
            ... on CountUpComponent {
              topic
              text
              to
            }
            ... on ContentBoxComponent {
              image
              topic
            }
            ... on StorytellingComponent {
              backgroundColor
              storytellingBox: box {
                text
              }
            }
            ... on VisualComponent {
              height
              overlay
              visualBox: box {
                text
              }
            }
            ... on HeadlineComponent {
              content
              subheadline
            }
            ... on TextMediaComponent {
              type
              textmediaText: text
            }
            ... on TeaserBoxComponent {
              topic
              text
            }
          }
        }
        heading
      }
    }
  }
}

Response

{
  "data": {
    "allKickstartDsPage": {
      "edges": [
        {
          "node": {
            "content": [
              {
                "content": [
                  {
                    "image": "https://picsum.photos/seed/kdscontentbox/500/300",
                    "topic": "Lorem Ipsum"
                  }
                ]
              }
            ],
            "heading": "Content Box"
          }
        },
        {
          "node": {
            "content": [
              {
                "content": [
                  {
                    "topic": "Employees",
                    "text": "Consequuntur est quia atque eum ducimus. Consequatur fugiat hic eos perferendis. Libero unde omnis dolorem maxime occaecati sapiente distinctio. Consectetur non placeat dolorem est animi.",
                    "to": 30782
                  },
                  {
                    "topic": "Locations (worldwide) ",
                    "text": "Consequuntur est quia atque eum ducimus. Consequatur fugiat hic eos perferendis. Libero unde omnis dolorem maxime occaecati sapiente distinctio. Consectetur non placeat dolorem est animi.",
                    "to": 387
                  },
                  {
                    "topic": "Country orgs (worldwide) ",
                    "text": "Consequuntur est quia atque eum ducimus. Consequatur fugiat hic eos perferendis. Libero unde omnis dolorem maxime occaecati sapiente distinctio. Consectetur non placeat dolorem est animi.",
                    "to": 42
                  }
                ]
              },
              {
                "content": [
                  {
                    "topic": "Shipments",
                    "text": "Consequuntur est quia atque eum ducimus. Consequatur fugiat hic eos perferendis. Libero unde omnis dolorem maxime occaecati sapiente distinctio. Consectetur non placeat dolorem est animi.",
                    "to": 78616400
                  },
                  {
                    "topic": "Tonnage",
                    "text": "Consequuntur est quia atque eum ducimus. Consequatur fugiat hic eos perferendis. Libero unde omnis dolorem maxime occaecati sapiente distinctio. Consectetur non placeat dolorem est animi.",
                    "to": 39793200
                  }
                ]
              }
            ],
            "heading": "Dachser in figures 2020"
          }
        },
        {
          "node": {
            "content": [
              {
                "content": [
                  {
                    "height": "small",
                    "overlay": false,
                    "visualBox": {
                      "text": "Website- und Frontend-Entwicklung seit 2008"
                    }
                  }
                ]
              },
              {
                "content": [
                  {
                    "content": "Wir entwickeln Websites.",
                    "subheadline": null
                  },
                  {
                    "type": "text-media",
                    "textmediaText": "Dies tun wir auf Basis einer Idee, die sich von anderen unterscheidet: **Pattern**\\\nPattern (Deutsch: Muster) sind bewährte Lösungsschablonen für wiederkehrende Aufgabenstellungen."
                  },
                  {
                    "content": "Warum sind Pattern so gut?",
                    "subheadline": null
                  },
                  {
                    "type": "text-media",
                    "textmediaText": "Pattern ermöglichen schnelles Arbeiten und Automatisierung. Sie bieten dennoch Freiraum für Anpassungen und Individualität. Wenn Sie schon einmal zu lange auf Ergebnisse gewartet haben oder eine fertige Lösung nicht gehalten hat, was sie versprochen hat, verstehen Sie warum beides so wichtig ist."
                  },
                  {
                    "content": "Pattern stecken bei uns in allem drin.",
                    "subheadline": null
                  },
                  {
                    "type": "text-media",
                    "textmediaText": "Insbesondere nutzen wir Pattern im Bereich [Frontend](https://ruhmesmeile.com/web-frontends/website-frontends). Frontends, die wir entwickeln und auf die es im globalen Web so sehr ankommt, profitieren enorm von diesem Entwicklungsansatz. Pattern stecken bei uns aber auch in [Websites](https://ruhmesmeile.com/websites), die wir mit Content Management Systemen wie [TYPO3](https://ruhmesmeile.com/typo3-cms) oder [Netlify CMS](https://ruhmesmeile.com/netlify-cms) umsetzen.\\\nBei uns stecken Pattern in jedem Projekt."
                  }
                ]
              },
              {
                "content": [
                  {
                    "image": "https://ruhmesmeile.com/fileadmin/_processed_/7/8/csm_Agentur-und-Kunden_6accaa9169.jpg",
                    "topic": "Für Kunden"
                  },
                  {
                    "image": "https://ruhmesmeile.com/fileadmin/_processed_/5/0/csm_Entwickler-Setup_cc528d479f.jpg",
                    "topic": "Für Entwickler und Agenturen"
                  }
                ]
              },
              {
                "content": [
                  {
                    "backgroundColor": "#edf3f3",
                    "storytellingBox": {
                      "text": "Im Bereich der Webentwicklung mit Content Management Systemen greifen wir vor allem auf zwei Technologien zurück:\n\nAuf die [Plattformlösung TYPO3](https://ruhmesmeile.com/typo3-cms/typo3-als-plattform), für maximale Flexibilität und\\\nauf [Netlify CMS](https://ruhmesmeile.com/netlify-cms/netlify-websites), im Bereich der Headless CMS Entwicklung."
                    }
                  },
                  {
                    "backgroundColor": null,
                    "storytellingBox": {
                      "text": "[Erfahren Sie mehr](https://ruhmesmeile.com/websites/website-ux-und-webdesign) zu den Qualitätsfaktoren User Experience, Usability, Kompatibilität und Individualität."
                    }
                  },
                  {
                    "backgroundColor": "#f0f0f0",
                    "storytellingBox": {
                      "text": "Benötigen Sie für eine Kampagne eine [Landing Page](https://ruhmesmeile.com/websites/landing-pages) oder wollen Sie mit Hilfe von [Web Analytics](https://ruhmesmeile.com/websites/web-analytics) Ihre Website optimieren?\n\nAls Ihr Sparringspartner entwickeln wir mit Ihnen gemeinsam die passende Online Marketing Strategie und leisten [Online Marketing Beratung](https://ruhmesmeile.com/websites/online-marketing-beratung)."
                    }
                  },
                  {
                    "backgroundColor": null,
                    "storytellingBox": {
                      "text": "Services für [Website-Frontends](https://ruhmesmeile.com/web-frontends/website-frontends)\n\nBeratung zu [Frontend-Architektur](https://ruhmesmeile.com/web-frontends/frontend-architektur)\n\nLeistungen zur [Frontend-Entwicklung](https://ruhmesmeile.com/web-frontends/frontend-entwicklung)"
                    }
                  },
                  {
                    "height": "small",
                    "overlay": false,
                    "visualBox": {
                      "text": "Wenn Sie Fragen haben oder selbst vor der Umsetzung von einem Webprojekt stehen, nehmen wir uns gern für Sie Zeit."
                    }
                  }
                ]
              },
              {
                "content": [
                  {
                    "topic": "HPP Architekten",
                    "text": "Corporate Website Relaunch auf Basis von TYPO3"
                  },
                  {
                    "topic": "Dachser",
                    "text": "Digitales Design-System"
                  }
                ]
              }
            ],
            "heading": "ruhmesmeile Startpage"
          }
        }
      ]
    }
  },
  "extensions": {}
}