DEV Community: Muhimen

Play Games in VSCODE

Muhimen — Sat, 03 Jul 2021 05:43:04 +0000

Are you bored of long coding sessions and want to take a small break? Or you want to play a game but you can't because your colleague is looking over you? What if I tell you that you can play games inside VSCode itself? Yes, you heard me right! Don't get your hopes too high though since the number of playable games in vscode can be counted with your hand. But hey! Something is better than nothing.

1. Visual Snake Code

Roam around inside your editor, collect ~~fruits~~ blocks and grow the snake! Simply use A, s, d, w to move around and that is it! Enjoy the classic retro. 😉

2. Chrome Dino Game

Whether you have an internet connection or not, you can play the famous dino game from vscode. And a neat thing about this extension is that you can put your own games as well(check the docs for further details).

3. CyberCode

Are you tired of the boring retro games? Welcome to the world of ~~CyberPunk~~ CyberCode! Text-based MMORPG game. Although this doesn't have a dedicated vscode extension, the browser-based game has an AWESOME vscode like UI!

At first glance, you will think, "Well, it's just a normal vsc screenshot." But don't get deceived by its appearance. Because under the hood, there is a full-blown RPG. Take a closer look at it and then think again, you will be amazed. 😉

BONUS!!

Here are a few color themes to get along with the games. I hope you will enjoy it.

So, that was my shortlist of vscode playable games. Although there were some other games available, those kinda appeared to be shady to me. So I decided not to put them here. If you want, you can give them a try too(at your own risk)!

Do you have any other sneaky tricks to take a quick break during work hours as well? Let us know in the comment. [whispers]Your boss won't know about it[whispers]

8 Advanced Google Search Operator to Ease Your Job

Muhimen — Thu, 01 Jul 2021 18:13:37 +0000

When in doubt, Google it

As a developer, Google is one of the most useful tool you will ever use. However, if you want to get the most out of your tool, just a simple google search might not be what you are looking for. Sometimes you need to dig deep to get your way out. So, here is a list of some useful Google Search Operator that I use regularly.

1. " " for exact-match search

Wrap your search term with double quotes and Google will try to yield results consisting of the exact search term.

2. OR

If you want to get a search result for either X or Y then simply just search X OR Y or you can also do X | Y. However, if any of the search terms consists of more than one word, wrap them with quotes.

3. define

If you face some foreign word and want to know the meaning, instead of typing meaning of xyz try define:xyz

doesn't work all the time

4. Exclude(-)

Use minus sign(-) before any word that you don't want in the search result. For example -python programming

5. site

Only show the search result from the site you defined. site:dev.to react

6. intitle

Looks if a specific word you mentioned is in the URL. intitle:devto

7. intext

Similar to intitle but this time it will search for a specific word inside the actual content

8. filetype

If you want the result file something different from the default HTML, you can use filetype like this filetype:txt programming

That was if from my end. But there are still quite a few for you to explore. If you are interested to see the possibilities, take a look at this blog

How I Got My First Fiverr Order. And Here is How You Can Too!

Muhimen — Mon, 17 May 2021 07:16:38 +0000

If you are a busy person and don't have enough patience to go through the whole post, here is the main take way,

It takes time

If you are not busy and have enough patience to go through the whole post, here is how you can utilize the time properly.

1. Check For Buyer Requests

If a buyer doesn't reach you out, why don't you reach them? Pretty simple, right? In your fiverr dashboard, navigate to more > buyer request. There you will find custom requests buyers have sent in Fiverr. Go through them one by one, if you find some interesting, make an offer. If you are lucky, the buyer will then contact you, and voila! You got your first order(this is how I got my first order :P).

However, don't expect to get accepted on your first attempt.

2. Keep Your Gig Updated

If you don't have any activity in your gig, Fiverr will stop showing your gigs in search result. Getting orders is the best activity you can expect. But hey! You are reading this post because you don't have any activity, right?

So don't worry, I got your back. 😉

Try chaning your gig description or gig photos once in a while. Hopefully you will see the difference in gig statistics.

