Basic knowledge for Frontend Developer.

Website is popular today and you may hear about these phases: Frontend(FE), Backend(BE) and Full Stack Developer. In the past, there weren’t FE or BE developer because websites were simple. Today websites are far more complex so we have FE developer who works with user interface(UI), BE developer who works with data processing. The last one is Full Stack developer who can work as both FE and BE developer. This post is mainly for person who want to become a FE developer.

Building blocks:
-HTML(HyperText Markup Language): This will define the structure and content of your webpage. it uses XML(Extensible Markup Language) Syntax. Look at the code below I can tell that there will be a title, paragraph and button.

Some element tag will have some default styles. Example h1 tag has font size, font weight and margin style.

<h1>My heading</h1>

CSS(Cascading Style Sheets): This will help you customize your element style. It is a set of properties. You will need to remember them. CSS can be added to your current webpage or importing somewhere else.

JS(Javascript): This will help you with page logic. Response to user action, loading data, handle error, …etc

Client’s browser will compile HTML/CSS/JS code that you write and display result. It does not require your code is 100% correct. It simply ignores parts of code that are incorrect.

You can create some webpages with only HTML/CSS/JS, but on larger scale you will need a FE framework. It can help you manage many pages, optimize loading speed, reduce error during development, …etc. Today popular FE frameworks are React, Angular, Vue. It is important to learn HTML/CSS/JS before using framework.