Hey ya'll! Welcome to the first blog post of October, We made it it through a month! I'm glad that my passion for this blog remains true and I hope to continue forward.
So today, we will be doing something different, instead of y'know, news and stuff, today we'll be seeing how much I've learned web development in my couple of weeks of learning it. I'm excited to see what I've learned and I'm excited to give you an insight of what I've learned, without further ado, Enjoy.
Welcome to my blog post, today we'll be talking about web development, as you may know, web development is what is used to make a website, which means that every single website you see on the internet was made through this process. Which is crazy to think about.
And to be fair, web development (atleast in the early stages) isn't that difficult, it's pretty easy to "get a website going" but it may look ugly, but today we are going focus on the getting a website part, rather than making it look better, so let's get started!
But before we start, there is one thing you need to know, if you just want a website and you're not interested in web development, then there is no point in following this tutorial, you should use website builder sites such as Wix to build your website, they will make the website for you, and all you have to do is customise it. So go do that if you just want a website.
Now onto the tutorial.
So the first thing that you're going to want to do is actually have a place to put all your code in, and for that you're gonna need Visual Studio Code, or can use other code editors such as Sublime Text but I would recommend VSC because it is much more popular than the other code editors and in my opinion is much easier to use.
Alright now that you have downloaded your code editor, the next thing you're going to want to do is to open it, I'm using VSC because that is what I use for web developing, so the opening page should look something like this:
Once you're here, what you're going to do is click on the "Open Folder" option. This will open your file manager, there you need to make a new folder, the folder can be anywhere you want and be called whatever you want, but you should be able to remember it as that is where your website will be located in your computer.
Once you have made your folder, click the folder and tap "Select Folder", after you do so, you might be faced with a prompt that says "Do you trust the authors of the files in this folder", now since you made a new folder, there are no files inside of it, so just click Yes.
After that what you'll want to do is click on the drop-down menu on the left-hand corner of the screen which will be what you named your folder, which in this case is "Test"
Once you have done that, right-click on your mouse and another drop-down menu will appear, in there click "New File" after you do so, a text-bar will appear, there, type index.html.
Once you do, a screen like this should appear:
Alright! now we can actually start making the website. But first, there is something we need to do, on the left-hand corner of your screen, there are four buttons, and there is a button called "Extensions", click on it.
Then type "Live Server" and install the first option that comes up, and restart your application for it to take effect. I'll show you why we need that in just a minute.
Now go back to your index.html file and get started on making a website, so to start off the first thing you need to do is type an exclamation mark and then hit tab on your keyboard. This should bring up the following code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>Now what you'll wanna do this type something between the two "body" tags, Like for example "Hello World".
Once you've done that, right-click on the <!DOCTYPE html>, this should bring up an option called "Open with Live Server" (remember that Live Server we installed earlier? this is where it comes into play).
If you did everything right, it should open up your web browser and there you will see "Hello World"
And with that, congratulations! you have managed to make a website, I'll go over what you can do with this in the next blog on this series, so stay tuned and see you next time!
Comments