Are you ready to become a professional web developer or programmer?
There are a few things you’ll want to learn when starting out with programming and launching your career in tech. One of those is learning your first programming language.
Choosing a first programming language is only important in order to get you encouraged and wanting to keep learning. What is not true about your first programming language is that it defines your programming career forever. Not at all.
For web development, you’ll want to learn a JavaScript Course, which happens to be a great language to start programming. But even if you eventually want to do something else than web development, learning the fundamentals of code with JavaScript is very rewarding as it’s easy to setup and really fun.
Excited already? Why don’t we start right now?
Set up your JavaScript development environment
The best way to start learning something, especially when it comes to learning programming, is just doing it. So, why don’t we just do some JavaScript? The great news is that it’s surprisingly easy to do, because JavaScript runs on every web browser, so you don’t have to install anything for now.
If you are using Opera, Safari or Brave; you might want to consider installing Mozilla Firefox or Google Chrome. JavaScript will run on any browser, but most learning resources will use the two mentioned browsers. If you are already using Firefox or Chrome, just make sure to have them up-to-date.
Let’s write our first line of JavaScript right now to test that everything is working out correctly. Open a fresh Firefox or Chrome window. If using Firefox press ctrl (cmd on Mac) + shift + k, and if you are using chrome press ctrl (cmd on MAC) + shift + j. A new panel should have appeared on your browser.
Write this down yourself and hit enter:
console.log(“Hello, World!”);
You should see something similar to this:
console.log(“Hello, World!”);
Hello, World!
Undefined
For now, we can ignore that Undefined, just know that there’s nothing wrong with it. Congratulations! You’ve greeted the world from JavaScript!
Now, many of you might wonder, now what? Well, that’s a great question. Certainly, we made the browser console say something with JavaScript, but, that’s it? Of course not, this is just the beginning of an exciting learning path.
Write your first JavaScript program
The next thing we’ll want to do is to properly write code. The browser console is great for testing, but it’s simply not practical for larger projects.
What you’d need to do now is to download a text editor. This is a program that allows you to write code in an organized way, and it offers you syntax highlighting, as well as code completions functions, which are very useful.
You can download Visual Studio Code or Sublime Text 3, both cross-platform, the former free, and the latter has a license that never expires. If unsure, give Visual Studio Code, it’s modern, and has a great community.
On your new and good-looking text editor, go to file > open folder and open a folder to work on. For simplicity, we’ll create a folder on the Desktop called first-time-javascript and open it on the text editor.
Now, create a new file, and save it by pressing ctrl (or cmd) + s (save often!) and name it like you want, we’ll use first.js. The name doesn’t matter, just don’t use spaces, preferably, use dashes, and don’t forget the file extension .js, that’s how the browser and the text editor will know we are writing JS code.
Now, write the following code on first.js:
console.log(“Hello, World!”);
alert(“You’ll be very surprised”);
Write it down yourself, noting those semicolons. On JavaScript, they are not mandatory, and you’ll program will run just fine without them. However, some weird errors or bugs may occur by omitting them, and they are used on a great amount of programming languages, so making the habit of writing them will be positive.
Running your first JavaScript program
Alright, so, how do you run your first program? You might copy the code, and open the console on your browser to paste it there, and it will work! But that’s just not practical.
We are dealing with the web, and HTML is a fundamental language of the web. If you don’t know any HTML yet, don’t worry, it’s not hard to learn, and it will be hugely useful in your web development learning path.
For now, create a new file on your text editor as we did before, but this time call it index.html. It doesn’t have to be called index, but it’s a convention, and it’s good to adhere to coding conventions. Also, notice the file extension .html. Save this file along with first.js, in the same folder.
Write this down on index.html, it doesn’t matter if you don’t understand it yet:
<!DOCTYPE html>
<html lang=”en”>
<head>
<title>Document</title>
</head>
<body>
</body>
</html>
Change that document between the title tags for whatever you want it to say, really, it can be anything. Now, let’s indicate that there’s a JavaScript file we want to run:
<!DOCTYPE html>
<html lang=”en”>
<head>
<title>Meow</title>
</head>
<body>
<script src=”first.js”></script>
</body>
</html>
Finally, get the path of your index.html file, either by manually looking for it, or by going to your text editor, right clicking on the file, and choosing Copy Path.
Now paste that past as if it was a URL on your browser, and enjoy.
Congratulations, now you are able to write JavaScript code. There are many things to learn, but luckily, there’s awesome learning material online to learn JavaScript, as well as coding bootcamps with immersive web development with JavaScript programs.
Remember to make sure you understand the fundamentals, and happy coding!