support (opens in a new tab)
status (opens in a new tab)
prepr.io (opens in a new tab)
  • Quick start guide
  • Changelog
  • Roadmap
  • GUIDES
  • Project setup
    • Step-by-step guide
    • Prepr overview
    • Architecture scenarios
      • Shared schema
      • Shared content
    • Setting up environments
    • Setting up previews
    • Setting up visual editing
    • Migrating content
    • Managing users
    • Managing roles & permissions
    • Setting up SSO
    • Managing your subscription
  • Content modeling
    • Fundamentals
    • Examples
      • Blog
      • Page
      • App config
    • Best practices
    • Managing models
    • Field types
    • Defining the Asset model
    • Managing components
    • Managing enumerations
    • Setting up a built-in remote source
    • Creating a custom remote source
  • Connecting a front-end framework
    • Next.js
      • Quick start guide
      • Complete guide
        • Introduction
        • Set up a project
        • Make it dynamic
        • Set up data collection
        • Add A/B testing
        • Add personalization
        • Install preview bar
      • Prepr Next.js package
      • Caching strategies
    • Nuxt
      • Quick start guide
      • Complete guide
        • Introduction
        • Set up a project
        • Make it dynamic
        • Set up data collection
        • Add A/B testing
        • Add personalization
    • Laravel
      • Quick start guide
      • Complete guide
        • Introduction
        • Set up a project
        • Make it dynamic
        • Set up data collection
        • Add A/B testing
        • Add personalization
      • GraphQL SDK
      • Rest SDK
    • React
    • Vue.js
      • Quick start guide
    • Angular
      • Quick start guide
    • Gatsby
      • Quick start guide
    • Node.js
    • PHP
      • Quick start guide
      • Graphql SDK
      • Rest SDK
    • Astro
      • Quick start guide
    • Svelte
      • Quick start guide
    • Using an SDK
  • Development
    • Fundamentals
    • Best practices
      • Assets
        • Images
        • Video & audio
        • Live video stream
        • Files
      • CSR/SSR/SSG
      • Previews
      • Redirects
      • SEO
      • TypeScript
      • Webhooks
    • Working with CI/CD
      • Syncing content
      • Syncing a schema
      • Exporting and importing a schema
  • Content management
    • Managing content
      • Managing content items
      • SEO & Readability
      • Creating rich content
    • Managing assets
      • Introduction
      • Managing assets
      • Using assets in content items
    • Localizing content
    • Collaboration
  • Data collection
    • Fundamentals
    • Step-by-step guide
    • Setting up tracking
    • Recording events
    • Tracking data using REST
    • Managing customers manually
    • Privacy & Security
  • Personalization
    • Setting up personalization
    • Managing segments
    • Managing adaptive content
  • A/B testing
    • Setting up A/B testing
    • Running A/B tests
  • Recommendations
  • Integrations
    • Algolia
    • Bynder
    • Cloudinary
    • Commerce Layer
    • Commercetools
    • Customer.io
    • Dealfront
    • Exif
    • Frontify
    • FTP Server
    • Hubspot
    • Microsoft Entra ID (Azure)
    • Pipedrive
    • Prepr for Radio
      • Publications
      • Introduction
      • Query by ID
      • Query a collection
      • Commercial
      • Imaging
      • Talk
      • TrackPlay
      • WeatherTalk
      • Assets
      • About Assets
      • Artists & Tracks
      • Query by ID
      • Query a collection
      • Guides
      • Query by ID
      • Query a Collection
      • Tags
      • Introduction
      • Query by ID
      • Query a collection
      • Tag Groups
      • Messages
      • Filtering collections
      • Filtering for a Customer
      • Fetching a single message
      • Create a new Message
      • Timeline
      • Introduction
      • Query by ID
      • Query a collection
      • Create Tracks
      • Now Playing
      • Weather forecast
      • Fetching the weather forecast
      • Update the weather forecast
    • Salesforce
    • Segment
    • Shopify
    • Typeform
    • Typesense
    • Vercel
    • Zapier
  • REFERENCE
  • GraphQL API
    • Getting started
    • Get started
    • Test your queries
    • Fundamentals
    • API basics
    • Authorization
    • Caching
    • Statuses and errors
    • Diagnostic tools
    • Upgrade guide
    • Schema
    • API schema
    • Strict Mode
    • Models and Components
    • System fields
    • Field types
    • Fetching items
    • Fetching a single item
    • Fetching multiple items
    • Fetching multi-model items
    • Filtering
    • Sorting
    • Paginating
    • Localizing
    • Previewing
    • A/B testing
    • Fetching an A/B test
    • Personalization
    • Fetching personalized content
    • Recommendations
    • Fetching similar content
    • Fetching people also viewed content
    • Fetching popular content
  • Mutation API
    • Fundamentals
    • API basics
    • Authorization
    • Statuses and errors
    • Upgrade guide
    • Items
    • Fetching single items
    • Fetching multiple items
    • Working with fields
    • Paginating
    • Sorting
    • Create & update content items
    • Publish a single item
    • Unpublish a single item
    • Delete a single item
    • Assets
    • Fetching single assets
    • Fetching multiple assets
    • Managing assets
    • Delete a single asset
    • Collections
    • Resizing
    • Integrating
    • Segments
    • Fetching segments
    • Tags
    • Fetching tags
    • Customers
    • Fetching customers
    • Filtering customers
    • Create, update & destroy customers
    • Identity management
    • Sign-up
    • Sign-in with a magic link
    • Fetching a customer profile
    • Sign out
    • Bulk Operations
    • Resend webhook events

Connecting a front-end framework

The flexibility of a data-driven headless CMS allows you to connect your favorite front-end framework, deliver content and optimize and personalize the customer experience.

Next.jsNuxtLaravelReactVue.jsAngularGatsbyNode.jsPHPSvelteAstroUsing an SDK
Creating a custom remote sourceNext.js

Was this article helpful?

We’d love to learn from your feedback

© 2025 Prepr. All rights reserved.