Skip to content

Latest commit

 

History

History
92 lines (66 loc) · 3.32 KB

blog.md

File metadata and controls

92 lines (66 loc) · 3.32 KB
title order
Adding Blog Support
600

Blogs in Scully

Scully is the best option for moving a blog to Angular!

It has a schematic that enables Angular applications to use markdown files for blog's content.

  1. Adding Blog Support
  2. Generating New Blog Posts

Adding Blog Support

To add blog support to your app, run the following command:

ng generate @scullyio/init:blog

This command adds the blog modules's roues to the Angular application. In addition, it creates a ./blog folder for the blog's markdown files.

To create a folder with a different name, run the following command:

ng generate @scullyio/init:markdown

and you need response some options

? What name do you want to use for the module? blog
? What slug do you want for the markdown file? title
? Where do you want to store your markdown files? mdblog
? Under which route do you want your files to be requested? blog

or

ng generate @scullyio/init:markdown --name="blog" --slug="title" --source-dir="mdblog" --route="blog"

And the result is:

    ✅️ Update scully.{{yourApp}}.config.js
UPDATE scully.{{yourApp}}.config.js (653 bytes)
UPDATE src/app/app-routing.module.ts (726 bytes)
UPDATE src/app/blog/blog-routing.module.ts (429 bytes)
UPDATE src/app/blog/blog.component.css (157 bytes)
UPDATE src/app/blog/blog.component.html (160 bytes)
UPDATE src/app/blog/blog.component.spec.ts (639 bytes)
UPDATE src/app/blog/blog.component.ts (508 bytes)
UPDATE src/app/blog/blog.module.ts (391 bytes)
    ✅️ Blog ./mdblog/2020-03-24-blog.md file created
CREATE mdblog/2020-03-24-blog.md (95 bytes)

NOTE: Slug is the name of the url matcher for search the file.

The following table shows all available options:

Option Description Default
name Defines the name for the created module 'blog'
slug Define the name for the :slug 'id'
routingScope Sets a routing scope (Root or Child) Child
sourceDir Defines a source directory name (default: name) value from name option
route Defines a route path before the :slug (default: name) value from name option

Scully works well in combination with other tools and utilities.

For instance, if the markdown content includes code blocks, and you want to highlight it us the use a utility.

Generating New Blog Posts

To create a new blog post, run the following command:

ng generate @scullyio/init:post --name="This is my post"

The following table shows all available options:

option description default
name Define the name for the created post 'blog-X'
target Define the target directory for the new post file 'blog'
metaDataFile Use a meta data yaml template from a file for the post undefined