Web Development Beginners' Guide

 Web Development Beginners' Guide

Oftentimes, noobie developers become over depressed on which path to go. If you found your self among these type of people, just follow along.

In this article, I will share with you the best Roadmap for beginners or noobie developers, and definitely you will learn to code like a pro.

1. Hypertext Markup Language (HTML)

HTML is the building block of every website or web application, easier to learn with very simple syntax.

Absolute beginners need to learn

1. HTML Tags, Attributes and Elements
2. Headings, Subheadings and Paragraph for titles and contents of pages
3. Styling text with tags such as the italics, underline, strong and bold tags.
4. Grouping and isolating elements with division and span tags
5. Presenting items in ordered and unordered Lists
6. Displaying contents in Tables
7. Linking to other pages or part with anchor tags
8. Assigning id's and classes to elements
9. Insertings images in webpage
10. More importantly working with forms

And this should take atleast 10 - 14 days for an absolute beginner to be able to master HTML.

click here to view more articles on web development

2. Cascading Style Sheet (CSS)

CSS plays a vital role in presenting the content of your site, it gives it nice lookings, colors, fonts and many more. Infact, CSS is much more easier than HTML because it syntax are a lot more simpler and familiar in our day to day computer activities.

A CSS beginner should be able master basic stylings such as

1. Selecting elements by tag name, id's or classes.
2. Font stylings - changing color, size, style and text background, background colors.
3. Link different ways to implement CSS such as internal, inline and external CSS
4. Defining custom height and width to elements
5. Box model - adding or removing margin, padding and border to elements
6. Styling lists, links, images and tables
7. Learn the basics of layout - positioning and object relative, absolute, fixed or sticky in the document flow
8. Max width, Max height and overflows
9. Pseudo classes or attribute selectors
10. Learn the basics of displaying elements, and switching the display from block to inline, inline-block or vice versa.

More on Cascading Style Sheet (CSS):

• CSS Flexbox for Beginners
• CSS Selectors, Property and Values - Web Development Turtorial for Beginners

At this point, you need to build a mini project after getting with what I listed above. Build either a portfolio, shopping carts or an image gallery.

3. JavaScript (JS) Basics

Welcome to JavaScript, this where you start real world development by making your site from static to interactive, changing the behaviour of the page, as well as changing the position, size, color or background when an element is hovered or clicked.

Infact, I really really love JavaScript as it is my best programming language.

As a JavaScript beginner you need to start from 

1. Knowing how JavaScript runs and where to run it, as it is different from HTML & CSS because it is a Programming Language standalone
2. Learning JavaScript syntax and code format
3. Write your first JavaScript code and link it to your HTML file
4. Declaring variables, naming conventions of variables and comments
5. Strings - methods and properties
6. Simple arithmetics with JavaScript
7. Learn Data types, assignment, comparison, logical and conditional operators
8. Arrays and Object and their properties and methods
9. Loops and Conditions
10. Functions
11. And last, Document Object Model (DOM).

Check more posts on JavaScript

• Node.JS: Introduction to Back-end with JavaScript
• The Ultimate JavaScript Guide for Beginners

With these skills, you can build more user interactive pages and assign functionalities to many objects within the content of the page.

In my next article, I will share the next step for you to move on, wish you a successful journey and thanks for reading.