Imagine a house. To have it running steadily, there should be a good foundation, building blocks, proper infrastructure, good furniture, designs, and usability functions. In web development, the front-end developer is somewhere in between the processes as he takes the ideas from the UI\UX team to turn them into clickable websites that work. Back-end developers, PMs, and QAs take care of the other vital parts, such as proper foundation, team and project management, and testing.
So there's actually a front-end and back-end. We won't say which one is easier. Let's just leave one picture here for your understanding.
To light up a room, you have to click the button. Ensuring it is clickable is a job for a front-end developer; ensuring there is a light is a task for a back-end developer. Front-end web development is the art of using HTML, CSS, JavaScript, and a set of other tools for a website/app for a user to see and interact with them.
Basic front-end development glossary
In front-end web development, there are vital terms you should know. We bet you've heard most of them, so let's just keep them handy in the list below.
Programming languages or codes
For example, HTML
In development, you need to speak a language everyone understands — your machine, your code compiler, your user, and your project manager. Below are just a couple of languages we use in the front-end. They look different to everyone, but mean the same and help achieve the result — have the webpage ready and running.
HTML, or HyperText Markup Language, is the code developers use to structure a webpage. Remember seeing a webpage made up of blocks, paragraphs, or tables? HTML helps with that. It originates from a code developed by WHATWG some 30 years ago, in 1993.
JavaScript, conveniently referred to as JS, is a programming language considered one of the cores for front-end development. Designed over 26 years ago, it is now used in almost every webpage you see. Even on the Beetroot Academy website, too :) JS is used to create animation, control multimedia, and generally work with dynamically updating content, buttons, banners, etc.
Here, you can also look at some Javascript libraries — jQuery, React.js, and more here on Kinsta, for example.
Front-end development tools
Git, Google Fonts, W3C, and more
Compilers, linkers, code editors are essential for every front-end developer. These are basic tools that you will use in your daily routine — as home technicians use multitools for repairing the leakage, for example.
To name a few, there are Google Fonts to help you work with fonts, W3C Markup Validation Service to validate your code, and many more.
Version control tools are also part of the list here, used for monitoring changes to your code. We guess you strive to make your code better and better each time. Hence, version controls will help manage the evolution of your code as it becomes clearer and more effective. Git is the most popular, and it's open and free of charge.
Design principles in front-end
In front-end development, we use responsive design to ensure our content fits every (or almost every) gadget and looks good on it. Recall how you open a webpage on your iPhone, reopen it on your laptop, and send it to granny's email — and it still looks good on your grandparents' old-fashioned computer? That's responsive design in action.
Design automatically adapts to given dimensions, so all users feel comfortable interacting with the content. The feeling is the key here — because the front-end is mostly about what the user feels while using your web piece.
CSS, closely connected to HTML, is a code used actually to style an HTML doc. It has everything to do with the colors, styles, and other properties.
Looks quite interesting, huh? Now that you're familiar with the basic front-end development glossary, it's high time to learn the front-end. We hope you find this glossary helpful, no matter which tech direction you will choose. Keep it in your saved links to come back once in a while.
Join our next group in May and start learning with tech industry experts to gain knowledge you need to work as a junior front-end developer.
