6 Mistakes You Might Be Making As A New Web Developer & How To Avoid Them
Tags: javascript
Published: 2019-02-25 12:54:31

---
title: 6 Mistakes You Might Be Making As A New Web Developer & How To Avoid Them
published: true
description: 
tags: JavaScript
cover_image: https://cdn-images-1.medium.com/max/2000/1*_BSX61CxShyqW7oT7Kgc8Q.jpeg
---

{% blogcast 326 %}

Learning web development is intimidating. There are so many resources and tutorials that it can quickly seem overwhelming. It’s often difficult for beginners to web development to learn the best practices and technologies to focus on. So we’re going to examine six common mistakes that beginners make and how they can be avoided.

By learning how to avoid these six mistakes, you’ll be on the road to impressing potential employers and getting your first job.

# Relying On jQuery
[jQuery](https://jquery.com/) is a JavaScript library which creates a layer of abstraction for DOM manipulation, event handling, animations, and more.

Many developers begin their journey into front-end start with the misconception that jQuery is an easier version of JavaScript. What most fail to realize is that jQuery not be a replacement for JavaScript, and relying on it can have severe implications on your ability to thrive as a front-end developer.

Many employers may even see jQuery as an impediment to a candidate, because it can show a lack of understanding of core JavaScript concepts. Thus, if you choose to learn jQuery, you must not use it as a crutch for adding behavior to your web applications.

**Recommendation:** Learn JavaScript like the back of your hand. [Kyle Simpson](https://github.com/getify) has a ton of great (and free) online books for learning the [ins-and-outs of JavaScript](https://github.com/getify/You-Dont-Know-JS).

# Relying On JavaScript Frameworks & Libraries
React, Vue, Angular, and more! These are some of the hot frameworks and libraries in the JavaScript community right now.

While knowledge of, and ability to work with, popular JavaScript frameworks and libraries are marketable skills to have, you must also have a good knowledge of JavaScript. If you fail to learn the foundations of JavaScript, you never truly learn what the features of these frameworks are doing under-the-hood. Some people learn best by starting with the basics and working their way up to the frameworks. Others learn best by delving into the framework or library and picking up the basics as they go along. Whichever method works for you, go for it! Just don't forget that knowledge of JavaScript is imperative to becoming a successful web developer.

**Recommendation:** Build a strong foundation of JavaScript. will allow you to ace technical interview questions. If you understand JavaScript to the core, you will have no problem working within a framework or library.

If you’re unsure how to begin learning JavaScript, check out my [previous blog post](https://levelup.gitconnected.com/how-to-learn-javascript-839fa03745c8) on how to get started.

# Relying On Bootstrap
[Bootstrap](https://getbootstrap.com/) is a UI framework for building websites. Many developers starting out view Bootstrap as an easy way to style a web application, and while it can be useful in specific circumstances, it should not replace your knowledge of CSS and responsive web design.

Including Bootstrap in small web applications can have performance implications. It’s much easier on load-time to write the CSS code yourself. Employers would much rather see your knowledge of CSS than any UI framework.

**Recommendation:** Learn [CSS Flexbox and Grid](https://levelup.gitconnected.com/when-to-use-css-flexbox-vs-grid-or-both-c1a5f01dc88a) for a responsive layout, learn fundamentals of CSS and once you master that, learn [Sass](https://sass-lang.com/). If you have trouble designing your app, head over to [dribbble](https://dribbble.com/) for some design inspiration, or check out the templates on [Wix](https://www.wix.com/) or [Squarespace](https://www.squarespace.com/?channel=pbr&subchannel=go&campaign=branded-europe&subcampaign=%28search-global-branded_squarespace_e%29&gclid=CjwKCAjwq57cBRBYEiwAdpx0vVoE6trKqOJrnoGWrb7lZHx34NGSMasTeTIKJaAacU1nGTSdImmGfhoCw0QQAvD_BwE).

# Not Modularizing Your Code
It’s extremely important to ensure your code is modular; do not put it all into one HTML file. Not only is it bad practice to have HTML, CSS, and JavaScript into one file, it’s messy and difficult to test.

**Recommendation:** Break your JavaScript into an external file. This allows you to separate functionality from your view. Once you feel comfortable with JavaScript, I recommend learning about [native web components](https://codeburst.io/6-reasons-you-should-use-native-web-components-b45e18e069c2). 

It will greatly enhance your project architecture and make it easier to write unit tests. You can additionally consider a JavaScript framework or library like React or Vue. Both of these make it very easy to implement modular components.

# Not Using Semantic HTML
One thing I often see when reviewing candidates’ portfolios and projects is the over-use of `<div>` and `<span>`. You should always be using semantic HTML5 elements. Why? Because it’s accessible.

**Recommendation:** Really get to know the semantic elements you have available to you. Learn how to create a markup hierarchy. Additionally, learning about [web accessibility](https://codeburst.io/seven-ways-to-make-your-web-app-more-accessible-411a8c716fcb) is a great skill and can impress potential employers.

# Not Learning Responsive Design
If you’re beginning your web development journey, responsive design skills are a must. The majority of web surfing is done on mobile devices and tablets, thus our sites must be able to respond to different screen sizes.

**Recommendation:** Take a course or two on responsive design. Learn how to use media queries to style your application differently. Learning [Flexbox and CSS Grid](https://levelup.gitconnected.com/when-to-use-css-flexbox-vs-grid-or-both-c1a5f01dc88a) will also be very useful. You might even want to take a [mobile-first](https://www.pluralsight.com/courses/mobile-first-responsive-web-design?gclid=CjwKCAjwq57cBRBYEiwAdpx0vXWVWneBbyRUooDlu1nEAIgDdVCiRVVkQkoNp9aOUahLUQRywOulRxoCS0kQAvD_BwE&aid=7010a000002BWqGAAW&promo=&oid=&utm_source=non_branded&utm_medium=digital_paid_search_google&utm_campaign=EMEA_Dynamic&utm_content=&s_kwcid=AL!5668!3!277727473382!b!!g!!&ef_id=WwQn1AAAAMIlu2jc:20180830171925:s) approach.

---

I hope these tips have helped clarify some common misconceptions. Just remember that we all started somewhere, and it will get easier over time.