Hello friends, let us talk about Web, WebServers,html in this blog.
What is web
The web/website consists of simple html pages which is rendered by the web server and gets diplayed to the end user on the Internet browser.
What is WebServer
WebServer is sitting behind the internet browser and renders the html pages to create a view.
What are types of webservers IIS, Apache, cpanel are some of the webservers.
What is html
Html is a Hypertext transfer protocol language. The browsers understands this language to display the content in the web page.
IE, Chrome , Mozilla are examples of web browsers.
About Code Editors
First lets discuss about how we can write/develop html pages.
The html pages can be developed thru notepad/notepad++ and open it in internet browser to see the web page.
But a typical coder needs a coding platform to generate bunch of htmls while creating any website. There are the code editors availble to create these htmls.
ex: VS code editor, Sublime, Atom, Fleet etc..,
Basics of html
html starts with doc type element. This element contains info about the version of html language. If nothing is mentioned the browser took it as the latest version of html i.e. html5 version.
Then there is a html tag with an attribute "lang" where we can mention whether its an english, spanish etc..,
There is head tag, usually the major portion of content in this head tag is not displayed to the end user, this tag contains the info on meta data, where the rest of the web page load depends on this meta data.
Then there comes the body, where the actual webpage data/controls are provided here.
Here we can use different types of tags for headers and paragraphs etc.,
Output of above html
Bonus Tip: When you are developing the html pages using VS Code editor the Emmet plugin is the best plugin for developers for the generation of html code snippets
For any website the default page is default.html or index.html, meaning when we call any website by default the index.html page will be loaded.
Live Servers
When developer is developing the html page in any code editor, when he wants to check the actual output how he developed the webpage so far the option is to install Live Servers in the code editors. Some of the Live servers are : Live Server by Ritwick Dey, Live Server Preview etc.,
Once the Live Server is installed, when we run the html code using the option Open with Live Server in VS code editor, the page loads at the Ip Address: 127.0.0.1 with the port 5500. This ipaddress is commonly known as LocalHost.
Once the page is opened in the web browser, any development activity happens on the editor directly reflects the changes in the web browser(thats why its called as Live Server).
How Live Server Works
Once the html content is properly loaded on the webpage in the browser, check the right click options and find the option View page source
The css below in the view page source triggers the Live Server to continously monitor the changes in the editor.
Thats it for now. Lets meet again in another interesting one with lots of data. See Ya Later.