Everything that we see, feel or eat is made using some tools for it to materialize. Similarly Web Development requires some tools and along with it some languages, to be specific some programming languages through which websites could actually come into existence.
Today we’ll be talking about some of the basic tools and languages through which any newbie could develop a simple website and for simplicity we’ll be talking only about the front end of a website also known as the user interface today.
One of the most widely used programming language used for building the front end of a website is HTML (Hyper Text Markup Language). It is used for designing the things that we actually see in a page and also all the links that are present, through which users surf through different webpages upon clicking on them. HTML can provide just the basic design as it is mainly a hypertext language used actually for creating links between different pages and also provide some information content to the user. HTML files have a .html extension so that they can be differentiated from different files.
HTML makes use of elements; these elements are present in the language as tags. Each element in HTML has a starting <> and an ending </> tag. Every HTML document must have <!DOCTYPE html> which tells the system which type of document is it and also that it is a HTML5 document.
Also, each element has some attributes that provide some additional feature to the element. Example of some HTML tags are :
<html> </html> = All of the main webpage design code must be enclosed between these tags.
<head> </head> = It contains the title of the webpage, some scripts written for some additional processing of data and also links that lead to different styling sheets known as CSS. (We’ll be talking about CSS soon, keep reading)
<body> </body> = Here goes the actual webpage layout code.
These were some of the basic tags that are used in mostly every HTML document.
Next is CSS (Cascading Style Sheets). HTML provides a basic and also an old fashion way of designing webpages, CSS helps HTML by adding style to the HTML elements. CSS also is helpful as once a style code has been written for an element, the same code could be used for the same element in some other document which means that designers don’t need to write the same code over and over again. Once written, it will stay throughout eternity that is if the system doesn’t crash. J
CSS consist of rule set, each rule set has a selector and a declaration.
The selector points to the HTML element you want to style. The declaration block contains one or more declarations separated by semicolons. Each declaration includes a CSS property name and a value, separated by a colon. A CSS declaration always ends with a semicolon, and declaration blocks are surrounded by curly braces.
This was a very very basic overview of how to proceed with web development, well we’ve talked about programming languages, coding and all but how do we write code. We can’t write a programming code in a Word document right… Well the most basic tool that anyone can use is a Notepad that is available on every PC as it is available with every OS anyone installs.
Well, Notepad…hmmmm… It’s not actually a tool it’s just plain old paper that requires you to do every bit of the job. What if someone helps you while doing your job that would save a whole lot of your time and also would help you to learn faster. Some of the tools used for coding especially for webpages are, well look below…
Sublime Text : It is one of the most popular code editors around. It uses a Python application Programming Interface and is built using C++ and Python. Some of its notable features are Goto Anything and Split Screen Editing. It was first released in 2008 and has been recently updated on 2018 with the latest being Version 3.1.1.
Vim : Vim is an open source editor software that many L
These tools provide many additional features that help any developer write codes and also learn a language in detail while coding. These editors provide drop down list of functions as a developer writes lines of codes just after he/she enters a character. Also, these editors provide debugging tools and many more features such as live servers so that you can see the output of your code whenever you save it.
Well, that’s all for now… See you next time coding lovers.