2 ms·
I wrote a static site generator for my own personal site. I've been using it for over 10 years, and it's gone through several major refactors / redesigns. A few
by klodolph 5y ago
I wrote a static site generator for my own personal site. I've been using it for over 10 years, and it's gone through several major refactors / redesigns. A few comments:
1. Template system
There are tons of different template systems out there for things like the "shortcodes" in the article.
{{youtube id="123asdf4" /}}
My conclusion is that the correct way to do this is with custom tags,
<embed-youtube id="123asdf4"></embed-youtube>
I apologize for the verbosity... but this is completely valid HTML5, and you do not need anything but an ordinary HTML5 parser to parse this. This maximizes your choices for the libraries you use in the static site generator and it maximizes the level of support in whatever editor you choose to author the site in. For example, you can just use the HTML mode in Vim or Emacs, or you can use VS Code, TextMate, Sublime Text, etc. and get a ton of features: syntax highlighting, indenting, etc.
While on the surface it looks verbose because of the closing tag, in most editors, you only have to press a key or two to close the tag. HTML5, strictly speaking, does not support self-closing tag syntax for custom tags. That syntax is only supported for void elements. There are only 16 void elements in HTML5.
I use "prefix-suffix" syntax to avoid ambiguity... any tag with a hyphen is obviously a custom tag.
2. Routing
Something you can use to tackle the routing complexity is to place your source files in the same path as the canonical URL. You only need routes for generated content, like index pages and such.
3. Index data
You'll naturally want to generate indexes and create previews for links. I suggest that you start by looking at the schema.org schema for web pages and work with a useful subset of that. This way, you can generate indexes on your web page using the same exact data, same exact schema, that you use for the JSON-LD data you provide for search engines like Google.
This is a minor point, but it reduces duplicated effort between the code for generating content for your website and the code for generating JSON-LD metadata.
Don't dive too deep into the schema.org schema, just take a couple bits and pieces that you need, and refer to the feature guides in Google's documentation:
https://developers.google.com/search/docs/guides/intro-structured-data https://developers.google.com/search/docs/guides/intro-struc...
- nickreese 5y agoAuthor of the post. This is really an interesting take on shortcodes. I've been struggling with a format that the svelte compiler likes and can be used in markdown. This may be the answer. > <embed-youtube id="123asdf4"></embed-youtube> Thank you.
- EricE 5y ago"2. Routing Something you can use to tackle the routing complexity is to place your source files in the same path as the canonical URL. You only need routes for generated content, like index pages and such." Thank you! The only saving grace for a Gatsby site I recently did was it leveraged a template that did that automatically. To say that it dramatically simplified things is a gross understatement. Template for those interested: https://github.com/18F/federalist-uswds-gatsby https://github.com/18F/federalist-uswds-gatsby