Submitting a blog post on DevsNG
In this article, I am going to cover a step-by-step guide on how to create and submit an article for it to be published on the Devs NG platform.
As you may have noticed by now, Devs Ng is a platform built with Gatsby and hosted on Netlify. There is no authentication or user creation flow, and as such, most pages - article and profile pages - are static pages created by submitting relevant directories and files via a pull request to the Github repo.
The reason for this kind of implementation is that we gave a thought to this and realised that this would be a great way to portray the strength, importance and relevance of the (new) trends in software development - React, Gatsby and most importantly, open-source.
We believe this implementation will most likely be a good way to get Nigerian developers and tech writers into the world of open-source while sharing their ideas, thoughts and experiences, making them entirely open-source.
This implementation is already in use by a few organisations’ blogs including Gatsby and Coding Coach, amongst others. So it is nothing entirely new.
Without further ado, let’s jump right in.
Start by forking the project from the repo and cloning your own copy of the fork. This will be the copy you will be working on. Change into the project directory and fire up the server by running
gatsby develop. This starts up the local server and listens to file changes to refresh instantly.
Please know that to create an article on the repo, you ought to have a profile on the platform. If you have a profile already, please note the unique user identifier you used (e.g
john-jones). This is the same as the name of the folder that holds your profile details. If you have this, then head on to writing an article
If you do not have a profile yet, please head on to this article that explains how to do so after which you can continue with this one.
Now to creating and submitting articles.
- Navigate into the
content/blogdirectory and create a new folder there with the title being your article’s title with the words seperated by hypens, e.g
- Inside this new folder, create an
index.mdfile and move your assets into it - images, gifs, etc, that will be used by the Markdown file. If you would like to use a featured image for your post, please also move the image into the folder and the title of this particular image should be
featured-image.pngor any image extension for that matter.
When this is done, open up the
index.mdfile and start to write your post. Begin by creating a frontmatter that should hold details about the new blog post. You can use the format below by copy-pasting:
--- title: Hello World date: "2019-08-27T22:12:03.284Z" description: "Hello World" featuredImage: "./featured-image.jpg" altText: numerous books open on a board published: true author: emeruche-cole type: post tags: ["react", "gatsby"] ---
title: Required. Refers to, well, the title of the post.
date: Required. Refers to the date the article was written and sent in for review and approval via a pull request.
description: Optional. Should contain a little info about the article and what it is about. This is majorly for SEO purposes. If not included, an excerpt will be taken and used from the first few words of your article.
featuredImg: Optional. If you would like your article to contain a thumbnail featured image on homepage and a large featured image on article page, include a relative link to the image here.
altText: Optional. For accessibilty reasons. This will serve as an
alt text for the selected featured image.
published: Required. Set to
true for testing purposes and to view your article on localhost. Please set to
false before submitting a pull request. Once reviewed and approved, the Devs NG team will set it back to
author: Required. Remember the unique user identifier you created when creating your profile? Use that here. Please try as much as possible to verify this information as you might end up using an identifier tht has not been created yet.
type: Required. Please leave as
tags: Optional. Add relevant tags for your post. Maximum of two tags. The first is the primary, while the second is a secondary tag. Tags more than 3 will be stripped down to just the first two.
- With the frontmatter taken care of, proceed to writing your awesome article. Gatsby supports virtually all Markdown syntax and styles. If your post includes images, make sure you have already added them to the article folder and link them up.
If you need help with Markdown syntax, or need some clarifications about it, you can learn all about it here.
- If you are satisfied with your articles and would love to submit it for review and publishing, commit your changes to your own forked copy and you can go ahead and submit a PR. Our review process is quite simple and short. We try to check if meets community standard. To help quicken the process, please ensure your post is well formatted and includes code samples where needed. If after review we discover an issue that prevents us from publishing it, we will notify you via the Github PR conversation.
Thanks, and we can’t wait to get your articles coming in.