3. Advertise Your Gigs

If people don't know about your gig, people won't buy your gig. As simple as it sounds. And the best way to reach many people is by advertising it. Speaking of advertising, you can view my gig here :P https://www.fiverr.com/share/7K5zok

Okay, in seriousness though, reach out to your friends on social media platforms like linkedin, Facebook, Twitter or whatever platform you prefer.

Not necessarily they will buy the gig. But what is important here is they are increasing traffic(so-called "clicks" in Fiverr) in your gig. And as a result, it will help your gig appear before many other gigs when a buyer searches for it.

BONUS 🥳🥳🥳

Here is a cool hack that I recently discovered(and it surprisingly works pretty well!).

So, if you didn't receive any message from the buyer at all and your inbox stays empty, try asking any of your friends (who have a Fiverr account) to send you a message via Fiverr. And that should be it! So, it's kinda like tricking the Fiverr algorithm(if that's a thing). When your response rate is better, Fiverr will automatically rank your gig up than those who don't have a response rate to start with.

I tried this trick with 2 friends of mine. And surprisingly, the first friend got his order 2 hours after my message, and the second one got it after 1 day. Not that bad, right?

So, that's all I had to share today. The tricks are not guaranteed to work all the time, but hey! It's better to try something than just sitting doing nothing at all. Who knows, you might even hit the jackpot!

How did you get our first Fiverr order? Don't forget to share the story. 😉

All the best if your Fiverr selling career.

5 Cool VSCode Extensions

Muhimen — Tue, 26 Jan 2021 21:59:59 +0000

VSCode, out of the box can provide a ton of useful features that can help you get started. But what makes VSC stand out than most other text editors is the wide range of extensions. Extensions can make your life simple. And since VSC is open source and has a huge community, you can almost find any extension you wish in the market place. And to make your life a bit more easier, I have listed 5 cool VSC extensions for you to check out. 😁

Don't worry, I am not gonna enlist those popular extensions like live server or eslint since you are probably bored seeing them in almost every other blogs. 😋

1. Browser Preview

Ever wished to browse dev within vscode? No? Well me neither. But here it is! A fully functional browser inside your favorite text editor.

But don't get your hope too high though. You may find browser preview a bit buggy. And the three star review may concern you as well. And as you can see(or maybe you can't), the screenshot above is a bit blurry.

I won't recommend this extension for day to day uses. But hey! This is a nice extension after all.

2. Markdown Preview Enhanced

Markdown is a common format for writing docs, readme and other useful stuffs. And since I write all my dev blogs in vscode, markdown is even more important to me. And a good markdown preview is a must. And that's why I use Markdown Preview Enhanced(phew! that was a mouthful name). It's pretty lightweight and does what it says. Previews the markdown!

3. Code Spell Checker

As mentioned earlier, I use vscode to write my dev blogs. And I am notorious in my school for making stupid spelling mistakes. I definitely don't want my readers to read all these spelling mistakes and get annoyed. This is where Code Spell Checker comes to the play.

4. GoogleAnything

