If you’re reading this, you probably have a pretty good idea of what front end development is and what a front end developer’s job entails. But maybe not. If you’re brand new to the industry or simply looking to make a career change, it is helpful to understand what skills are required in order to get a job in front end development, or if you’re looking to start a web development bootcamp, you can make sure these skills are being taught. This is a VERY high level look at the skills that are required to be a front end developer.

Technically, I’m a full-stack developer, but my titles and the large majority of my work has centered on front end development. This is an easy way to think about it:

• Front End Development: Creating what you can visually see and interact with on a website or application. You work in conjunction with a back end developer and usually a designer to bring an idea to life.
• Back End Development: This includes much of what can’t be seen like databases, cloud — a lot of logic to help get the website or application visually up-and-running. I’m not super well-versed in exactly all the things back end developers do…

This is a great article if you’re interested in a much more detailed breakdown of front end vs back end vs full-stack development.

What is front end development? What types of skills do I need to learn to be a front end developer?

For the purpose of this article, I’m just going to focus on the skills needed for front end development. Depending on the type of work that you’re doing, you may need some additional skills and training, but here are some of the main things I’d recommend learning to get started:

• HTML
• CSS
• JavaScript
• JavaScript framework(s)

Skill: HTML

HTML stands for Hyper Text Markup Language. This is definitely the best place to start in your journey to becoming a front end developer. HTML is essentially the language that is used to build web pages and applications. It is comprised of a variety of elements that structure the page and represent the information that you’re trying to publish. Here’s some examples:

<p> = Paragraph, <h1> = Heading, <a> = Anchor/Link

<tagname>Content</tagname> / <p>Name of Article</p>

HTML is really the building block of front end development, but probably the easiest element to learn in your skills toolbelt.

Skill: CSS

CSS stands for Cascading Style Sheets. CSS works in conjunction with your HTML to determine how that content is displayed. As the name implies it is the style of the content on your website or application. Most often you will write what are called classes to assign to the styles you created to certain elements. CSS controls everything or the color of the text to the layout of the page to animations. CSS is incredibly powerful. Here’s an example of what CSS looks like using the class name “new”, where we want our text to be pink and centered:

.new { //Classes are preceded with a “.”
color: pink;
text-align: center;
}

For me HTML and CSS were the more easy skills to be learned to get started. That’s not to say they don’t have their own complexities. But to simply get started and learning, you can figure out pretty quickly what is needed.

Skill: JavaScript

JavaScript is what helps to inject functionality and logic into your website. There is certainly much more to it than that, but at a high level this is how it relates to your mini-stack of HTML and CSS. It’s a scripting language that gives you great power to make your websites and applications function, and do things like interact with Application Programming Interfaces (APIs).

When I was going through a bootcamp, this was really hard for me to learn at first. Eventually it became my favorite thing — and it didn’t take that long for me to start enjoying learning more about what I could do with this skill.

Skill: JavaScript Frameworks

The site SkillCrush outlined the definition in really relatable terms:

Think of building websites and web apps like building a house — when you set out to build a house, you could create all of your own building materials from scratch and start building without any schematics, but that approach would be incredibly time-consuming and doesn’t make a lot of sense. It’s more likely that you would purchase pre-manufactured building materials (wood, bricks, countertops, etc.) and then assemble them based on a blueprint to fit your specific needs.

https://skillcrush.com/blog/what-is-a-javascript-framework/

For the time-being, as you are exploring what you need to be a front end developer, you don’t need to worry so much about getting this skill on your resume yet. However, I think it is a good place to continue once you feel pretty comfortable with HTML, CSS, and JavaScript. What’s popular in regards to frame works can change over time, but at the time of writing this piece, React is definitely the framework I see most often when I’m searching for jobs. Free Code Camp wrote an article comparing the major ones that would be a great place to start when you’re ready. Again, if you’re looking to do a web development bootcamp I’d highly recommend that you find one that teaches you about one of the major frameworks. Mine was supposed to teach React, but we barely covered it.

This is a super high level review of what is needed to be a front end developer, but if you’re looking to learn on your own or attend a boot camp, it will at least give you a set of skills to help you get started in the process.