Magnolia Academy
/
Courses
/
M6.3 Magnolia Headless and SPA Development
/ The Overall Architecture of Magnolia Headless
Courses
Learning Paths
FAQ
Book a demo
My profile
The Overall Architecture of Magnolia Headless
All lessons
✕
1
Getting Started with The Headless Development
2
Setting up the Environment
3
Magnolia Headless SPA Overview
4
Magnolia Content Type
5
Exercise: Define an 'event' content type
6
Magnolia Content App
7
Exercise: Create an Events Content App and Create Event Items
8
Delivery Endpoint API
9
Delivery Endpoint Configuration
10
Exercise: Walkthrough the Delivery Endpoint for Pages
11
Exercise: Create a New Delivery Endpoint for Events
12
Delivery: Resolving the References
13
Exercise: Extends Events Endpoint with Images Resolver
14
Delivery: Localized Content
15
Exercise: Fetch Localized Content
16
Delivery: Methods
17
Exercise: Extends the Events Endpoint and Practice using Different Methods
18
Headless: GraphQL API
19
Headless: Security Configuration
20
Exercise: Allow Anonymous Access to Events Endpoint
21
Headless: CORS
22
Exercise: Check CORS on Your Magnolia Instance
23
SPA in Light Development
24
Page Definition
25
LD: Component Definition
26
LD: Dialog
27
Magnolia Front-end Helpers for SPA
28
SPA Magnolia Template
29
Exercise: Initial Setup & Start the SPA App
30
The Overall Architecture of Magnolia Headless
31
SPA Page
32
Exercise: Create a new Listing Page Template
33
SPA Component
34
Exercise: Add a Component into the Existing Page
35
Exercise: Create a new 'eventsListing' Component
36
SPA Multiple Languages
37
Exercise: Make the 'eventsList' Internalizable
38
SPA Magnolia Templates Extra
39
Exercise: Alter the Editable Area Behaviour
40
Extra: Webhooks
41
Extra: Debugging No-Green-Bars Issues
42
Congratulations!
The Overall Architecture of Magnolia Headless