| example | ||
| lib | ||
| .gitignore | ||
| .travis.yml | ||
| analysis_options.yaml | ||
| CHANGELOG.md | ||
| LICENSE | ||
| pubspec.yaml | ||
| README.md | ||
markdown
Markdown view generator for Angel.
With this plug-in, you can easily serve static sites without doing more than writing simple Markdown. Thus, it is a friendly choice for writing API documentation or other tedious HTML-writing tasks.
Installation
In your pubspec.yaml:
dependencies:
angel_framework: ^1.0.0
angel_markdown: ^1.0.0
Usage
It's very straightforward to configure an Angel server to use Markdown.
Keep in mind to use package:file instead of dart:io:
configureServer(Angel app) async {
var fs = LocalFileSystem();
await app.configure(markdown(
// The directory where your views are located.
fs.directory('views'),
));
}
You can then generate HTML on-the-fly in a request handler.
Assuming your view directory contained a file named hello.md, the
following would render it as an HTML response:
configureServer(Angel app) async {
app.get('/hello', (res) => res.render('hello'));
}
package:angel_markdown by default searches for files with a .md extension; however,
you can easily override this.
Interpolation
angel_markdown can interpolate the values of data from locals before building the Markdown.
For example, with the following template species.md:
# Species: {{species.name}}
The species *{{species.genus.name}} {{species.name}}* is fascinating...
You can render as follows:
requestHandler(ResponseContext res) {
return res.render('species', {
'species': new Species('sapiens', genius: 'homo')
});
}
To disable interpolation for a single bracket, prefix it with an @, ex: @{{raw | not_interpolated | angular}}.
Templates
Markdown is frequently used to build the content of sites, but not the templates. You might want to wrap the content of pages in a custom template to apply pretty CSS and JS, etc:
configureServer(Angel app) async {
await app.configure(
markdown(
// The directory where your views are located.
fs.directory('views'), template: (content, Map locals) {
return '''<!DOCTYPE html>
<html>
<head>
<title>${locals['title']} - My Site</title>
</head>
<body>
$content
</body>
</html>
''';
}),
);
}
The template function will have access to whatever values were passed to the renderer,
or an empty Map.
Enhancing Markdown
You can pass an extensionSet to add additional features to the Markdown renderer.
By default, this plug-in configures it to enable Github-flavored Markdown.