computer-scienceangular-roadmapbackend-roadmapblockchain-roadmapdba-roadmapdeveloper-roadmapdevops-roadmapfrontend-roadmapgo-roadmaphactoberfestjava-roadmapjavascript-roadmapnodejs-roadmappython-roadmapqa-roadmapreact-roadmaproadmapstudy-planvue-roadmapweb3-roadmap
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
16 lines
2.1 KiB
16 lines
2.1 KiB
5 years ago
|
## What is a Frontend Developer?
|
||
|
5 years ago
|
A frontend developer is someone who works on the side of the websites that the user interacts with i.e. front or the client side of the website. Whenever you visit a website, everything that you see is mainly developed by the frontend developers.
|
||
|
|
|
||
|
|
They work with designers or UX teams to convert their mockups or wireframes to the actual website that the users can interact with. Also they work with [backend developers](/backend) who work with database and servers to get the data from and to display on the website. Wikipedia describes frontend development as follows
|
||
|
|
|
||
|
|
> [According to Wikipedia](https://en.wikipedia.org/wiki/Front-end_web_development):
|
||
|
|
>
|
||
|
|
> Front-end web development is the practice of converting data to a graphical interface, through the use of HTML, CSS, and JavaScript, so that users can view and interact with that data.
|
||
|
|
|
||
|
5 years ago
|
## Key Components of a Website
|
||
|
5 years ago
|
If we talk about the frontend, all the websites are mainly built with three key technologies – **HTML**, **CSS** and **JavaScript**. If you know just these three, you can start building websites and be employable.
|
||
|
|
|
||
|
|
Before we proceed, let me give you a brief overview of how **HTML**, **CSS** and **JavaScript** are used on the website. **HTML** provides the structure to a website i.e. all the text, headings, paragraphs, images etc that you see on the website, they have been created with HTML. HTML provides you just the structure, you need to put another layer on top of it to make the website pretty - this next layer is CSS. **CSS** helps make your websites pretty - the colors, backgrounds, font size, borders, shadows etc are controlled using CSS. And finally, the third layer is **JavaScript** which helps make the website interactive e.g. controlling the actions like showing a popup, switching slider images upon click etc is all controlled by JavaScript.
|
||
|
|
|
||
|
|
To understand it better, let me provide the analogy of a human body, the skeleton provides structure to our bodies so it can be equivalent to the HTML, the skin which hides the structure of our bodies and beautifies is like CSS and the muscles which help us perform different actions can be JavaScript.
|