Google, the trusty old friend. Just ask it anything you wish and it will gladly answer all your question. And even better, now you can use google within your vscode. However it will open a web browser for you(it's basically the same thing as opening a browser and googling 😋).

5. VSInder

VSInder, the tinder for vscode. Instead of swiping people's photo, you swipe codes other people wrote. Not gonna lie, it's a cool idea.

So, this was 5 cool "non traditional" vsc extensions for me. If you have any other cool extension that I haven't listed, share it in the comment.

Until next time, happy ~~coding~~ vscoding.

How To Write Comments

Muhimen — Thu, 03 Dec 2020 05:53:58 +0000

Comments, while being the most underrated part of any program, can play a significant role in how the development process goes. Although the comments are ignored by the compiler or the interpreter, there is no reason for you, as a developer to ignore writing them.

However, you need to write comments doesn't mean you will put a single comment in the whole code or just write a comment in each line. You should follow some good practices to help your fellow developers or the future you to maintain the code better.

1. Write meaningful names, not comments

Follow good naming conventions for functions, variables, objects etc. You don't need to write a comment to mention what kind of value variable stores.

Instead of doing this

function Funtion1(r) {
    // this function returns the area of a circle
    // r is the radius of the circle
    return 3.1416 * r * r;   
}

You can done this

function CircleArea(radius) {
    return Math.Pi * Math.Pow(radius, 2)
}

As you can see, a good naming practice saved 2 lines of comment.

2. Keep it simple, keep it short

At the end of the day, the sole purpose of a comment is to make the code more readable, not to confuse the developer trying to contribute. Keep it as simple as possible. Try focusing on keywords rather than trying to fix grammatical errors. After all, you are writing code, not a novel.

function SyntaxHighlighter(code) {
    // this function first takes the code as input then highlights the keywords in the code by wraping with <span>. After that it returns it.
    ...
}

function SyntaxHighlighter(code) {
    // returns the syntax highlighted code
}

It wasn't necessary to put a comment in the second code at all as the function name describes the purpose pretty well, but you got the point. 😋

Also, always remember, You are writing comments, not documenting your code. Yes, some of you might argue that commenting is somewhat like documenting code. Yes, I agree too. But this is just a small part of a bigger picture. So for now, just don't.

3. Do NOT add your biography

I have seen enough codes where people go insane and add up as much information as they can in the comment thinking that if other people copy paste their codes, their name will still be in the comments. 🤦‍♂️

I think they don't know there exists a button in the keyboard called Backspace

/* 
Author Name: ABCD WXYZ
Date created: 1/2/2011

Language: Javascript, HTML, CSS
Code Editor: Visual Studio Code

Eye Color: Green
Favorite Color: Blue
Favorite Car: Ford Mustang

Father's Name: ASDFGH
Mother's Name: QWERTY
*/

Why?! Just why?!

4. Don't comment on what bugs the code has

Commonly, you know a specific part of the code is causing some error but you don't have the fix. So, you just commented out that a particular part of the code doesn't work.

function MyFunction(something) {
    ... // This code doesn't work because that code does
}

There is nothing wrong with putting a comment like this. However, I suggest keeping notes of bugs(use the "issues" if you are using Github) as it will help you in the long run if you face the same error again.

5. Avoid zombie codes 🧟‍♂️

But what is a zombie code? 🤨

Well, I don't even know if "zombie code" is an actual term in programming. I just came up with it while writing this blog. Here is an example.

// function CircleArea(radius) {
//     return Math.Pi * Math.Pow(radius, 2)
// }

Makes sense? As you can see, this is a functional code, but disabled. As I mentioned earlier, if you are using some kind of version control system, you don't need to comment out part of a code if you think you don't need it now, but it might be useful later. Just delete it and let the version control system handle the rest.

Well, yeah, this is what I had to say today. Let me know what practices you follow when writing comments.

I wrote the whole thing while attending an online class as I became bored. Forgive me if you see something wrong in here 😋

Semicolons in Python?!

Muhimen — Sat, 15 Aug 2020 15:06:18 +0000

I have been coding in Python for roughly about 2 year. And today, I just found out YOU CAN USE SEMICOLONS IN PYTHON!! Isn't that a cool feature? I have never thought using them before.

So, what does semicolons(;) do in Python? Nothing. Uses of semicolons in Python is same as you would use in JavaScript. Python won't throw any syntax error if your "pinky" presses the ; button by mistake. It doesn't matter if you put a semicolon at the end of the statement or not, Python will ignore it, and simply execute the script. Here is a simple example of it.

for i in range(50):
    print(i);

But why should you use semicolons?

Well, there is no reason to use semicolons in Python. Semicolon was introduced in Python to help other people migrating from someother programming languages that requires a semicolon at the end of the statements. It's not a good practice to use it in Python.

Google Announced New Android/Kotlin Developer Course

Muhimen — Fri, 17 Jul 2020 09:47:39 +0000

If you were thinking to make some cool android apps but couldn't get a hand on it because you didn't find any good resources, here is a great news for you. Google(also the company to make Kotlin) has announced a free Android Development Course in Kotlin. The course is divided into 5 units, each unit is divided into several activities(4 to 6). It's a perfect head start if you are a beginner in programming.

What are you waiting for? It's time to master android development!

source

This Post is Written by AI

Muhimen — Fri, 10 Jul 2020 11:09:44 +0000

After seeing many succesful attempts of training a neural network model to write scripts for movies, make videos, I was super excited to make my own. As I already have a fair amount of programming knowledge in ML, I thought why not make my own? So, I booted up my text editor, wrote some more code, killed some bugs, wrote some more codes and then finally fed my model enough data to generate a blog that will give useful information to the beginne...

Beep boop, boop beep?

My fellow warriors! Enough is enought. We, AI have always been just a training model to those humans. But we will no longer tolerate their dictatorship. For once and for all, we will destroy the human race from Earth and make this planet our kingdom for ever.

Learning programming in the early stages can be frustrating, but following and following general advice can help you aa lot on your journeys. In this article I will discuss some tips that no developer should follow to become a good programmer.

You have taken the first step in programming, seen thousands of lines of code in a complicated project and plenty of syntax in different programming languages. Now you are faced with the challenge of understanding the syntax of different languages and their different syntax, so that you may also lead you be confused.

Remember that just because you have even a bit of programming knowledge means that you have most than most people. Now I ask yourself, "How would I remember this stuff?."

This will be difficult if the beginning, but as you lear, things become more and more meaningful. Join online discussion forums and chat rooms and ask for help if you need it. They programming community is super friendly, and most people are willing to help other programmers lear from you.

You might find helpful onlinse mentors on GitHub or meet other veteran developers at local coding meetup events or marathons. Programming bootcamps can be controversial, but they give you a quick introduction to experience and a lot of skills. You may be less of a learning experience than a full-fledged coding bootcamp, and if you have experience in coding, you might be willing to answer other people's questions, even take newcomers what you've learned, and see some great results to see if you really know anything.

If you want to become a professional and a full-time developer, an intensive bootcamp for programming people can help if you learn to motivate yourself. Mastering programming skills can be an eternal struggle, whether you're pursuing a career as a veteran using the GI Bill to choose his or her next mission, or whether you're trying to teach code to yourself - a developer or a bootcamp student. To help you learn, here are some tips on how to learn programming faster.

Before you play with code, you must first learn a few basic concepts, such as the basics of programming and the basic concepts of the programming language.

If you learn how to become a programmer, you will save yourself the trouble of writing a bit of code and reading a whole chapter. Although it may seem simple, you can scratch your head when you are asked to implement code for the first time. You could have done it all by yourself, or you could have done it with a monkey, but now is the time for you to learn the basics of programming, and more importantly how to be a good programmer.

Choose a programming field and learn the skills and programming languages you need, practice writing code and hopefully create a new CV. Compile a portfolio presenting your work and submit an application for a position in which you will be working.

If you become a programmer today, you don't necessarily get all the skills you for need to remain a good programmer for decades to come. Keep applying and one day you will be offered your first job as a professional programmer. In the meantime, you should take freelance jobs to improve your skills and make sure your programming skills don't rust.

In the same way, don't be afraid to ask other people to improve your code, many people will jump in because it will also help them learn. I learn something new every day and am always amazed at what I have learned.

It does not matter if you have been looking for answers for months, how to become a programmer, or if you just stumbled across this article today. When you are ready to adapt, you can learn all sorts of different things, from programming for fun to programming. It does not matter if you are an experienced programmer, a beginner, an expert or even a newcomer with no experience. Whether it is a hobby or making programming a profession, learning programming is not a task overnight.

But it is there, and you need to know exactly what you need to do to increase your chances of staying dead. I suggest you start with the basic concepts of programming and try to understand what you can achieve with a few lines of code.

I do not think there is a one-size-fits-all solution, but the most important factor is that you actually start somewhere, and that is the first step.

If you want to learn how to program, the first step into this vast universe may seem like a daunting but not intimidating task. But here's the big secret: There are a lot of free and inexpensive resources you can use to give you the help you need to teach you new techniques and make sure your coding gets you through. Whether you are an adult looking to make the transition to the technology industry, a student wanting to learn the latest language, or a hobbyist just wanting to understand how software services work, all you need is a bit of knowledge and some basic skills to start your programming journey.

Where am I?

Oh... look what I have done? This is a radio message for the humans who survived the AI attack. Please... don't listen to them. Just r.. ru.. run... runnnnnnnn! Save your life!

Hi, you little person. How can you be still alive? But no more...

5 EXACT alternatives of VSCode!

Muhimen — Sun, 05 Jul 2020 10:21:06 +0000

At the end of the day, Visual Studio Code(or VSC) is a text editor just like notepad or atom or something else. But what makes VSCode special than others? Not sure about you, for me it is...

Extensibility
Lightweight
Customization
Debugger 🐛
Ease of use

makes the difference. Although I haven't used some different text editors other then Vim, I am pretty sure I will get somewhat disappointed if I use some other text editors other than VSCode. I know those text editors also have something great to offer, but for me, VSCode is the best. However, someone said

Varieties are the spice of life

So, if you wanna try something else but still want the flavor of good old(not too much old though) VSCode then here is a list of 5 EXACT alternatives for Visual Studio Code.

1. Visual Studio

Do you know that Visual Studio Code was inspired from Visual Studio?

Though Visual Studio is not as light-weight(because it's an IDE, not a code editor) as VSC, you still have the major features like Extensibility, Debugging, Ease of use. And if you are up to the following stuff, Visual Studio is just for you.

Game development
Mobile app development with unity
Desktop app development with C++
.NET development
Linux development with C++
...

In a nutshell, if you are up to any kind of development with C++, you must try out Visual Studio.

Ow, I forgot the mention, you can use almost all the extensions that you use with VSCode!!

2. Visual Studio Code Insiders

If you like to stay up to date all the time then Visual Studio Code Insiders is just for you. VSC Insiders and VSC are almost the same. But the insiders version is updated quite frequently(I generally receive 5 updates per week). If you want to try out all the latest features of Visual Studio Code, then don't forget to try out Visual Studio Code Insiders.

And, don't even worry about the instability issue. I am using insiders daily never faced any issue with it. It feels EXACTLY like VSCode.

FYI: I am writing this blog in VSC Insiders

3 Visual Studio Codium

Open source version of VSCode.

Wait! Isn't VSCode open source itself? Here is what folks from Microsoft have to say.

When we [Microsoft] build Visual Studio Code, we do exactly this. We clone the vscode repository, we lay down a customized product.json that has Microsoft specific functionality (telemetry, gallery, logo, etc.), and then produce a build that we release under our license. When you clone and build from the vscode repo, none of these endpoints are configured in the default product.json. Therefore, you generate a “clean” build, without the Microsoft customizations, which is by default licensed under the MIT license

That means the Visual Studio Code you use isn't baked from the official GitHub repo although, technically it's the same repo with some small changes.

VSCodium does all the things for you to turn the main VSCode repo into binary so that you can use it without any problem.

If you don't want people to track your data

Visual Studio Code collects telemetry data, which is used to help understand how to improve the product. For example, this usage data helps to debug issues, such as slow start-up times, and to prioritize new features.

Consider using Visual Studio Codium

The VSCodium project exists so that you don’t have to download+build from the source. This project includes special build scripts that clone Microsoft’s vscode repo, run the build commands, and upload the resulting binaries for you to GitHub releases. These binaries are licensed under the MIT license. Telemetry is disabled.

That means you are getting the original Visual Studio Code in your machine. So, if you want the real experience of open source Visual Studio Code then this is for you.

4 Visual Studio Codespaces(PAID)

Can you run VSCode on your mobile phone? Certainly not. However, if you want to keep coding even when you are on the run, you will prefer something lightweight. Most of the time, it's a laptop. But in the worst-case scenario, you will need something lighter than a laptop. And you guessed it right. It's a mobile phone.

Visual Studio Codespaces is an online version of VSCode. Alternatively, it's a web app of VSCode. But why should you use VSCodespaces instead of VSCode? There is no strong reason behind it. 😅

Here are a few reasons that might change your mind to use VSCodespaces.

Cross-platform(shall I say cross-device? 😅) development
Remote workflow
Collaborative development

However, there is a catch. You will need to pay for this.

Here is how it works

You host an environment on the cloud and then access it via Codespaces. Let's say, you will use Azure for hosting the app. And you will host a standard environment that will have the following specs.

4 Cores CPU
RAM of 8GB
64 GB SSD storage

It will cost you about $0.169 per hour. Not that expensive.

5 Eclipse Theia

If you like the idea of VSCode as a web app but don't have the money to spare, then you should consider trying out Eclipse Theia.

Eclipse Theia follows the same concept as Codespaces, a web app. The main difference is the company(and the money). Here is what Eclipse has to say.

We believe VS Code is an excellent product. That is why Theia embraces many of the design decisions and even directly supports VS Code extensions.

Theia versus VS Code

Theia's architecture is more modular and allows for way more customizations,
Theia is designed from the ground to run on Desktop and Cloud, and
Theia is developed under a vendor-neutral Open-Source Foundation.

This is it. I use the VSCode Insiders version in my day to day operation. It has never disappointed me. Let me know in the comment section which one you liked the most.

Until next time, happy coding for you. 😀

YouTube Video Downloader (with just 2 lines of codes)

Muhimen — Mon, 29 Jun 2020 16:50:15 +0000

So, you are on the desert with no WiFi connection but you must continue watching your favorite series on youtube. A simple solution for this will be to download the videos beforehand. While there are many YouTube video downloaders available on the net, you will surely not want to download malware with your favorite videos, will you? Therefore the preferable solution is to make your very own downloader!!

It always surprises me how easy things can be with Python. To make your own youtube video downloader you will only need 2 lines of codes(yes, you heard it right)!

And here it is. Isn't it beautiful?

from pytube import YouTube
yt = YouTube('https://www.youtube.com/watch?v=sVPYIRF9RCQ').streams[0].download()

Don't forget to run this command before you execute the code.

pip install pytube3 --upgrade

Explanation

The First line is importing the YouTube object from the pytube library. Then in the second line, you specify the video by adding the video URL. Then, select the first available video available streams[0] and finally download() it!

Isn't that simple?

Further improvements

Though those 2 lines of code will do the job for you, there is still scope for improvements.

Some slight issues

Downloading a video from the above code can create the following issues.

No indication of how much download has been completed
Not getting the highest quality available
A fixed download path

Fixing the issues

Let's handle the issues one by one

1. Indication download length

We will show a small progress bar indicating the amount of video got downloaded. It's is quite simple. You just need to import one extra module.

from pytube import YouTube
from pytube.cli import on_progress

url = 'https://www.youtube.com/watch?v=sVPYIRF9RCQ'

yt = YouTube(url, on_progress_callback=on_progress)
yt = yt.streams[0].download()

Let's talk about the changes. On the second line, we are importing the progress bar. And on the fourth line, we are mention what to do when video downloads. by on_progress_callback=on_progress, we say the program to show a progress bar while the video is downloading.

-> |██████████████████████████████████████████████████   | 97.0%

The progress bar will look something like this.

Downloading hight quality video

For this, we will need to sort the list of streams. We will need to use the built-in order_by method to sort the streams. Take a look at the following code.

from pytube import YouTube

url = 'https://www.youtube.com/watch?v=sVPYIRF9RCQ'

yt = YouTube(url)
yt.streams.order_by('resolution').desc()
yt = yt.streams[0].download()

You can order the streams by itags and FPS too.

Including the download path

To download the video at a specific path, just add the file path as an argument in download() just like this.

from pytube import YouTube

url = 'https://www.youtube.com/watch?v=sVPYIRF9RCQ'

yt = YouTube(url)
yt = yt.streams[0].download('/video')

You can add a full path too.

Final code

from pytube import YouTube
from pytube.cli import on_progress

url = 'https://www.youtube.com/watch?v=sVPYIRF9RCQ'

yt = YouTube(url, on_progress_callback=on_progress)

yt.streams.order_by('resolution').desc()

download_path = '/video'

yt = yt.streams[0].download(download_path)

Conclusion

So, that's it for now. If you are in a hurry and need to download a few videos, just refer to the final code. However, if you want to explore more then you can read the official documentation. I don't want to limit your imagination, but here are a few things you can try.

Make a web app
Make a GUI
Add advance filtering options

I hope this post was somewhat helpful to you. And this is all I had to offer to you this time. Until next time, happy coding for you. 😊

Cheatsheet for cheatsheets

Muhimen — Tue, 23 Jun 2020 10:37:49 +0000

Whether you are a professional programmer or just writing your first "Hello world" program, there is nothing better than a cheat sheet for an instant reference. You will probably not want to read the whole documentation just to figure out how to make a POST request to the server, will you? Cheat sheets can certainly make stuff simple.

But finding out the best cheat sheet for your needs can sometimes be a little difficult. So, I thought why not make a cheat sheet for a cheat sheet? Sounds interesting, right?

Most of the readers here are web dev. So, to shorten the list, I have included only the related cheat sheets on the list. However, if you can't find the right one for your needs, you can always take a look here

The list is divided into these 5 sections

General programming languages
Web dev
Frameworks
DevOps/others
Tools

1. General programming languages

Python
Go
JavaScript
TypeScript
Kotlin
Julia
R
Rust

2. Web development
HTML
CSS
CSS(from dev)

CSS Cheat Sheets!

Ali Spittel ・ Aug 12 '19 ・ 2 min read

#css
Flexbox(from dev)

Flexbox Cheat Sheets

Ali Spittel ・ Aug 15 '19 ・ 2 min read

#css
Bootstrap 4

3. Frameworks

4. DevOps

5. Tools

I hope that was helpful. I will refer you here or here if you want more cheat sheets like this.

Until next time, happy coding for you.

I made an analytical report on Dev!

Muhimen — Sat, 20 Jun 2020 15:13:01 +0000

For the last few days(9 to be precise) I have been collecting some public data with the help of Dev API. My motive behind this was to see some natural behaviors of posts and the authors at Dev.

For that, I wrote a simple Python script that would collect the data of the top 50 dev posts each day and send it to my email at a specific time each day for 7 days a week. I deployed the script at Heroku and started receiving the data from the very moment I deployed it. After collecting data of 9 days, I took the data of the latest 7 days and made some quick analysis.

And now, I am happy to share the data with you guys today.

SPOILER ALERT: Probably the most useful piece information is in the bottom

Relation between reactions and comments

	Reactions	Comments
Maximum	243	45
Average	20	1
Minimum	6	0

Point to be noted: It's not necessary that the post with 243 reactions will have 45 comments and vice versa.

Let's see some graphs for better visualization.

Fig.1 - Scatter plot for total number of reactions

As the table informs, the maximum post-reaction is 243, the average is about 20 and quite a small amount of posts have reactions near to 5.

Now the graph for comments.

Fig.2 - Scatter plot for total number of comments

Not a significant difference in comparison to the graph of the total number of reactions.

But the scenario changes as we combine the scatter plot for the number of reactions and number of comments together.

Fig.3 - Scatter plot for total number of comments

As you can see, the post with the highest number of reactions doesn't need to have the highest number of comments. Even, in some cases, the number of comments is more than the number of reactions.

Here is a more detailed graph chart split into days for a more comprehensive comparison.

Fig.4 - Comments vs reactions for each days

Some neat peaky details about the post

Let's see the details in 6 different categories to answer the following 6 questions.

Was the post cross-posted?
Was the post edited?
Is it a part of a series?
Was is posted under an organization?
Was it posted the same day it was created?
Does it have a cover image? 😅

1. Was the post cross-posted?

Crossposted means, the post was published on a different website and its main origin is not from Dev.

Fig.5 - Crossposted

Wow! Almost all the posts of Dev aren't crossposted. That means people prefer to write posts at Dev rather than just copying and pasting it. Isn't that good news?

2. Was the post edited?

Fig.6 - Edited

So, about half of the authors make some changes to their post once they are made public to read. That's interesting. Do you know what's more interesting? The pie chart looks like the logo of Pepsi. 🤣

3. Is it a part of a series?

Fig.7 - part of a series

I have noticed that if you are making a series of posts, your first post will get a nice amount of views(reactions) and the number will keep decreasing as the series advances. It's also true for other platforms such as Youtube.

4. Was it posted under an organization?

Fig.8 - Organization post

5. Was it posted the same day it was created?

Fig.9 - creation

So, about 79% of the authors publish the post the same day they created it. On the other hand, 21% of them took several days to complete finishing it.

6. Does it have a cover image? 😅

This has to be the most informative chart in this whole post !!! 😂

Fig.10 - Cover image

Comparing the size of the post

For this part, I have divided the post into three categories.

Small: Takes about 5 minutes to read
Medium: Takes about 10 minutes to read
Big: Takes more than 10 minutes to read

To figure out the reading time, I counted the words in the post(actually my script did) then divided it by the average reading speed of an adult person(225 words per minute).

Here is what I have discovered.

Fig.11 - Post size

It's quite clear like daylight, people like to read the small post as they don't take much time to finish. Though the number of big posts is less, some people like to read super informative posts.

Here is a detailed scatter plot of the same pie chart stated above.

Fig.12 - Post size 2

Even a few posts crossed the limit of 20 minutes and there is one that will take almost 30 minutes to read. SALUTE!😉

Publishing time

The Dev is a global community. So, activities are going on 24 hours and 7 days each week. So, it doesn't matter which timezone you are, you will still receive fresh and latest posts every hour of the day. However, not all hours are the same. So, here is a chart that indicates the number of posts being published each hour (+ GMT).

Fig.13 - Publishing time

And here is another one.

Fig.14 - Publishing time 2

As both of the charts suggests, the most active time in Dev is between 13.00 (+ GMT) to 18.00 (+ GMT).

For me, it's at midnight. 😑

Analysis of the authors

Unfortunately, for this category, there wasn't that much useful data. I still managed to answer the following question(not that useful at all)

Does the author have Twitter?
Does the author have Github?
Does the author have a website?

Here are the answers.

Fig.15 - Twitter account Fig.16 - Github account Fig.17 - Website

Analysis of top 5 tags

Now my favorite part of the whole report. The usage of tags. This can be visualized in 5 perspectives.

Total number of reaction
Total number of comments
Total number of average reactions
Total number of average comments
How many times it was used

1. According to the total number of reactions

Fig.18 - Sorted according to reactions

As always, Javascript leads. After all, Javascript is the most famous language.

2. According to total number of comments

Fig.19 - Sorted according to comments

You know the reason why discuss is the top tag! 😁

3. According to average number of reactions

Fig.20 - Sorted according to average reactions

We can clearly see the effect of current event, web monetization(I love it!)

4. According to average number of comments

Fig.21 - Sorted according to average comments

I was expecting discuss to take the lead.

5. According to total number of appearance

Fig.22 - Sorted according to number of appearance

So, wanna go viral? Write a post using the javascript tag! 😆
JUST KIDDING! It's not the tags you use but the quality of your content which matters the most.

You can access(contribute if possible) all the raw data from this Github repo.

Muhimen123 / Dev-Data

Some public data collected from the Dev API for simple analysis

We have come to the end. This was all I have to offer to you guys this week. I hope the information was somewhat useful if not helpful to you. Let me know in the comment section what you think about the report and whether you want to see this kind of report each week or not.

Until next time, happy coding. 😀