Teach yourself HTML in 21 minutes | DevsDay.ru

IT-блоги Teach yourself HTML in 21 minutes

DZone Web Dev 6 декабря 2021 г. Thomas Hansen


Imagine you're 40 years, you know the basics of computers, maybe some of the basics of the file system, but you've never created software - Still you want to learn how to create software and become a professional programmer and software developer. Well, that is an actual use case I've been assigned to by a friend. Hence, obviously time is of the essence, while at the same time I can probably assume the guy is fairly self driven and can research all the gory details on his own if given some pointers. My friend's friend has a college degree, so I can also assume he's self driven, motivated and able to indulge in long self studies once given a few pointers in the right direction. He is also a fairly smart guy, but literally knows nothing about software development.

If the above is a fitting description for you too, you've come to the right place. I realised instead of teaching him one on one, I could create a series of YouTube videos, associate these with some DZone articles, add some good references, and scale up my efforts - Such that others could also learn from it.

The structure of the course will be as follows.

  1. Install Magic and learn HTML in 21 minutes
  2. Learn CSS in 21 minutes
  3. Learn JavaScript in 21 minutes
  4. Learn Angular in 21 minutes
  5. Learn Hyperlambda in 21 minutes

In this first article, we'll be going through HTML. Watch the video below where I am setting up Magic and walking you through how to get started with HTML.


To download Magic click the following link. To download Docker Desktop click the following link. The Hyperlambda code I am using to serve my HTML files can be found below.

Plain Text
 

.arguments
   file:string

strings.split:x:@.arguments/*/file
   .:.
switch:x:@strings.split/0/-
   case:html
      response.headers.set
         Content-Type:text/html
   case:css
      response.cookies.set
         Content-Type:text/css
   case:js
      response.cookies.set
         Content-Type:application/javascript

io.file.load:x:@.arguments/*/file
return:x:-

The HTML code I ended up with in my video can be found below. Please don't cheat here. Copy it manually character by character instead of copy and paste it directly into your own file. Why? Because manually writing the code yourself results in your tactile memory being triggered, implying the learning value for you in the end becomes twice as large as if you just copied and pasted it from the code snippet below into your own HTML file.

HTML
 
<html>
  <head>
    <title>First HTML tutorial</title>
  </head>
  <body>
    <h1 style="color: Yellow;">Hello there, this is our first HTML tutorials</h1>
    <p>This is a paragraph</p>
    <ul>
      <li>List item numbver 1</li>
      <li>List item numbver 2</li>
      <li>List item numbver 3</li>
      <li>List item numbver 4</li>
    </ul>
  </body>
</html>

To understand the HTML code watch the video further up on the page. 21 minutes of your time, and you now arguably know the most important parts of HTML. Further study references can be found below.

Try to play around with the HTML code we created above, by for instance using elements such as title attributes, adding a couple of DIV elements to it, maybe changing the bulleted list to an ordered list (hint; OL), etc, etc, etc. Then realise that every single time you're visiting a website, the pages you are looking at was created with HTML.

Why HTML ...?

If the guy wants to learn how to code, why teach him HTML? HTML isn't programming, or? Well, it gives us a highly visual feedback loop, with instant gratification, making things more fun. Secondly, my friend's friend doesn't only want to learn how to code, he is also looking to change his career path - Implying we'll have to carefully choose the most valuable skillsets we can give him, in the smallest time frame possible to squeeze in valuable knowledge. If you know HTML, CSS and JavaScript, you're arguably ready for a junior position as a frontend software developer, at least an internship. This is easily achieved for a highly motivated human with 6 months at his or her disposal.

Sometimes the shortest path between A and B is not a straight line. If you don't believe me, ask an airline pilot to show you how he crosses the Atlantic ocean on a map ... ;)

Why 21 minutes?

Because since I'm currently in the process of starting what some believes might end up becoming a billion dollar company myself, arguably based more or less entirely upon HTML and the Web, that's the amount of time I've got to spare myself, once or twice per month. However, just because I created the video in 21 minutes, doesn't imply you'll be mastering HTML by simply watching it. Mastering HTML will require at least 5 hours of hard work, every single day, for much more than 6 months, probably a decade to be honest with you. However, if you spend 5 hours every day for a week, you will be proficient enough to create a lot of interesting things with HTML - And as we start filling in with CSS and JavaScript, it will be clear to you just how valuable HTML is. Most importantly though is that learning needs to be fun, or you will simply stop after a while. HTML is fun, because it gives you an instant feedback loop. Hence, even though it's arguably not a "straight line", it's probably the shortest line, just like our airline pilot example above illustrates ...

Источник: DZone Web Dev

Наш сайт является информационным посредником. Сообщить о нарушении авторских прав.

html