(#4)(coding tutorial) Let's dive deep into a real programming language (Javascript)

Hi,
if you followed previous articles, you might start to think like programmer, but still you might not get it - and that's okay. Hopefully, this article might let you start to comprehend how all this coding works.

Intro

I choose JavaScript language only because almost everybody has PC with a browser. As you may or may not know, browser is using a lot of JavaScript. You might even right now use some JavaScript code as a user. This blog contains a lot of JavaScript code running under this beautiful looking page. You can use JavaScript a front-end(what browser user sees and code runs on user computer) language, you can use also in back-end (what is not visible for a user or code runs on server)
So far, we should know how to make a recipe, change recipe to something like pseudo code, we get a hint that in programming we use some mathematical operations on numbers and text.
To push it further, we will talk more on values which we can use in our programs and how to write it like a true programmer.

IDE (Integrated Development Environment)

When we want to start programming, we often don't know where to start our journey. Of you have a lot of tutorials, but sometimes you just feel like a child in the fog. And that's okay. But no more.
Before we start do anything around code, we have to write it somewhere and later, we have to run it.

Visual Studio Code

First, We need a place to write our code. Whatever you want to write, you need to write it somewhere and not worry to much about it.
Visual Studio Code is one of the most popular text editor with some IDE functionalities. It will be useful in more advanced actions which we might get to a later articles (If I and You are brave enough :D) You can find it online or go to website directly.
One you download it and run instalator, you basically accept or not agreement, you choose where installation should put this software, click next and create shortcut on desktop to not search it unnecessary.

image.png

and click install. if you finished, you should see something like this:

image.png

Congratulations, you installed text editor. We've made our first step towards becoming a programmer!

Chrome browser to run code

Now, let's run a browser. I will use chrome browser, so I recommend you to install it if you don't have it. It's also pretty easy to download and install so I won't show it.

So once you run a browser, you should see something like this:

image.png

Now, look at your keyboard and press F12 button on your keyboard or right click your mouse button in any place in browser area and click "inspect" in context menu.

image.png

So result should look like this:

image.png

Wow, we're getting there!
Now find a console tab and click it

image.png

let's type some mysterious code to check if everything works.
Type in console something like this:

alert("Hello browser, it worked!");

You should type it in that way:
image.png

and when you press enter, you should see something like this:

image.png

If it's the same as in the picture, then WOW, you are now a programmer.
if you want to know what alert is then go here and read details. To put it simply, you just told browser to show window with text "Hello browser, it worked!". Great, it was pretty easy, right?

Uff, there was a lot going. We prepared our environment to write whatever we want. Now, I'm sure that you are on the same page with me so in next article I will talk about basics in JavaScript step by step so stay tuned!

H2
H3
H4
3 columns
2 columns
1 column
Join the conversation now
Logo
Center