Here's All About Frontend Develpoment
Published: 2023-03-19 09:02:34

## Essential Languages for web develpment:
HTML | CSS | JAVASCRIPT |REACT |PHP|PYTHON|JAVA And many more languages are use to for web develpoment.

Startup for Frontendent Development:
if you want to start your carrer in frontend development than you need to start from these languages :

HTML: HTML stands for hypertext markup languages. It is use to structure web pages.it made the skeleton of a website.
CSS: css stands for Cascading style sheet. It is used to make the web page beautiful.
JavaScript: JavaScript is used to perform different Functionality.
Frontend framework and libraries:
A framework forces our Application into a structure .All applications build with a framework.Libraries does not force our Application into a structure .All applications build with a framework.

React | Angular |vue

React is a very famous library. Most developers use these libraries and frameworks.

Version Control System:
It tracks our project history work collaboratively with others.Git is the most popular version Control system in the world.70% of the software developers use this version control system.

CSS Preprocessors:
A program or tool that generates css code from different languages is better and more capable than css. Some of the Preprocessors are as follows.

SAAS | LESS |Styles

Road Map for a Frontended Developments:
Step :1: learn HTML CSS AND javascripts it tools for three months.

Step :2: learn to react it took 2 months.

Step 3: learn git it took 1 month.

Step 4: learn SASS AND Typescript to get better job opportunities.

Works Fundamentals and workings:
A website stores on some servers so websites that we are seeing are dynamically generating code or a code which is already stored. And then it goes back to the browser because our browser is just an interpreter it gets back certain source code and displays a website on a scrreen.DNS(Domain name system server) DNS server transfers down the ip address then ip goes to the browser and browser requests to the server which has an ip address and then it can generate a source code for the website and it is sent back to the browser where the website is displayed.

1-What is HTML?
HTML stands for hypertext markup languages.
Not a programming language.
Markup languages for creating web pages and documents.
Building blocks of the web pages.
2-What do we need to start?
Google chrome
Mozilla firefox
Safari
edge
web Browser
Editor text.
Sublime text | Visual studio code | Brackets | Notepad for window | Textmate for mac

3-Creating an Html file:
Does not need a server
File must be end with .html extension
Runs on a web browser
Index.html is the root or a home page of a website
4-HTML pages Structures:


5- Inline vs Block level elements:
Inline Elements:
Don’t start on a new line
Take only necessary width.
Inline level: <span> , <img>, <a>
Block Elements:
Start on a new line
Take full width available
<div> ,<h1>,<h2>,<form>,<p>
6- Html tags
<Html> </html>
<head> </head>
<title> </title>
<Body> <Body>
<h> </h>
<p> </p>
<strong> </strong>
<em> <em>
< a href=” https://www.google.com>google</a>
7- Tags Attributes:
All tags can have attributes
Provide information about elements
Placed within the start tags.
HTML5 Semantic tags:
1- <div></div>

2- <article></article>

3- <main>For the main content of web page unique to that page

4- <section> Define the certain session of web page like blogs post ,contact info

5-<article> Define a bit of content which make some article like blog post

6-<aside> Define some content related to something like similar blogs

7-<header> For the header of the websites like navbar titles etc

8-<footer> For the footer of the websites.

VIDEO TAGS:
<video width=”700" controls autoplay > <source src=”video.mp4"></video>

In video tags height is already defined and we have to define width.By using control attribute video play buttons and other different functionalities were shown.By using autoplay attributes our videos will play automatically.

Audio tags:
<audio controls autoplay> <source src=”Music.mpeg”> </audio>

In the audio tag we don’t have to define height and width.By using control attribute audio play buttons and other different functionalities were shown.By using autoplay attributes our audio will play automatically.

Link video tags:
<iframe width=”900" height=”500" src=”https://www.youtube.com/embed/f1zXPFbiAlI?"></iframe>

In this type of videos we have to define both height and width.After link insertion we have to (embed/) in the link where (watch?=v).And for autoplay at the end of the link we insert (?autoplay=1).