❗Important Notice

This repository has been deprecated and is no longer actively maintained. We recommend you use the crownpeak-pwa-template instead.

FSXA-PWA

The FSXA-PWA is an example project and can be used as basis for developing your own PWA in the context of the FirstSpirit Experience Accelerator.

About the FSXA

The FirstSpirit Experience Accelerator (FSXA) is the hybrid solution of a digital experience platform, combining a headless approach with enterprise capabilities. The FSXA stack consists of five repositories:

• FSXA-PWA

• FSXA-UI / Component Library

• FSXA-Nuxt-Module

• FSXA-Pattern-Library

• FSXA-API

While the FSXA-API is a maintained product with a life cycle, the FSXA-PWA, FSXA-UI, FSXA-Nuxt-Module and FSXA-Pattern-Library are merely best practices examples how a project could be set up and integrate the FSXA-API. The latter repositories can be forked to speed up the startup time of a frontend project or to understand how common use cases can be solved in headless projects. The code itself can therefore also be used as documentation of best practices.

The following image illustrates the product cut:

Attention Since the reference implementation does not represent a maintained product, we do not guarantee support for its use.

Documentation

If you are interested in the FSXA check this Overview.

Developer documentation for the FSXA-PWA’s vue components is part of the FSXA-UI repository.

Table of contents

1. Introduction

   1. General

   2. Projects used

   3. Architecture

   4. Deployment

2. Getting Started

   1. My First Template

   2. Adding CSS

   3. Changing the App Layout

   4. Using an Existing Project With the FSXA PWA

3. Configuration

   1. .env File

   2. fsxa.config

4. The Vuex Store

5. DevMode

6. Routing

7. Working with Richtext

8. Custom CSS

   1. Adding Custom CSS to your Component

   2. Removing Tailwind CSS for your Project

9. ProjectProperties

10. Working with Images

    1. Introduction

    2. Working with CaaS

    3. Resolutions in FirstSpirit

    4. Responsiveness

    5. Lazy Loading

    6. SourceSets

11. Caching

12. Server Side Rendering (SSR)

13. Removing Presets

14. Base Components

    1. FSXABaseComponent

    2. FSXABaseLayout

    3. FSXABaseSection

    4. FSXABaseRichTextElement

    5. FSXABaseAppLayout

15. Render Content Element

16. Display Hidden Section Element

17. Debugging

18. Advanced

    1. TPP-Snap

       1. Nested Elements

       2. Inline-Editing

    2. Custom API Routes

       1. Example 1: Custom Sitemap

       2. Example 2:Accessing other FS-Projects

       3. Example 3: Sending Mails

    3. SEO

    4. Proxy Configuration

    5. Circular References

    6. Protecting Deployments

Legal Notices

FSXA-PWA is an example solution of Crownpeak Technology GmbH, Dortmund, Germany. The FSXA-PWA is subject to the Apache-2.0 license.

Disclaimer

This document is provided for information purposes only. Crownpeak Technology may change the contents hereof without notice. This document is not warranted to be error-free, nor subject to any other warranties or conditions, whether expressed orally or implied in law, including implied warranties and conditions of merchantability or fitness for a particular purpose. Crownpeak Technology specifically disclaims any liability with respect to this document and no contractual obligations are formed either directly or indirectly by this document. The technologies, functionality, services, and processes described herein are subject to change without notice.