CoursesIntegrated Visual Editing with Next.js
Track
Work-ready Next.js

Integrated Visual Editing with Next.js

7
Lessons

1: Understanding Visual Editing

1
Task

Visual Editing is powered by a combination of Sanity features, which is helpful to understand before implementation.

2: Token handling and security

3
Tasks

To access draft content your application will need to be authenticated with a token. Learn how to do this securely.

3: Receiving live edits to drafts

6
Tasks

Add perspectives to your Sanity data fetches to query for draft content, when Draft Mode is enabled.

4: Configuring Presentation

1
Task

Install and configure the Presentation plugin to enable draft preview and a web preview from within Sanity Studio

5: Setup document locations

2
Tasks

Showing where in the application the document they're editing may be displayed can help content creators understand the impact of their changes.

6: Add drag-and-drop elements

5
Tasks

Go beyond "click-to-edit" with additional affordances for rearranging arrays in your front end

7: Conclusion

Let's review