DEV Community

Cover image for 6 Mistakes You Might Be Making As A New Web Developer & How To Avoid Them
Emma Bostian ✨
Emma Bostian ✨

Posted on • Updated on

6 Mistakes You Might Be Making As A New Web Developer & How To Avoid Them

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 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 has a ton of great (and free) online books for learning the ins-and-outs of JavaScript.

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 on how to get started.

Relying On Bootstrap

Bootstrap 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 for a responsive layout, learn fundamentals of CSS and once you master that, learn Sass. If you have trouble designing your app, head over to dribbble for some design inspiration, or check out the templates on Wix or Squarespace.

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.

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 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 will also be very useful. You might even want to take a mobile-first 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.

Latest comments (61)

Collapse
 
alaztetik profile image
Alaz Tetik • Edited

Very great and to-the-point article! I take some notes for future-use. References are great too. Thank you Miss!

Collapse
 
carlosalfarodev profile image
Carlos Alfaro

Amazing article! I need to learn more CSS and stop using bootstrap so much.

Collapse
 
tshimsthedoor profile image
Tresor Tshimanga

😊

Collapse
 
dirkncl profile image
Dirk Levinus Nicolaas

This is a very good suggestion.
In accordance with what I think.

Note for Dev.to.
what is the substitute for alphabet "` "so as not to conflict in dev.to's markdown ?.

Collapse
 
m1guelpf profile image
Miguel Piedrafita

I turned this article into audio using Blogcast!

If you want, you can add this👆 player to your article by adding the following code to the top:

{% blogcast 326 %}
Collapse
 
emmabostian profile image
Emma Bostian ✨

Aw thank you!

Collapse
 
marcode_ely profile image
Marcos Aguilera Ely

Thanks a lot. It's really helpful

Collapse
 
jaimetrejo profile image
Jaime Trejo

Thanks Emma! I just started a web dev project at work and having only some experience for android dev, I'm sure this will be very helpful!

Collapse
 
luteces profile image
Lutece McDuck

Hi, great post!
I am actually following a course with the Wild code school (French school).
I realize we are making some mistakes you list, But we are learning everything about JS and React in only 5 months.

Unfortunately, it's hard to avoid a few mistakes in that time.

I will improve my learning all along my career I assume.

Thank you for your advise.

Collapse
 
qm3ster profile image
Mihail Malo

RE: cover_image
Is that your phone?

Collapse
 
emmabostian profile image
Emma Bostian ✨

Nope it's from Unsplash

Collapse
 
qm3ster profile image
Mihail Malo • Edited

F

Collapse
 
saraalfred profile image
Sara Alfred

I am new to this web development field and Jquery plays an important part but I am not able to pick it well and many of the aspects related to Jquery are well explained by you. Kindly tel me any tutorials related to jquery. Thanks for sharing such a great bag of knowledge.

Collapse
 
httpjunkie profile image
Eric Bishard

I think the advice is good. I like the shout out to Kyle Simpson! His free books oon GitHub are amazing resources!

Collapse
 
delacombo profile image
Jasond_Official

Great write-up on the order and fundamental recommendations. I remember when I first started diving into JS, and I would inspect minified files, totally getting lost in anonymous and reduced variables, etc. Later realizing the same thing could be achieved in an understandable way, by just naming everything in a readable way (non reduced).

Collapse
 
sk8terboi87 profile image
Aravindan

Excellent post!

But, I feel this is not just for new web developer, even Experienced developer are still sticking with Frameworks to carry out their development without knowing much of fundamentals (thats how I was a year back).

This 6 covers exactly almost everything!

Collapse
 
jacksonelfers profile image
Jackson Elfers

I do all of these things on client projects. Particularly putting everything in one file all mashed together, I'm the real deal.

Some comments may only be visible to logged-in visitors. Sign in to view all comments.