Learn to Code via Tutorials on Repl.it!

← Back to all posts
Making a Farley Basic HTML CSS JS Web page, that will take a VERY long time to make

Coding an HTML CSS JS Website (How to Code) Part One: Teaching the Basics of HTML

I’m going to start by saying this is going to be HTML, so I hope you know the basics of that. Also, it’s going to get very boring, with me just repeating the same thing over and over again, so you can just copy and paste everything in if you’re following along, otherwise, you might just want to skip reading the code. I hope you have a fun time!

So, we’re going to start with the basics of HTML. This is going to teach the user h1 - 6, p, id, comments, and class: This will teach the user how to do h1. But first we need to know some entity names. < is &lt, > is &gt, and is &quot. Those are the basic names you need to know besides &, which is &amp (for ampersand). So let’s write out the first line of code.

We need to start by typing the body, head, html, and doctype of are repl. So let’s get started:

That’s really it. So you can type or copy and past (ctrl + c to copy ctrl + v to paste) that code into your repl (or whatever code editor you’re using, I’m just supposing that you used repl, since you’re on repl.it right now). Next, in the head, we’re going to start on the first page. We’re going to type the title:

I also added some of the things we have already typed, just to show you where we’re typing it. Later, in chapters two - four maybe, we’ll add a table of contents. So, now we’re going to type the title for the paragraph about h1 - 6.

And now what we say about it. This <p> is going to have an id. This is what an id tag looks like:

The <p id=”text”> can be used for h1 also. We will use them when we get into using CSS to give our webpage style.

Right now, I’m going to take the time to tell you what HTML, CSS, and JS stand for right now:

HTML: HyperText Markup Language
CSS: Cascading Style Sheets
JS: JavaScript

I’m sorry if the highlighted letters look weird to you. Now let’s get on to coding the <p> with the id:

That was a lot! We had a bunch of entities, but basically that would explain how to use the <h1> tag. And that’s all it did. And it took like ten lines of code (or something). The others won’t take as long, and that’s why I’m saving this for a new post. I hope you check it out soon! I’ll attach the finished repl to this post. If you want to see the original post, just follow this link: https://docs.google.com/document/d/1p9ZqYYY9MdpwnJmCLFfiwvmMJc9bnquJfVC5Y0hnXMk/edit, which is to a google doc which I originally. You will have to ask for permission, and I will let you in as soon as I can. Or you can give me your email address, and I can share it with you. I, sadly, won’t be able to give you editing permission, just because I don’t want anybody to delete everything on it. Goodbye! And have a good day.


do one on how to make a background


I just realized I forgot to put the repl in. Here is a link to it: