ContentApp

The ContentApp component is the root component for building a content-driven site. It controls and sets up the overall content rendering pipeline, from loading the content to rendering it.

It is recommended to use the ContentApp component as the root component of your app like this:

import 'package:jaspr/jaspr.dart';
import 'package:jaspr_content/jaspr_content.dart';

import 'jaspr_options.dart';

void main() {
  Jaspr.initializeApp(options: defaultJasprOptions);

  runApp(ContentApp(
    parsers: [
      MarkdownParser(), // Parses markdown files
    ],
    // ... More configuration here
  ));
}

With this simple setup, using the default ContentApp() constructor, there is already a bunch of stuff happening behind the scenes:

1. The app analyzes the 'content' directory in your projects and builds a routing table of all files and folders. For example:
   • a file content/index.md will be available at /
   • a file content/guides/routing.md will be available at guides/routing/
2. The app will parse the markdown content of each file and render it into a Jaspr component, including some basic theming and typographic styles.
   • 2.1. If the file contains frontmatter data, it too will be parsed. Data like a 'title' or 'description' will be rendered as HTML meta tags.
3. When building in static mode, the app will generate static HTML files for each markdown file at build time.
4. During development, the app watches the 'content' directory for changes and updates the routing table and content accordingly.

The default ContentApp() constructor is a good starting point for simple content-driven sites. It provides a basic setup for parsing and rendering content from the local filesystem and is easy to set up.

Based on its properties the ContentApp() constructor creates a default FilesystemLoader and FilesystemDataLoader. It also provides the same configuration to all pages.

For even more control over the content loading and rendering pipeline, you can use the ContentApp.custom() constructor.

The ContentApp.custom() constructor allows you to:

• switch out the default FilesystemLoader with one or multiple alternative RouteLoaders, for example the GitHubLoader to load content from a GitHub repository instead of a local directory.

• configure the ConfigResolver to use different configurations for different pages.

• add a routeBuilder to customize the main Router component like adding additional routes or inserting custom components above the router.