Style Guide

This guide is for authors and developers who contribute content to Fireship.io.

Things to Know

Here are a few tips to keep in mind before working on this project:

  • Feel free to pull request typos or obvious minor fixes (no issues or discussion necessary).
  • Discuss your article ideas on Slack first.
  • Content is managed with Hugo and located under hugo/content.
  • If you contribute I want to make it worth-your-while (see tier below)

Contribution Tier

I like to give away things you can hold in your hand. Here’s what you can expect:

  • Small fixes or typos === 🔥 Sticker.
  • Guest post or major code improvements === 👕 T-shirt.
  • Course collaboration === 💰 Paid freelance job or revenue share.

How to Fix, Improve, and Create Content via Github

First, fork the main repo on github, then clone it to your local machine. You must have Hugo and Node installed.

command line 
git clone <your-forked-repo>
npm install
npm run dev

git checkout -b my-fix

After making your fix or adding new content, submit a pull request on github.

command line 
git commit -m "fix: corrected a typo"
git push origin my-fix

Writing in Markdown

Content is written in markdown. Posts should only use h2 and h3 tags.

file_type_markdown some-cool-post.md 
## Step 1: Do Something

some overview text

### Specific Details

[link](/style-guide/) to somewhere useful

Images for lessons are saved in the relative image dir, lessons/<lesson>/img/ and use the Hugo figure shortcode.

file_type_markdown some-cool-post.md 
{{< figure src="img/my-images.png" alt="cool image" >}}

Code snippets use Hugo shortcodes. Optionally, you can give the code block a icon and filename. The available icons are listed in the layouts/partials/svg dir.

file_type_markdown some-cool-post.md 
{{< file "ngts" "index.ts" >}}
{{< highlight typescript >}}

    console.log('hello')

{{< /highlight >}}

Note: Angular specific icons are prefixed the ng.

Add Contributor Bio

Thank you for contributing 🙏. Make sure you add details to the contributors section and save your avatar image to the static/img dir.

file_type_markdown michael-jordan.md 
---
title: Michael Jordan
draft: false

featured_img: /img/contributors/your-avatar.png

youtube: 
linkedin: 
medium: 
twitter:
github:
portfolio: 
---

I used to play baseball...