Websites are nothing but bunch of webpages together and can be hosted via servers. The most famous server, people are using since the starting of web development, is Apache2.

cPanel is used for accessing the Apache2 server usable and simplified. It is like a 'MyFiles' app for the storage, where storage is Apache2 server

So lets get back to the topic, websites. Websites consist of nothing but HTML, CSS and JavaScript. All the Frameworks you here, React, Angular, etc produces these only. So in order to understand React, we have to understand what HTML, CSS and JavaScript really are.

Lets start with HTML, it is a markup language and the building block of the website. It is like a skeleton to the body. HTML files have .html or .htm extension and they can be run in web browser. Famously you have heard of 'index.html'. Ever wondered why? It is used so commonly because when server runs a scripts it looks for this file only and Apache2 made it main stream.

To run html files locally just open it in web-browser. So the web browser will load it in the memory and run. If you make changes to it and even save the website that is currently loaded will not update unless you refresh the page. In order to constanly refreshing the page after every edit, developers have started using something called 'live-server', it is nothing but just an extension to vs-code, commonly used code-editor, which has code written that will update the website if any change is detected.

To write HTML files we use code-editor, we will be using vs-code as it comes with many in-built tools installed that will help in development as a whole. To avoid writing repetitive code and make our lives easier by not typing each and every predefined thing again and again, we use emmet, it is like write less and code more. For eg just by hitting '!' with a tab, it will expand to html tag, head tag with metadata and body tag and theres a lot. I will recommend checking the emmet documentation out

The webpage is divided into two parts - head and body. Head gets load first as web-browser reads file from top to bottom. Body is the part that we usually see in the webpage like some text, image, hyperlink, etc.

Some of the tags are h1, h2, p, img, a, br, and many more, like many more. If you study them for a life time you still would not know them all with the attributes. Okay so what are attributes? They are the properties for the tag which further extends the functionality of the HTML and the website.

h1 is the boldest heading, h2 is less bolder and p is least. All of these are block. All of these got attributes which can be referred in their documentation. We also use web to view images so for it we use img tag, it consists of very much attributes, like its a tag which is incomplete without it. So there is src, views, length, width, alt and many more referred in the documentation. src gives the path to the image(as I said without it img tag is almost useless), views is used along with srcset that are used to make the image compatible with different kind of screen sizes, length and width are used to set length and width in pixels and alt is used to describe what an image is, so that in a event when image file can not be loaded in the webpage, this written text can come as a placeholder and save the day. It is also useful for people using screen reader as they are programmed to read it and make the website more accessible fot the people with visual impairment. (It is in my opinion the second most important attribute of img tag). It is recommended to make a website 'accessibility friendly'.

The most important part of a website is hyperlink, linking one page to another, it can be achieved using 'a' tag (anchor tag) It has an attribute href where the link to other webpage goes.