Table of Contents
This can be very daunting for people starting out in web industry. You just decided to become web designer or developer and another question to consider is already here. Will you chose front-end or back-end? More about back-end will be in future article. Some of you may not even know these terms so let’s take a look at the first one.
When it goes to web development, front-end covers everything that user (visitor of pages) can see and can interact with. Front-end includes both, sense for design and aesthetics and programming skills as well.
As a future front-end developer, you have to learn some languages – HTML for creating the structure of any web page, CSS for customizing the design (visual side) of that page, and JavaScript for adding some dynamics.
HTML & CSS
HTML and CSS languages are very fast to learn so you can create your first pages de facto immediately. There are some technologies which can be harder to grasp like canvas, geolocation and APIs. All of these work in cooperation with JavaScript. Don’t worry about these technologies for now. You will have plenty time to learn them along the way start with history, principles and simplest tags of HTML. Personally, I think that learning CSS can be one-day adventure. Everything you need to learn are available properties, selectors and values with short list of principles. That’s really all! Not so bad huh? Well, slow down a bit cowboy… We didn’t look at JavaScript yet.
Basic structure of HTML5:
<!--doctype html>
<html lang="en">
<head></head>
<body></body>
</html>
Example of CSS (don’t worry for now what these properties and values does):
body {
background: #eee;
color: #a00;
}
JavaScript
JavaScript, or JS for short, is a dynamic scripting language created in 1995 by Brendan Eich (Mozzila Foundation). The only thing it shares with Java are naming convention (and C-like syntax). The name was chosen more for marketing purposes. Smart move right? For novice, JS can be little bit scary. Of you have some knowledge of HTML and CSS, you might be surprised how much JS differs from both of them. They are just different types of languages (HTML is markup language and CSS is style sheet language). In case of JavaScript, you’ve got lucky. You can actually pick some library of JS in order to making it easier for you to learn and use all of its fancy powers. These libraries or frameworks contain compiled code of JavaScript. Their main goal is to make learning and further development easier for you. Some libraries include jQuery, YUI, Dojo, Prototype and many others. Right now, the most popular of these frameworks is jQuery. In comparison with plain JavaScript code, writing code in jQuery is piece of cake. This makes it very good library for beginners to start with.
Example of JavaScript (again don’t worry, we will take a look at JS in future season):
var a = 1; // number var b = "Hello world"; // string var c = true; // Boolean
Design & Aesthetics
Programming languages are building block of front-end, but we still need to arrange them in some way and to make them visually appealing. For this, front-end developers must have the fundamentals of design and aesthetics including color theory, psychology, layout, graphics, typography, grid theory. As you can see, this topic is very broad and will probably take most of the time to master. However, if you want to create great looking pages, you have to learn it – everything. Those skills are necessary for you. Start with something familiar to you and go piece by piece. Don’t overwhelm yourself.
If you don’t see yourself interested in design, you can also work with some skilled Web Designer as a partner. It’s your choice, but it will be only limiting your options.
This was a short introduction into the amazing world of Front-end development. Next time, we will take a look at Back-end. Stay tuned.
If you liked this article, please subscribe so you don't miss any future post.
If you'd like to support me and this blog, you can become a patron, or you can buy me a coffee 🙂
Become a Patron
