Know About freeCodeCamp Publication Style Guide

Know About freeCodeCamp Publication Style Guide

Hey everyone, i am writing this blog while learning myself what are the standards for writing a Freecdecamp blog/article.

This is the official Freecodecamp guide↗️, I have simplified this for you!

Let's go 🚀

Headlines/ Title of Blog

A good headline is the first look of your blog to the user, spend some time to better it and make it visually appealing to your content.

Here are a few headline structures we’ve found that work well for tutorials:

  • "How to fix…"

  • "How to build…"

  • “How to [task] with [tool]”

  • "How [something] works"

  • "The [adjective] guide to…"

  • “What is [noun]?”

  • "A history of [something]”

  • "The [something] Handbook" (for longer tutorials of at least 7,000-10,000 words), or "The [something] Book" (for much longer tutorials of 10,000+ words).

Image/ Thumbnail

You can create your own using Canva

Some things to keep in mind when creating your cover image:

  • Use nicely contrasting colors so the images/text pops.

  • Don't include too much text in your images – just focus on the main subject/keywords.

  • In general, remember: simpler is usually better for cover images. You want an eye-catching image that's easy to view/read on smaller devices.

  • You can use your cover images to help build your "brand" as a writer. If you create consistently designed images, people will often start to recognize your tutorials by the cover image alone.

Setting Your Post URL

You can set your tutorial's URL directly (under the Settings gear). We recommend keeping these short and descriptive like “machine-learning-with-pytorch-tutorial” or “how-to-push-to-git-remote-repository”.

Tags

You can choose one to five tags for your tutorial. Once you've chosen them, just let the editorial team know and we'll add them for you.

These tags will make it easier for readers to discover your tutorial through search and when browsing tags.

The first tag you choose is the most important, and it will show up above your tutorial.

Use active voice whenever possible

So try to use active voice in your tutorials whenever possible. This will be the vast majority of the time.

Here's an example of active voice:

"You can install Node.js by following these steps."

Here's an example of passive voice:

"Node.js can be installed by following these steps."

This will give confidence to readers to trust you and follow along with.

Add syntax highlighting to your code

You can create a code block by typing three backticks (```), followed by the programming language you're using, then hitting the spacebar.

Do ``` js for giving idea that we are going to write Javascript code.

If you want to write in-line code, you can just wrap it in single backticks.

This can be formatted like this: code so it's obvious that you're discussing a particular function or element.

How to Structure Your Tutorials:

  1. Write a concise introduction that tells readers what they’ll learn during the tutorial, what your goals are, and/or what they'll accomplish.

  2. Explain any prerequisites readers will need to follow along (for example, knowledge of HTML and CSS, understanding of React hooks, VSCode installed/set up, and so on)

  3. Walk readers through the tutorial in a logical and organized step-by-step way (or if it's not a tutorial that lends itself to this structure, present the information in a way that's easy to follow).

  4. Use a numbered list like this one to indicate steps that should occur in a particular order. Or you can just use subheadings that flow in a logical way.

  5. Pack in as much detail as you can.

  6. Close out by reminding readers what they just learned and accomplished with a concise conclusion.

Write longer comprehensive tutorials instead of multi-part tutorials

People do not wait for 2 or 3rd parts, so cover all in one tutorial only.

When people see that a tutorial is long, they’ll often assume the tutorial is serious and comprehensive.

This inspires people to slow down and really spend time reading your tutorial. Many people will even open up their code editor and code along at home.

Always Credit Your Sources and Don't Plagiarize

How to properly cite your sources

If you are paraphrasing (or quoting directly) something someone said in another tutorial, video, course, or other medium, you should credit them. This means adding a link to the original source and using pull quote formatting, like this:

"This game is controlled entirely by typing into a command line interface. Because the game is real-time in nature, this can lead to some intense moments of rapidly typing commands as you try to save your drones from danger." (Source: Quincy Larson)

It includes code, quotes, GitHub stuff, or anything you take from someone else.

Self-promote in your tutorial

It is perfectly fine to have a one-sentence call-to-action for your product at the end of your tutorial.

Do not spam with your product or any blog.

Finishing up the process

Once you’re confident your story is ready for readers, email a link to your draft to editorial@freecodecamp.org.

And finally, an important note: if a company is paying you to write an article and then try to publish it on freeCodeCamp's community publication, please disclose this to the editorial team when you submit your draft.

This is enough to start writing on Freecodecamp as an Author, so what to wait

Just dive in!

Hope you love this blog ...

If yes, Do follow and show your support with me!

Thanks 💖