Baby step: some environment notes

I wanted to back up and write a bit about the setup for this blog app project. I mentioned using TypeScript, but not how.

Earlier, I installed TypeScript on my laptop:

% npm install -g typescript

TypeScript comes with access to the tsc command, which compiles TypeScript files to JavaScript that can be run with node.

Here's my project directory structure so far (after some cleanup):

/build/             /* compiled JS files */
/html/              /* final blog output files */
/posts/             /* Markdown source files */
/src/               /* source TypeScript files */
    /types          /* custom type definitions */
/templates/         /* template files for rendering */
app.ts              /* app that generates the blog */
create-post.ts      /* app that creates new post files */
blog-config.json
package.json

The blog-config.json file is described here and contains metadata about the blog overall. (I have renamed it with a hyphen from an underscore, to be consistent with other file naming conventions.)

The package.json file has a scripts entry that reads:

"scripts": {
    "build": "tsc --outDir build app.ts create-post.ts;",
},

When I run npm run build in this directory, the top-level app files app.ts and create-post.ts will be compiled from TypeScript to JavaScript and placed in the build directory. This should also recursively compile any TS files those apps depend on, such as anything referenced in the src and templates folder.

So the idea here is to create a workflow where:

  1. I run create-post to generate an empty Markdown file in /posts/ with some pre-filled Frontmatter metadata.
  2. I write the post body and tweak metadata with a text editor.
  3. I run app which chews through everthing in /posts/ and creates all the files and indexes, using the templates in /templates/ and placing the results in /html/
  4. Finally I upload the contents of /html/ to my site, wherever that ends up being.

Pretty straightforward. Well, you'd think. Anyway, gotta start somewhere, so next I'll be writing about create-post.


Posted in: blogging, code, javascript, node, typescript

Previously: We have ignition!

Next: A script to create a post