 
 
# The Browser Developer Tools on Mobile Phone 
 
For you to have got here, you must be either a curious explorer like me, or you're stranded with mobile and wonder if it is possible to use developer tools on mobile phone. Straight to the point, there is a way to use browser dev tools on your phone conveniently. I was working on a project recently on which I logged a lot of info such as a reference ID, dynamic username, etc. One day, while I was not with my PC, I got a call and needed to check the app and access the console, but I only had my phone with me. This got me asking how I could use the developer tools on mobile browsers.  

##  Mobile Dev Tools with Eruda

 [Eruda](https://github.com/liriliri/eruda) is a small but mighty web tool that makes it possible to access Dev Tools on mobile browser. To use this tool, visit the web page you need the Dev Tools on your phone, copy and paste this line of code below into your mobile web browser:

_javascript:(function () { var script = document.createElement('script'); script.src="//cdn.jsdelivr.net/npm/eruda"; document.body.appendChild(script); script.onload = function () { eruda.init() } })();_

**PLEASE NOTE**

Pasting the above code into your browser will automatically remove the prefixed "javascript:" and start with "(function...", if this happens, manually type in the "javascript:" and hit Send. Wait for few seconds then a transparent Settings icon will start floating on your screen, that the Eruda icon which you can use to open or close the Dev Tools. 
  
   
## The Basic Operations You can Perform with Eruda

- JavaScript Operations: You can view JavaScript codes in console and even perform arithmetic operations. You can trigger functions and see the results immediately on the fly. 
- Element Inspection: You can follow DOM trees and inspect your HTML elements including the styles exactly how it is on the desktop Dev Tools Elements tab. You can also manipulate the styles and watch the changes live. 
- Network Activities: You can track requests and responses via this tool, just as it is no Network tab on PC. 
- Etc 





## Conclusion 
I didn't code Eruda myself. It's an Open Source project on github by  [LiriLiri](https://github.com/liriliri) 
 
 
--- 
 
_**If you learned anything, hit the clap button and share with your friends. If you have anything to add, use the comment box below. If there is any suggestion concerning the blog, use the Feedback button at the top. If you want to hire me for Web Dev or writing gig, use any of the platforms at the end of the page.**_


How to Access Developer Tools (Dev Tools) on Mobile Phone Chrome Browser

Use Developer Tools on Mobile Browser

 
 
# Replacing the Default Input Field Placeholder When the Type is "date"
 
I guess you've tried the placeholder attribute but it seems not working. Yea, I'm sorry to say, but it won't work that way. Unlike the input type text, textarea, and number, the date input type doesn't recognize the placeholder attribute; so to get it working using ReactJS, there is a little workaround. 

##  Displaying a Default Placeholder in date input 

I did this in ReactJS but it's OK if you're not using ReactJS, you can still tap the idea and brilliantly apply it to whatever programming language, framework, or library you're using. Here is the drill... 

I created a state hook with string "text" as its value:

```JS
const [inputType, setInputType] = useState("text")

```

Then, I created two functions to change the state:

```JS
function changeToDate() {
setInputType("date") 
}
```


```JS
function changeToText() {
setInputType("text") 
}
```

On the input element, I added:

```HTML

<input
value = "The value you may want to assign"
placeholder = "Your desired placeholder"
  type = {inputType}
onFocus = {changeToDate}
onBlur = {changeToText}
/>

```

Initially, the input field will come as a text box which will allow your placeholder or default value to be shown. Once it receives focus (clicked), it changes to a date input which enables user to pick a date. When the focus goes again, it changes to the text box and your value still remains. 

With this basic workaround, you should be able to add a placeholder to your date input without any unbearable side effect. I hope it helps. 
 
 
--- 
 
_**If you learned anything, hit the clap button and share with your friends. If you have anything to add, use the comment box below. If there is any suggestion concerning the blog, use the Feedback button at the top. If you want to hire me for Web Dev or writing gig, use any of the platforms at the end of the page.**_


How to Change The Date Input Default Placeholder To a Value in React

How to Change The Date Input Placeholder in React/JavaScript



## Some Basic JavaScript Terminologies That May Get You Confused 


The first thing one has to deal with while learning JavaScript (even programming as a whole) is the technical terms surrounding it. There is a whole lot of them! Meanwhile, everyone wants to be up and running (building stuff) immediately they start learning coding. Yes, the best way to learn coding is by getting your hands dirty. But what happens to the fundamental terms? And without a convincing understanding of these terms, I'm afraid the foundation is still weak, and understanding the language can be a myth. I've seen many developers who have successfully gone above beginner's stage, without a proper understanding of some of these terminologies and how they work. The truth is that this kind of people continually pay for it whenever it's time to study code's behaviour or debug. Below are few of these terminologies and how they function:


## Variables, Identifiers, and Values 
In oftentimes, variables and identifiers are mistaken for each other. Yes, non-exclusively, they're the same, but technically, they're different. A variable is a user-defined word or combination of alpha-numeric characters (possibly with some symbols), that's used to point to a memory location and contain the value in the memory. 
This is what I'm talking about, when you do: 
```js
const phoneNumber = "+2348146931607";
```
You're saving the string "+2348146931607" into a memory stack and you're using the word phoneNumber to point at that location in the memory. 

Meanwhile, an identifier is also that word, or combination of alpha-numeric characters and symbols that is used to identify variables, functions, arrays, and the likes. _Now you must be confused, but wait a moment._ Have it at the back of your mind that all variables are identifiers but not all identifiers are variables because some identifiers are just the names given to some entities such as a function,, and an object. In the example above, the word "phoneNumber" is both a variable and an identifier, but look at it in the following example:
```js
const employee = {
name: "Olasunkanmi Ajibola",
phoneNumber: 2348146931607
}
```
The identifier "employee" is technically not a variable, it's only used to identify an object that contains some properties. However, the data contained in variables are referred to as values,  and can either be of primitive type or reference type. The primitive values as the basic value types in JavaScript such as string, number, and boolean; while the reference value is a collection of primitive values or properties. E.g "+2348146931607" as a primitive value, and **_{name: "Olasunkanmi Ajibola", phoneNumber: "+2348146931607"}_**  as a reference value. 
It's OK if you don't understand this yet, you'll get it soon. 

## Memories, Pointers, and Value Access 

I'm starting from Memories because we'll need it while explaining others. In saving values to memory, JavaScript uses two kinds of memory - the stack and the heap. These terms are two thick Computer Science topics so I won't go deep into them here, I'll just briefly introduce them. 

The stack is like a frequently accessed memory where majorly the primitive values and pointers are kept. For a technical reason, only the values whose size can be pre-calculated are stored in the stack memory (string, number, boolean, null, undefined), and they are saved as a stack i.e Last In First Out (LIFO). The heap on the other hand saves the values whose sizes can't be pre-determined, such as objects and arrays, then keep their pointers in the stack memory for easier access. Like I said earlier, this is deeper than this short explanation, but we can hold on to that for the later part of this article. 

The Stack and Heap Memories

![Stack and Heap Memories](value-variable-pointer-and-address-in-javascript.webp)

_Pic Credit to Maximilian Schwarzmüller_


Let me introduce you to Pointers and Values Access with a code sample:
```js

var newStudent = {
    name: "Ewatomi", 
    phone: "2348146931607"
    };
var favStudent = newStudent;
favStudent.phone = "2347069426383"
console.log(newStudent.phone)
```
Without reading further or trying it, can you guess what will be printed to console? Think. 
You'll see 2347069426383 logged in the console, _but why?_ This is where Value Access, Memories, and the Pointers come in. 

When the **_newStudent_** was saved to the memory, the value made it to the heap memory while a pointer to the heap memory location got saved to the stack memory. 
When the **_newStudent_** was assigned to the variable **_favStudent_**, it didn't copy the value of **_newStudent_**, it only assigned the pointer to its memory location which means new value wasn't given to **_favStudent_**, its value still points to what's saved in **_newStudent_** memory location. So, when **_favStudent.phone_** was manipulated, the property changed in the **_newStudent_**.

_How then can we get the values of **_newStudent_** into **_favStudent_** without it manipulating **_newStudent_** when changed?_ There are different ways to achieve this, I'll only share the one which is the most recently introduced method - Spread Operator.

When you have

```js
 var newStudent = { 
     name: "Ewatomi", 
     phone: "2348146931607" 
     };

 ```
 
 and you want to copy it's value into say **_favStudent_**, you can do:



```js
var newStudent = {
    name: "Ewatomi",
     phone: "2348146931607"
     };
var favStudent = {...newStudent};
favStudent.name = "Ola"
console.log(newStudent.name)

```
This will simply log "Ewatomi" to the console because using the Spread Operator "..." to copy the properties of **_newStudent_**, we're not pointing at the memory location, we created another memory location and saved the properties there almost independently. I hope this is clearer now. 




---


_**If you learned anything, kindly hit the clap button and share the article with your friends. If you have anything to add, use the comment box below. If there is any suggestion concerning the blog, use the Feedback button at the top. If you want to hire me for Web Dev or writing gig, use any of the platforms at the end of the page.**_





Values Types, Variables, Identifiers, Pointers, and Memory Addresses in JavaScript


Having used the android Operating System for more than a decade and counting, I
believe my experience is vast enough to make this list of the must-have android
applications. Any application mentioned bellow is not for promotion purpose, but
purely based on my experience and unbiased preference over the years. Also note
that the list below is in no order. Let's go straight to the point.

# Top Android Applications You Should Install

- #### Ampere
![Ampere](ampere.png)

Have you ever plugged your phone for hours just to come back and wonder if it's
charging slower or something? You get confused whether it's the USB cable, the
charger (_charger-head_) or the charging port. Before you can know what may be
wrong with your phone, you have to plug and wait for like ten minutes to study
the charging speed every time you plug or change your charging equipment -
Ampere makes that easier. This simple yet essential app can read your device
charging and discharging speed. You can use it to test how fast a cable or
charger charger works without having to wait for ten minutes or thereabout.

- #### AutoResponder WA
![AutoResponder WA](AutoResponder-WA.jpg)

Earlier before I discovered this app, I was using Tasker and Automate to achieve
what it gives out of the box. As the names says, this app can serve as a little
robot that monitors your WhatsApp notifications and respond to messages
automatically (as pre-configured). As an example/use-case, I receive averagely
25 "thank you" related messages daily which should attract equally 25 "you're
welcome" kinda response. I find it stressful typing this every time someone
thanks me so I set some processes using Tasker and Automate to trigger the
response, and that's what AutoResponder WA does too. I've tried AutoResponder WA
as well and it's quite straightforward and easy to operate but I think I'll
stick to my stressful Tasker processes. Lol. Just check out AutoResponder WA,
you may just love what it does.

- #### YouVersion | Yoruba English | Tecarta
![Yoruba English Bible](Yoruba-English-Bible.png)

If you're a Christian or you're interested in reading the Bible, these are three
different Bible applications I love for different reasons. They all offer
similar features except for the Yoruba English which is the only bilingual and
mono-versioned (KJV) Bible among them. The other two give you access to all
versions of Bible with audio and more. Some versions are paid on Tecarta Bible
while YouVersion gives you access to all versions for free if you agree to share
your name and email with the publishers of the versions. I've used Tecarta for
more than six years and the other two for less than three years.

- #### CamScanner
![CamScanner](CamScanner.png)

When it comes to scanning documents on the go and in the best possible quality,
CamScanner does the job perfectly. The scanner is rich in features and there are
some functionalities reserved for the premium version such as OCR (Optical
Character Recognition). Another beauty of it is that you can synchronize your
documents across devices.

- #### Clip Stack
![Clip Stack](Clip-Stack.png)

Just like Ditto on Windows, Clip Stack provides everything needed in a clipboard
manager. This simple app monitors and keeps everything you copy on your phone
for easier reference and access. You can select some of your clipboard texts as
favorites, to appear on a separate tab. The texts copied two years+ ago can
still be accessed and searched in Clip Stack history if nothing happens to your
phone or if you have a backup. Clip Stack can be used as a Note/Todo app to jot
things like to-do list an all. To wrap it all, the app is really minimal and
doesn't take much memory.

- #### Codec
![Codec](Codec.jpg)

This is a technical word processor with a touch of styling and decoration. You
can convert texts to different formats including ASCII and even binary format.
Also, Codec can convert your texts to different fonts. You can check it out on
Google Play Store, it's a cool app and free to an extent.

- #### Copy Text On Screen
![Copy Text on Screen](CopyTextOnScreen.jpg)

This does what its name says. Some website owners disable copy functionality on
their web pages, if you have Copy Text On Screen, you can just make a screenshot
and use the app to extract the texts out. Google Lens also does this which is
one of the stock apps that come with recent android versions. So if your phone
does not have Google Lens or does not support it, Copy Text On Screen is your
best bet.

- #### Droid Info
![Droid Info](DroidInfo.png)

Droid Info shows you rich and detailed information about your android phone such as
your chip-set, fingerprint version, dpi, CPU architecture, your exact camera
quality, memory and storage sizes, available and supported sensors, and even thermal
information. With Droid Info, you will know more about your device. 

- #### FL Studio Mobile
![FL Studio Mobile](FL-Studio-Mobile.png)

I haven't really used this application, I just have it hanging around on my
phone. It's for music editing and making. A friend once said he used it to
extract beat out of a song and I think that's why I downloaded it. I just
haven't had time to explore yet. You can check it out, it's a paid app on Play Store.

- #### Edge Gesture
![Edge Gestures](EdgeGestures.png)

I started using this app two years ago and it's been making my life supper
easier. With Edge Gesture, you can perform several actions just by touching the
edges of your screen. It supports clicking, double-clicking, triple-clicking,
slide up, slide down, slide and hold, etc. You can even open an app or pull down
the notification panel by sliding your finger at the edge of your screen instead
of reaching to the top of the screen. Edge Gesture also has a customizable
floating button you can be explored and utilized. 

- #### KineMaster
![Kine Master](Kine-Master.jpg)

I've used several other video editors on android but KineMaster stands out.
Especially if your chip-set is Qualcomm Snapdragon, you can have more
functionalities such as Green Background. It's a vast app awaiting editors who
can explore it. 

- #### Markor
![Markor](Markor.png)

Markor is an effective simple text editor. I love it because it can compile markdown and it does this the best way
it should. In fact, that's what I used to type this blog post. It offers the
best experience if you are ever cornered to write a markdown article on android.
It's handy and rich in features. 
- #### MP3 Video Converter
![MP3 Video Converter](MP3VideoConverter.jpg)

If you need to quickly take an audio out of a video, this simple piece is your
plug. It doesn't only extract audios but can trim and merge them. It does it job
and doesn't run in background stealthily. Good Play Store link.

- #### NetSpeed Indicator
![NetSpeed Indicator](NetSpeedIndicator.png)

What this app offers usually comes with phones these days but if your phone
doesn't have the feature to display your network speed (both uploading and
downloading speed) on your notification bar, I'm sure you want to use NetSpeed
Indicator to get that done. I've been using this app since the days of Techno
P5, it is very light and memory friendly. 

- #### Nickzom Calculator
![Nickzom Calculator](NickzomCalculator.jpg)

If you're an engineering student or a science student who deals with Mathematics
and its surrounding subjects, the capabilities of this small but mighty
calculator will amaze you. The developer really did an amazing job. This
calculator can solve most engineering calculations and still show the steps. All
you need to provide are the parameters. And surprisingly, it's not even heavy.
You need to check it out for real. 

- #### Unified Remote Full and PC Remote
![Unified Remote Full](unified-remote-full.jpg)

These apps can let you control your PC from your phone, exciting right? You can
be using your phone's screen as your laptop's track-pad. You can as well cast
your phone's screen to your PC and vise versa. You can use them as a remote camera -
after connecting your PC to your phone, what your PC camera is capturing can be
watched on your phone. Both apps are great at what they do and they have diverse
functionalities you can't finish exploring in hours.

- #### QuickShortcutMaker and Power Shortcuts
![QuickShortcutMaker](QuickShortcutMaker.jpg)

There are some functionalities on android phones that you'll need to tap screen
up to five or six times before you get to where they are located in settings.
For example, if you want to adjust your phone's font-size or you want to add
another finger to your registered fingerprints, you have to go through Settings
and click the next button and another one before you get there, but with either
of these apps, you can simply assign an icon to that operation and maybe pull it
to your home-screen or app drawers with a customizable name and icon just like
an app-icon. Both are free on Play Store.

- #### PVR Remote
![DSTV PVR Remote](PVR-Remote.png)

I still wonder why this app was named PVR Remote instead of maybe DSTV Remote which is more straightforward. The app is simple a DSTV decoder remote control. If your phone has Infrared or can use the 
IR-dependent remote controls, then here is an app for you to control your DSTV
decoders. It works perfectly just like the hard remote control if not better. It's
available on Google Play Store, free.

- #### Quotes Widget
![Quotes Widget](quotes.png)

This is a tiny app that does just one thing - displays quotes on your home
screen. It is pre-loaded with 2000 quotes from different categories and wise scholars. The widget that can be
neatly seen on your phone screen every time you unlock your phone. You can
also add more quotes locally and manually, and get them displayed. I love it because it simply
does its job without ads or distractions.

- #### Screenshot Easy Pro
![Screenshot Easy Pro](Screenshot-Easy-Pro.png)

Screen-shooting comes with every android phone of course but not all android
phones can make a long screenshot by default; hence, the reason I have this app. It's neat and has more functionalities you may love.
It's a paid app but there is a free version as well. Check it.

- #### SD Maid
![SD Maid](SD-Maid.png)

If you feel your phone storage is filled up and nothing else to safely delete,
try using SD Maid, you'll realize how much deletable junks you have hidden in your
storage. SD Maid is customizable enough to not touch anything you don't want it
to touch. It can clean your most stubborn app caches and can be programmed to periodically
perform this storage cleaning automatically, just like a maid that it is. With
SD Maid, rarely will you go out of storage and your important files are always
safe. It's free to an extent on Play Store.

- #### Sleep Sounds
![Sleep Sounds](Sleep-Sounds.jpg)

This app is a collection of different categories of serene, quality, and suiting sounds for
different moods. Apart for sleeping, I use this app as noise cancellation maybe
if I want to read in and concentrate in a noisy environment. It has the perfect
sound for every mood, and highly customizable. Try it out, you may fall in love
with it.

- #### Unit Converter
![Unit Converter](Unit-Converter.jpg)

This is a box of tools. You can convert almost all measurements and units
ranging from length to weight to size and volume. You can as well convert
currencies easily and the currency conversion rates get updated frequently.

- #### Mi Remote and Zaza Remote
![Zaza Remote](zaza-remote.png)

These remote controls work only work if your phone has infrared. You can set up a
remote control for any kind of appliance and electronics such as TV, AC, fan,
etc. Choosing either of the two is purely preference. I have both because one came with my Xiaomi phone.

- #### iQuran Pro
![iQuran Pro](iQuran-Pro.png)

Among all the Quran applications I have ever come across, iQuran Pro renders the
best functionalities. The major reason I fell in love with this invaluable app
is for its transliteration. You don't compulsorily have to be able to read
Arabic before you can feel the glimpse of pronouncing Arabic words. It has
translations as well, in different international languages and by well respected
reciters. If you ever have a need to use a soft Quran, iQuran Pro will
definitely serve you well. It is a paid app on Play Store but it has a
free lite version.

- ### Cube ACR
![Cube ACR](Cube-ACR.jpg)

This is a useful alternative if your phone does not have an inbuilt call
recorder. I've tried many other call recorders but Cube ACR seems to offer more
and works efficiently without getting killed by battery managers. Get your conversations automatically recorded by Cube ACR and have zero worries if you need to listen to what someone told you via phone call.

- ### Fake Call
![Fake Call](Fake-Call.jpg)

In a few words, Fake Call fakes calls. Some situations may arise where you
desperately pray a call comes through on your phone so you can excuse yourself
from a tiring meeting or escape a boring gathering - Fake Call becomes a savior. I've
used this app to escape some never-ending choir rehearsals in the past.
The app can go as far as talking back to you if you pick the fake call - just like a
real call. Fake voice can be preset which makes it more "real".

- ### Inputting+
![Inputting+](InputtingPlus.png)

I still wonder why this app is so unpopular. Well, maybe because its importance
is not really obvious even when it can be a life-saving tool when it's needed.
Have you ever typed a super-long message in maybe an online forum textbox or on
WhatsApp reply-box but one way or the other, it got cleared and you just had to
retype all that? It's happened to me on several occasions and that's why I dug
this app out. Inputting+ can be used to undo lost texts. It monitors your
keystrokes as you type every alphabet on all apps. Of course, you can configure
it to your taste by black-listing or white-listing some apps as you wish.

- ### NOVA Launcher Prime
![Nova Launcher Prime](Nova-Launcher-Prime.jpg)

This is the best android launcher I've ever used. It effortlessly gives you
full control over your phone with rich customizations and attractive
look-and-feel. If you are a good app explorer, you can use this app to make a
god out of your device. It is a paid app on Google Play Store but has a free version.

While there are other important apps, to mention few, and to focus on apps everyone can easily utilize, I
intentionally excluded some apps that cannot be fully enjoyed without having
root access, e.g Titanium Backup, Mobile Uncle, Lucky Patcher, Tasker, Macro Droid,
Automate, etc. Most of them are not on Google Play Store though.

---

_**If you found this post useful, kindly hit the clap button and share the article
with your friends. If you have anything to add, use the comment box below. If
there is any suggestion concerning the blog, use the Feedback button at the top.
If you want to hire me for Web Dev or writing gig, use any of the platforms at
the end of the page.**_


The Android Apps You Must Have

The Top Must-have Android Applications

 

## You Can Still Blog 

Never let your inability to write like a professional writer kill the ability to get your contents/ideas out there. I'm starting from this angle because I've met quite a number of people whose blogging idea would have flourished endlessly, but the mentality of "_all bloggers are writers_" placed a limit on their potential, and that was the end of the great things they could do - you definitely don't want to be like them. 

Either you're a farmer, a doctor, a developer, or anything, all you need to have is the idea of what you want to write about. As long as you have this clear idea and you can briefly explain it, your possibility of becoming a successful blogger becomes more feasible, and you are a mile closer to earning the rewards that come with blogging. "_But how is this possible? I mean, how do I get my ideas into publishable articles that will be worth reading?_" Well... That's a question I'm going to answer next. 

## How Do I Blog When I Can't Write? 

Do you realize that not all the books on Amazon and other online bookstores, and even physical bookstores are literally written by the authors on the covers? Of course, there are ghostwriters whose job is to take that idea from you, beautifully reorganize it, pen it the best presentable way, and hand it over to you for an affordable price without ever claiming ownership. Yes, I am one of these ghostwriters that make things like that easy for people that have ideas but no time or technical know-how. It still remains your idea, your content, your book, ...your blog post. My point is that, you can simply hire an honest ghostwriter, get your ideas crafted, then publish it originally on your blog. Now you're aware that you still stand a chance even if you can't write, but what platform should you blog on since you're probably not a web developer? 

## Top Blogging Platforms You Can Start With 

![What Platform to Blog](what-platform-to-blog.jpg)

_Credit to Catalin's Tech_

When it comes to blogging effectively, the platform you use or your technical/SEO knowledge matters. Failing as a blogger does not necessarily mean you're lazy or not publishing the right topics, it can be due to how your blogging platform handles your contents, or the standard of the blog you built from scratch. Below are five of the top popular blogging platforms in no order. 

1. [Medium](https://www.medium.com/) 
2. [WordPress](https://wordpress.com/) 
3. [Blogger](https://www.blogger.com/) 
4. [Dev](https://dev.to/) (Majorly used by developers)
5. [Hashnode](https://hashnode.com/) (Majorly used by developers)

These platforms give you the opportunity to publish and manage your contents without having to develop your blog yourself or hire any developer, hence they are sometimes called Content Management Systems. They are already optimized for Search Engine Optimization (SEO) which means you don't need any technical skill before your articles appear among the top Google search engine results. All you need is a rich and original content, and you're good to go. 
While the above listed blogging platforms are great and all, there are some cons that may turn you off or make you choose one platform over another. For example, whatever you post on Medium is not fully owned by you anymore. This means it's difficult to move your articles away from Medium to another domain without losing originality. However, Hashnode allows you to own your content and monetize it using [Web Monetization](https://webmonetization.org/). Another barrier is that, most of these platforms give you limited control over your posts' metadata in a situation where there is a need to add extra description to make Google search result more juicy. You can't attach ads content to your posts, and monetizing posts on Medium is super difficult especially if you're from a country like Nigeria. 
Now back to the main question; _why should I start blogging?_

## Four Major Reasons You May Want to Start Blogging 

![Reasons You May Want to Start Blogging](reasons-you-may-want-to-blog.jpg)

_Credit to HTSABO_

I made it four because all other reasons are seemingly interconnected with the major ones: 

1. **Blogging Forces You to Keep Learning and Improves Your Confidence**:
There is no how you will write a quality content about a topic without spending time researching on it. Even if the said topic is your area of expertise where you can freely express yourself without consulting external contents, you will still require some validation and confirmation before publishing your content, and in the process, you will add to your bank of knowledge and maintain relevance and currency. Therefore, blogging is a perfect way to learn more about different fields to become relevant in almost all topics, and boost your confidence. 
2. **Enhancement to Your Professional Image and Connection With Like-minds**:
The contents you put out there are a great avenue for you to connect with other people that think like you or have similar interests. Blog posts may seem isolated and lonely but the number of viewers and readers when you check Google Search Console will leave you wondering. The quality of your blog posts can have an impact on the quality of your social media followers, can buy you some authority, and enhance your professional image - you're definitely growing a better online presence while blogging. 
3. **Improves Your Writing Skills**:
If you write your blog articles yourself, there is no doubt that you will keep getting better. Especially someone planning to venture into freelancing/ghostwriting, it is a way to keep you prepared for the bigger challenge both in quality and in quantity because you will have several published contents you can easily present as an online portfolio to attract clients. The beauty of it is that, you always write a better piece, which means the more you write the better you become. 
1. **Financial Gain**:
Arguably this is the only reason you are interested in, and that's fine, because financial stability should not be underrated. While there is a money-making potential in the earlier listed reasons but not so obvious, there are some conventional ways by which blogging can add to you financially. Wait before you proceed, this will not make you rich SUDDENLY, so if you're looking for something that will turn you to the next Jeff Bezos overnight, I'm sorry to have wasted your time. 
Having nurtured a full-blown blog with rich and original contents that command views and clicks, it is time to apply for Google AdSense. Once Google find your blog worthy, they grant you access to AdSense which randomly places advertisements on your blog and of course earns you dollars based on your blog's performance. 
Another way to make money from blogging is personal advertisement for companies' products. Some companies can approach you to help promote their products (affiliate products and services) on your blog, and you get paid meaningfully. 
There is a new technology as well, known as Web Monetization whereby the readers of your blog posts automatically make some form of payment while they read your articles. You can read more about it [here](https://x.hashnode.dev/web-monetization-on-hashnode-ckdu9umr900jmn0s1gr0r4gis). 


To wrap it all, the reasons above are genuine enough for someone curious enough to have read up to this stage. However, remember that, just like every other thing, a form of consistency is always required for one to reach a certain goal in life. One strike of a digger doesn't dig a well.

Before I end this, did I say blogging can't get you rich suddenly? Anyway, it depends on your definition of richness. I just want to add that there are bloggers making averagely between $2000 and $10000 monthly.

------------------
_**If you're inspired or you learned anything, kindly hit the clap button and share the article with your friends. If you have anything to add, use the comment box below. If there is any suggestion concerning the blog, use the Feedback button at the top. If you want to hire me for Web Dev or writing gig, use any of the platforms at the end of the page.**_

------------------




Why You May Want to Start Blogging

All You Need To Know Before You Start Blogging


## Going Into Web Development 

Are you considering starting a web development journey? Great! It is a beautiful and rewarding thought because we can both agree that the world is evolving and almost all traditional activities have now been digitized. Before we start, the first thing I'll love you to understand is that, irrespective of whatever you might have heard from people or read on the internet, register it at the back of your mind that **nothing is impossible to learn**. So far you are ready to sacrifice your time, you're equipped with the major resources like internet connection and the necessary gadgets, and you have an undying passion to learn with the right guidance, you're definitely going to succeed excellently. If you think all those are in place already, you can confidently call yourself a Web Developer. 

Having decided to give it a trial, the immediate next step is to peruse your stand in the digital world, perhaps, considering the background you're coming from. If you're a little bit techy and digitally savvy, then you're fully fit to dive into the world of web development. However, if you're coming from a technologically naive background with absolutely zero knowledge of how the web works, it is highly recommended that you make some prior research to equip yourself with the basic knowledge of the web and the internet, as it'll be required to cement your understanding in the journey of web development. I suggest you watch few YouTube videos on that to grab the concept first. Having ensued a convincing understanding of how the web works, the next thing is to pick up the popular three musketeers (HTML, CSS, and JavaScript). Let's start with the skeleton of the web contents itself - The HTML. _What is HTML_? 

The shortest answer to this is, HTML (HyperText Markup Language), is a markup language. A markup language is a pre-designed system or mechanism of annotating or labelling a bunch of texts in a document so that a group of texts is identified differently from another. _That sounds too jargonistic?_ Let me bring it down to what you may be familiar with; when you identify some texts as heading and some as sub-heading in your Microsoft Word app, there is a way the computer recognizes them under the hood, it's with the help of a markup language. _Clearer enough? Let's continue._
As some markup languages are configured to work behind the likes of MS Word app and other word processors, HTML is designed to handle the contents that are prepared to be displayed by web browsers. Therefore, it is safe to say: 
> _HTML is the semantically structured skeleton of any content displayed on the web._ 

![Common HTML Tags](basic-html-tags.jpg)

_Credit to Data Flair_

Below is the basic structure of an HTML. 

```html
<html>
<head>
<title>Title of the Page</title>
</head>
<body>
<h1>One of the six headings. We still have h2 to h6.</h1>
<p>This is a paragraph</p>
There are many others, and they are called tags. 
</body>
</html>
```
It is absolutely OK if you don't understand the block of code above, it's not a big deal, as you'll later understand it, and even more. 

While HTML is important to the contents on the web, the contents don't, by default, appeal the eyes. This is where CSS takes over. _What is CSS_? 

A Labelled Block of a CSS Code

![A Labelled Example of a CSS Code](a-css-code.jpg)

_Credit to Ubiqum Code Academy_

CSS (Cascading Style Sheet) is a stylesheet language used to beautify the structured content laid down by HTML. It is used to describe how the contents of HTML is visually presented to the consumers. If you've ever seen a text on the web that has a background color, or some that are more beautiful than others, that's the work of CSS. 

The third tool in this group is JavaScript.  JavaScript is a scripting programing language used to automate and handle interactivity, primarily on the web frontend. 

Brief uses of JavaScript

![Uses of JavaScript](uses-of-javascript.png)

_Credit to Javatpoint_

JavaScript has the power to change the state of web contents from static to dynamic due to its ability to programmatically display contents based on users' activities. At this point, there is no need to go into JavaScript details yet, make it a step at a time. 

## Platforms to start learning web development as a beginner

There are several platforms online where you can easily learn the basics of any of these tools. Based on experience, I mostly recommend [Solo Learn](https://sololearn.com) and [W3 Schools](https://w3schools.com). They both have mobile apps where you can richly learn the fundamentals of HTML, CSS, JavaScript, etc. The community and their comments are invaluable as well. 

## The Major Dos and Don'ts While Learning Web Development 

- **Be Focused and Consistent**: Of course, this should be common to every facet of life; it is however vital in web development and programming as a whole. If you're not frequent with it, your progress will be sluggish which will greatly affect your drive and motivation. Ensure you write at least a line of code daily or learn something new daily. Ultimately, all the knowledge will accumulate to mean a lot to you.

- **Get a Trusted Mentor**: Find yourself some professional(s) in the field, either physically or virtually, whose steps you carefully follow. Seek opinions and ideas on why they made their decisions, so you can wisely tailor your decisions too and guide your paths without wasting much time. The journey becomes easier when you're rightly guided. 

- **Be Intentional About Your Decisions**: In today's ocean of information and resources, it's easier to drown in vain due to information overload. There are loads of choices to make while choosing stack of tools to use. To some developers, Python is the way to heaven, while some others "can kill" for JavaScript. Instead of jumping on any, it's part of the learning skills to research on the major options available to make an informed decision. There are numerous tools (technologies) out there for different purposes and **different people**. What I'm saying is that, DON'T LEARN "A" JUST BECAUSE MANY PEOPLE ARE LEARNING "A". Critically ask yourself if you need what you are learning or want to learn. It will occur to you if you need it or not. 

- **Don't Fall for Cheap Frustration**: Sorry I'm telling you this late. The undiluted truth is that you will be frustrated several times. You will read stuff and not understand it immediately. You will understand some this minute and forget the next minute. It is not your fault, it is nobody's fault. It's simply the nature of the field. Never see quitting as an escape route when those moments of frustration and annoyance come. Be calm, consistent, and adamant. 

- **Avoid Rushing**: I can bet there is a space for you ANY TIME you get there. At the same time, there are a lot of tempting reasons for you to rush yourself. Resist the urge to be intimidated to the point of being rushed. I can assure you that the field is relevant enough to lucratively satisfy all developers. So, don't sprint your way up, because that's the easiest way to miss out on the important basics, and remember that house built on weak foundation... besides, Whatever you miss will most likely hunt you down forever in your career until you go back to fix it. So, it's better you take your time to consume as much as possible before accelerating unnecessarily. 

- **Be Inquisitive and be Ready to Consume Info**: It's obvious that the tech field is vast like the universe. You have so many things to know/learn (don't worry, it's not that deep). The fact is that, you have to be inquisitive on how what works and why (there should be some limit though, so that you won't waste much time on the abstracted tools.) A 30-second-read tutorial article can lead you to three days of vigorous research, don't fret or be scared, it's usually interesting. Like I said earlier, make it a step at a time and understand the truth that it will take you close to one year before you start seeing things clearer (your manner and level of understanding applies here). 

The list goes on... others may be surfacing in some of my subsequent posts. I wish you a successful journey.

 
---

_**If you're inspired or you learned anything, kindly hit the clap button and share the article with your friends. If you have anything to add, use the comment box below. If there is any suggestion concerning the blog, use the Feedback button at the top. If you want to hire me for Web Dev or writing gig, use any of the platforms at the end of the page.**_


Tech Articles

How to Access Developer Tools (Dev Tools) on Mobile Phone Chrome Browser

How to Change The Date Input Default Placeholder To a Value in React

Values Types, Variables, Identifiers, Pointers, and Memory Addresses in JavaScript

The Android Apps You Must Have

Why You May Want to Start Blogging

Starting Web Development - The Fundamentals