👉 [Visit the DatoCMS homepage](https://www.datocms.com) or see [What is DatoCMS?](#what-is-datocms) --- # react-datocms   [](https://travis-ci.org/datocms/react-datocms) A set of components and utilities to work faster with [DatoCMS](https://www.datocms.com/) in React environments. Integrates seamlessy with DatoCMS's [GraphQL Content Delivery API](https://www.datocms.com/docs/content-delivery-api) and [Real-time Updates API](https://www.datocms.com/docs/real-time-updates-api). # Installation ``` npm install react-datocms ``` # Documentation This package offers different components and hooks. Please refer to one of the following pages to learn more about a specific area of interest: * [`` and `` components for responsive/progressive images](./docs/image.md) * [`` component](./docs/structured-text.md) * [`` component](./docs/video-player.md) * [`` component and `useContentLink()` hook for Visual Editing with click-to-edit overlays](./docs/content-link.md) * [`useQuerySubscription()` hook for live, real-time updates of content](./docs/live-real-time-updates.md) * [`useSiteSearch()` hook to render a DatoCMS Site Search form widget](./docs/site-search.md) * [`renderMetaTags()` and other helpers to render social share, SEO and Favicon meta tags](./docs/meta-tags.md) # Demos For fully working examples take a look at our [examples directory](https://github.com/datocms/react-datocms/tree/master/examples). Live demo: [https://react-datocms-example.netlify.app/](https://react-datocms-example.netlify.app/) # Development This repository contains a number of demos/examples. You can use them to locally test your changes. ``` cd examples npm setup npm run start ``` --- # What is DatoCMS? [DatoCMS](https://www.datocms.com/) is the REST & GraphQL Headless CMS for the modern web. Trusted by over 25,000 enterprise businesses, agencies, and individuals across the world, DatoCMS users create online content at scale from a central hub and distribute it via API. We ❤️ our [developers](https://www.datocms.com/team/best-cms-for-developers), [content editors](https://www.datocms.com/team/content-creators) and [marketers](https://www.datocms.com/team/cms-digital-marketing)! **Why DatoCMS?** - **API-First Architecture**: Built for both REST and GraphQL, enabling flexible content delivery - **Just Enough Features**: We believe in keeping things simple, and giving you [the right feature-set tools](https://www.datocms.com/features) to get the job done - **Developer Experience**: First-class TypeScript support with powerful developer tools **Getting Started:** - ⚡️ [Create Free Account](https://dashboard.datocms.com/signup) - Get started with DatoCMS in minutes - 🔖 [Documentation](https://www.datocms.com/docs) - Comprehensive guides and API references - ⚙️ [Community Support](https://community.datocms.com/) - Get help from our team and community - 🆕 [Changelog](https://www.datocms.com/product-updates) - Latest features and improvements **Official Libraries:** - [**Content Delivery Client**](https://github.com/datocms/cda-client) - TypeScript GraphQL client for content fetching - [**REST API Clients**](https://github.com/datocms/js-rest-api-clients) - Node.js/Browser clients for content management - [**CLI Tools**](https://github.com/datocms/cli) - Command-line utilities for schema migrations (includes [Contentful](https://github.com/datocms/cli/tree/main/packages/cli-plugin-contentful) and [WordPress](https://github.com/datocms/cli/tree/main/packages/cli-plugin-wordpress) importers) **Official Framework Integrations** Helpers to manage SEO, images, video and Structured Text coming from your DatoCMS projects: - [**React Components**](https://github.com/datocms/react-datocms) - [**Vue Components**](https://github.com/datocms/vue-datocms) - [**Svelte Components**](https://github.com/datocms/datocms-svelte) - [**Astro Components**](https://github.com/datocms/astro-datocms) **Additional Resources:** - [**Plugin Examples**](https://github.com/datocms/plugins) - Example plugins we've made that extend the editor/admin dashboard - [**Starter Projects**](https://www.datocms.com/marketplace/starters) - Example website implementations for popular frameworks - [**All Public Repositories**](https://github.com/orgs/datocms/repositories?q=&type=public&language=&sort=stargazers)