✋🏽Introduction

Hey guys today’s article will be different from the other articles that I have been writing and just as the title says I will be sharing my own process on how I write articles with live projects. Let’s dive right into it 😀.

🌐 Researching

The first thing I always do is research the project that I want to build and I mostly use two methods which are goggling and topics people find hard to understand on Twitter. Since most of the articles that I write are beginner related, I usually research beginner-friendly projects such as Todo List, Countdown timer, Carousel sliders, etc.

👷🏽‍♂️ Building the Project

For me to give a more detailed explanation to those reading the article and for them to understand, I normally build out the project first Here is why;

Building the project first will serve as a guide when I am trying to teach it to people online (i.e you guys 😅). It also forces me to be more focused and understand the codes that I will use for that project and also makes me write the code in a more simpler form that people reading the article can understand.

That being said, Here are some of the processes that I follow when building the project 👇🏽

📂 Creating a Repo on GitHub

Before starting to write start writing some code, I will first create the project on GitHub. The major reason is that if the user that is reading the article does not understand the code, He/she can fork the project into his/her local machine and run the code directly and play around with it.

🧑🏽‍💻 Writing the code

After the project is being created on GitHub, I open my text editor (vs code), clone the project, and then start writing the codes.

🪜 The Process

The HTML and CSS part of the code does not really take much because I try to keep the styling simple as possible so as to focus more on the functionality of the project itself.

Talking about Functionality, That’s when JavaScript comes into play. And of course, I do run into a lot of bugs and multiple errors which I don’t really judge myself for I promise 😅.

I really spend a lot of time writing the JavaScript code because it will determine how I am going to write the article for the project.

🚀 Deployment

After I have finished fixing all the bugs in the code and writing comments where necessary for people reading it to understand. I then deploy it online and the platform I use to deploy all the websites that I create is Netlify. Netlify is the most popular way to build, deploy and scale modern web applications.

✍🏽 Writing the project

Before writing the article about the project I normally do two things which are;

1. Coming up with titles for the project.

2. Creating a thumbnail for the project.

1. Coming up with titles for the project

Coming up with a title for projects or concepts (Including this one I am writing) that I create or write is always stressful for me because I overthink it. So the one thing I do to solve that issue is to write out five titles and pick one for the main title and pick another one for the subtitle.

2. Creating a thumbnail for the project

This part does not really take long for me because I already have templates that I can just make a few changes to. And the app I use to create all my thumbnails is Figma.

📰 The Article

After coming up with a title and thumbnail for the project, I then move on to writing the article properly. The app that I use to write my article is Notion. The reason I use Notion is because of the tons of features it has such as markdown editors, including images, adding links, emojis, and a lot more other things which makes it very easier for me to write.

When writing the article for any project that I build, I always try my possible best to make the article look more like a video to the reader such as adding emojis, making jokes when necessary, and most importantly breaking down the code into segments so that anyone new to programming can understand.

After I have finished writing the article and made changes where necessary, the last thing I do is publish it.

📢 Publishing

Publishing the article is the easiest part of the entire process because the editor I use (Notion) is similar to the platform’s editor you using to read this right now.

Conclusion

That’s it guys 😀 Thanks for taking the time to read this article 🎉. I really hope you learned something that you can add to your own building and writing process. Here is a link to one of the projects that I’ve built shows all the things we’ve talked about in this article 👇🏽

https://devlawrence.hashnode.dev/how-to-build-a-basic-todo-app-with-vanilla-javascript

Till the next time 😉. Have an amazing weekend.