Skills You Need to Learn For Your First Frontend Developer Job

These are the basic skills I think fresh graduates & career shifters need to learn before diving into his/her frontend developer job.

1. HTML/CSS

HTML is the very building block of a Website. HTML stands for Hyper Text Markup Language. It describes the structure of web pages using markup.

I actually think to learn the basic elements of HTML, you will learn the rest of it along the way.

CSS stands for Cascading Style Sheets, it used to present the document you create with HTML, and used to create the page’s layout, font-size, colors basically STYLE of the element.

I recommend to learn the foundation of CSS, from the displays, pseudos, position and techniques. In this day, css frameworks used Flex, like Bootstrap 4. It’s worth noting for.

Before you move on to #2 Javascript and Jquery, it’s better to create a website or copy a website, from checking your favorite website page source with html and css, so you can actually learn.

2. Javascript and Jquery

Javascript is one of the 3 MAJOR tool, developer need to learn. It programs the behavior of web pages. It also make your html to have a interactive features like animations, scrolling abilities, games, etc..

One cool thing to keep in mind about JS is the existence of libraries like jQuery. It’s lightweight, “write less, do more”, Javascript library. It makes the javascript use easier and simplifies a lot of the complicated things from Javascript, like AJAX calls and DOM manipulations. One of my favorite thing about Jquery is HTML manipulation and Event methods.

3. Responsive Web Design

Responsive Web Design makes your web page look good on all devices (desktops, tablets, and phones). This is one of the Frontend Developer duties and also requirements in all of frontend job.

With responsive you will be designing with all layouts in mind and this of course can confuse the process and make it quite complex. This means that you should focus on creating a viewport for mid-resolution and you can then use media queries to adjust for low and high resolutions later on.

4. CSS and JS Frameworks

CSS and JavaScript frameworks are libraries of CSS or JS that do a lot of the work for you by providing class or functions that have a common functionality.

It’s important to choose the best framework that will work to the type of your website that you’re working on. To make things even better you can use frameworks together. It’s common to pair Bootstrap with another JavaScript framework like ReactJS.

5. Version Control/Git

This is really optional, but most of the companies, from startup to corporate they used version control or git. What is “version control”, and why should you care? Version control is a system that records changes to a file or set of files over time so that you can recall specific versions later.

This is extremely useful if you have a team working in the same project.

6. Testing / Debugging

Having the ability to code or create a project, you also need to know how to debug and test your code. Developing process involves having a LOT of bugs and unnecessary codes.
You’ll need to test your code for bugs along the development, so the ability to test and debug makes the list of essentials and must have skills for Frontend developers.

Testing is a big part of the development process, Unit Testing. It tests the particular code that’s responsible for one thing on your website.

BONUS – Photoshop

From my experience as a Frontend Developer and Graphic Designer, learning Photoshop is a must. In Startup companies, graphic and web designer usually just give the assets and psd files. Sometimes they didn’t give or create style guides that front end developer use. So it’s a must that you know the basic of Photoshop, like navigating, shortcuts and exporting assets.