Introduction to Coding For Building Websites

Welcome to Intro to Coding. This is a free course that will teach you how to code and build your very own website without having to download anything. Many people look at code and give up within the first 10 seconds because they think that it is too complex. However, code is not as hard as it looks. While learning how to build a website completely from scratch might take a bit of time, it is certainly possible. It is something that is easy to learn but takes a while to master. This is a course that will be spread out over a number of posts. By the end of the course you will know how to code a complex website.

What you will learn:

  • Hypertext Markup Language (HTML)
  • Cascading Style Sheets (CSS)
  • Javascript
  • Personal homepage/Hypertext Reprocessor (PHP)

We will be using notepad (windows) or textedit (mac) to create your website for the duration of this course. This will give you experience on creating a website, so when you want to create your own website without our help you will be able to with ease. First, we must know what each language does.

Let’s say we wanted to build a website. First, we will start with coding HTML. It gives a website the basic format. For example, if we are going to write a text, we can give it different fonts and size. To do that, we would use html tags. However, if we code a website only using HTML, it wouldn’t look good at all. For this purpose, we will use CSS coding. CSS makes your website look pretty, giving you more personality for your website. If we wanted to change the background color to blue, for example, we would use a CSS tag like

body {
    background-color: lightblue;
}

Don’t worry if you have no idea what the code above means. Just familiarize yourself with what code even looks like. After this course, you will know exactly what they mean. Now, what if we wanted to add function into our website? Well, that is exactly what Javascript does. If we wanted to create a button, for example, it woudn’t work if we didn’t use javascript. I made a javascript code for you to see what Javascript does. This is the code:

<!DOCTYPE html>
<html>
<body>

<button type="button" onclick="alert('Thanks for reading this article by BlokkyWeb!')">Click this button here</button>
 
</body>
</html>

The code above makes a button. When you click on it, a message will appear. Try it!



Now that we know what makes a website have its functions, what if we want to take it a step further? Let’s use Youtube as an example. In Youtube, everyone’s homepage is different based on their subscribers. This is part of what PHP does. It can make a page dynamic, meaning that it changes based on the time or user. This is an example of a PHP code.

<?php
echo $_SERVER["REMOTE_ADDR"];
?>

The code above displays your IP address. This is what it looks like in action:

Your IP Address is:
104.172.60.95

Note that PHP does a lot more than just make a page dynamic. There’s more to it like collecting cookies, but we won’t cover that here. It will be covered in the PHP section. For now, just make sure you know what each language does.

The following two tabs change content below.
Profile photo of Christopher
Christopher Chang is the founder of BlokkyWeb and content writer and main designer for BlokkyWeb.
Profile photo of Christopher

Latest posts by Christopher (see all)

Profile photo of Christopher

Christopher

Christopher Chang is the founder of BlokkyWeb and content writer and main designer for BlokkyWeb.

Leave a Reply

Support us!

If you like this site and want to support Christopher Chang please like our facebook site!