• Ultimately my goal is to provide value to others.
  • On the side I build community & my reputation & network.



  • Everything in one place
  • Typescript is a better place to put metadata than markdown
  • Most of my content doesn't have any internal styling (e.g. bolding or italics), but has lots of external structure (e.g. tagline, title, content)
  • Type checking in my templates & if I want it, in my content (I do)
  • I can still use markdown files if I want to

Future features:

  • MD + TS file pair


  • Importing a list of files is surprisingly hard to do (use automation)
  • Images & other assets (I suspect nextjs already supports these, but been too busy/scared to investigate yet)


I'm working a little library package that I want to eventually publish to npm which I'm creating as an intermediate packet as part of my work on x-for-superusers.

My goals:

  • End up with a nice boiler plate for future node/npm/typescript packages
  • Publish to npm
  • Support typescript
  • Usable testing
  • Easily output docs
  • Zero runtime dependencies


  1. Read this guide to get an idea for npm publishing requirements: https://medium.com/cameron-nokes/the-30-second-guide-to-publishing-a-typescript-package-to-npm-89d93ff7bccd
  2. Looked up npm files/npmignore options - I don't want to publish anything but the code, sourcemaps & docs. The docs on npm were clear & usable: https://docs.npmjs.com/cli/v7/commands/npm-publish, I also ran npx npm-packlist to double check my configuration
  3. Create the repo on github
  • Empty Readme
  • CC0 License
  • Node .gitignore template
  1. Yarn add (--dev):
  • typescript - So I can use typescript
  • jest - I'm not a big fan of the big dependency stack, but it works well
  • @types/jest - So I can write my tests in typescript
  • @babel/preset-env - So I can write my tests in typescript
  • @babel/preset-typescript - So I can write my tests in typescript
  1. Configure package.json
  • "files: ["index.ts", "dist/*"] this prevents random files from being in the npm package when I publish it. Note I kept index.ts so package consumers can see the source even if they don't have source maps enabled.
  • "prepublish": "tsc" in scripts so that typescript will compile before publishing
  1. Configure tsconfig.json
  • "outDir": "dist" so that I don't clutter my project with output files
  • "declaration": true, and "declarationMap": true, to ensure there are source maps in the output
  • "exclude": ["node_modules","dist","*.test.ts"] to exlude files from the output & dist folder
  1. Configure babel.config.js
module.exports = {
  presets: [
    ['@babel/preset-env', {targets: {node: 'current'}}],  
  1. Added keywords, description, author to package.json (and github)
  2. Put the package goal in the readme
  3. I decided to skip on the docs for right now - after a bit of research I found lots of options, but nothing that fit within the scope/time I have atthe moment.

The paths not taken:

  • Custom testing framework, I'd love to (and have in the past) create my own testing framework, but right now that's not the goal.
  • Parcel or one of the other alternate bundlers/compilers, I'd love to, but just wasnt needed/worth it right now.

The result: https://github.com/cwohlman/x-json/tree/bare-package



Project -> Blog (try to use long tail keywords) -> Project insights -> Blog or tweet milestones on insights (e.g. 1st 1k revenu, 1st 10k visits, 1st 10 users, etc.) -> Twitter announcements -> Twitter questions/answers -> Github for any open source components (or the whole app) -> Tweet announcements -> Tweet maintenence insights -> Blog announcement (try to use long tail keywords)

Paid Gig -> Use codewords for non-public projects -> Use a no-unit scale for budget -> Be transparent about timeline & hours worked -> Blog at completion ? -> Add to project insights ? -> If fixed price, blog/tweet/track actual vs estimated costs (in my base hourly wage) -> Tweet interesting facts that I don't necessarily want to affect the Schelling Point for my hourly wage instead of blogging them

Price increase -> Project insights should factor in the increased cost of my labor -> Internet fistbump w/ patio11 after first paid gig after price increase

Publishing frequency

  • Tweets & Gists should be published as frequently as I have time/content for, hopefully on a ~daily basis
  • Blog posts should be published when they are ready, probably a month or two after I start them, hopefully around 1-2 per month


  • I've always found building my own website hard
  • How do I promote myself?
  • Who do I target?
  • What services do I list?
  • What layout?
  • What about a blog?
  • What do I get visitors?
  • What is my site even for anyway?


  • @patio11 - SEO is about content
  • various personal/professional websites for content & layout inspiriation
  • tailwindui for styling with almost 0 customization
  • I'm a hardcore dev so I'll offer code & content for devs on my site
  • I target small businesses building web apps or internal tooling
  • I'll offer helpful advice for small business websites (both webapps e.g. SAAS and internal tooling)
  • My three main services are:
    • Web apps
    • Code & best practices audits (this services is a new one)
    • Consulting (whatever you ask me to do)
  • I'll go with a mostly black & white modern newspaper-ish coloring
  • CTAs matter & need to be a different color, haven't picked which color yet
  • I'll link to twitter & github, those are the places where I post/create things which devs & businesses might be interested in
  • I'm going to lean heavily on my own projects for content
    • I want them to make money anyway, I might as well promote them
    • I want to use them for transparency content, e.g. publish budgets & timelines & stats
  • I want a sticky header, I think that users will want to move around in my app (e.g. peruse projects to get an idea of what kind of coding I do, then go back to services, or visa versa)
  • I want the call to action in the header (another reason why it should be sticky)
  • When the menu collapses down to the hamberger, it should still show the contact section
  • The contact section should be a form, if the window is wide enough, otherwise a button + modal
  • I plan to build my own analytics & use it on all my sites, so that I can publish those stats as part of the content on my site

More questions:

  • What about mission/principles?
  • Should I put more than one CTA?
  • What can I do to filter out spam & prioritize real inquiries?