What Coding Language Should I Learn First?

When it comes to deciding what coding language(s) you should learn it may seem intimidating, especially if you’re very new.

Skip to answer ๐Ÿ‘‡

Coding โ‰  Programming

The first thing to note is the difference between types of coding languages.

There are three types of languages that you, as a beginner, should be aware of:

  1. Markup
  2. Styling
  3. Programming

What is a Markup Language?

This is the type of coding language that HTML is. It is meant to format and structure the content of a page.

You WILL need to learn HTML before you learn anything else, but don’t worry it’s easy! You can learn the concept of HTML in a day, and have it mastered in less than a week.

HTML is the markup language that the vast majority of the internet runs on. There are other markup languages besides HTML, in case you were curious about what else is out there:

Here’s what the most basic HTML file will look like. The Heading and Paragraph are not required, I just included them for the example.

<!DOCTYPE html>
<html>
  <head>
    <title>Page Title</title>
  </head>

  <body>
    <h1>This is a Heading</h1>
    <p>This is a paragraph.</p>
  </body>
</html>

What is a Stylesheet Language?

Stylesheet Languages express the presentation of structured documents (like HTML). If the HTML is the structure of the house, then CSS Is the paint and decorations.

While CSS is the primary stylesheet language that’s used across. the vast majority of websites and apps today.

There are a few obscure alternatives to CSS and there are also CSS compilers like SASS, LESS, and SCSS.

A CSS compiler is not an entirely new language, but an abstraction of CSS. So, what the heck does that mean?

It means that a compiler will allow you to write CSS in a more powerful format (very simplified explanation).

So it will take this (the part you write)

.section {
  background: grey;

  .left-half {
  width: 50%;
  float: left;

    .button {
      color: blue;
    }
  }
}

And compile it into what is called Vanilla CSS (CSS without any fancy extra stuff)

.section {
  background: grey;
}

.section .left-half {
  width: 50%;
  float: left;
}

.section .left-half .button {
  color: blue;
}

What is a Programming Language?

If HTML is the foundation and structure of a house, Stylesheets the paint/flooring/decor, then Programming is the wiring and plumbing. Programming languages are what make things work.

All programming languages are written as a set of instructions, as opposed to the Structure and Style.

Examples of common programming languages:

  • Javascript
  • Php
  • C++
  • Python
  • Java
<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Confirm Box</h2>


<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
  var txt;
  if (confirm("Press a button!")) {
    txt = "You pressed OK!";
  } else {
    txt = "You pressed Cancel!";
  }
  document.getElementById("demo").innerHTML = txt;
}
</script>

</body>
</html>

All programing languages will have some form of “If [this] then [that]” where [this] is a condition or set of conditions that must be met and [that] is the output resulting in those conditions being met.

In plain english, the above code translates to “If the user presses *this* button, then display the text ‘you pressed OK!’, or else display the text ‘you pressed Cancel!’.

What to Learn First

HTML โ†’ CSS โ†’ Javascript

In that order. The simple answer.

Why Should I learn this way?

HTML is used on 93% of all websites โ€“โ€“ย Source

CSS is used on 96% of all websites โ€“โ€“ย Source

JavaScript is used on 97% of all websites โ€“โ€“ย Source

If your goal is to get a job as a developer or do any sort of freelance developer work, you’ll quickly find that working knowledge of these three languages will open more doors and present more opportunity than any other “Developer Stack”. Javascript is especially powerful because you can use it to code both the Front End and Back End of a given software or website.

Leave a Reply

Your email address will not be published.