Understanding Frontend Development

Frontend development is the part of software development that focuses on the user interface (UI). In web development, frontend development is the practice of producing HTML, CSS, and JavaScript for a website or web application.

HTML

HTML stands for HyperText Markup Language. HTML displays content on the page, such as text, buttons, links, headings, or lists.

CSS

CSS stands for Cascade Style Sheets. CSS is used to style the web page. It deals with things such as colors, layouts, and animation. It also helps with the accessibility of our websites so that everyone can easily use our website.

JavaScript

Finally, JavaScript is a client-side language that facilitates user interaction and makes dynamic pages. It can help with complex animations, form validation, data fetching from a server, and data submission to the server.

However, as with languages such as Python, building a frontend application from scratch with HTML, CSS, and JavaScript is definitely possible, but it’s quite difficult. It requires thorough knowledge of code architecture and component reusability. In the end, we’ll end up creating our own development framework.

But why not use some prebuilt CSS or JavaScript framework instead?

Tools such as Vue, Angular, or React can help us write frontend applications in an easy and smoother way.

In this course, we’ll be using React’s open-source JavaScript library. Let’s learn more about React as a library.

What is React?

React is a library that helps developers build reactive UIs as a tree of small reusable pieces called components.

In frontend development, a component is a mixture of HTML, CSS, and JavaScript that captures the logic required to render a small section or a larger UI. Let’s analyze the following HTML form to better understand components in frontend development: