This article is for all those to those who write any kind of frontend code, no matter how experienced they are, whether they are fully frontend or fullstack, or mostly frontend and write backend occasionally, and no matter which platform they use.
Normal coding botches happen to each developer, paying little heed to ability. That is the reason you ought to understand what they are, the means by which to detect them, and how to stay away from them.
It doesn’t matter if you’re a seasoned coder or a novice, no one’s perfect. To develop as a developer, you should have the option to concede when you make one and you should likewise know how to fix it. Instead of always improving your product’s functionality, focus on common errors that you should not have initiated during the development of an application.
In light of that, here are some of the most common coding mistakes that you may encounter during your sessions, and how to avoid or fix them:
- Ditch your old school HTML
The newest form of HTML coding language is HTML5. It is the fifth and current major version of HTML standards, with a lot of changes to standard web designs. HTML5 replaces many elements and introduces new interesting HTML5 elements such as:
* New semantics elements like <header>, <footer>, <article>, and <section>.
* New attributes of form elements like number, date, time, calendar, and range.
* New graphic elements: <svg> and <canvas>.
* New multimedia elements: <audio> and <video>.
A web design totally depends on browser capability so it is not advisable using outdated HTML standards so that we don’t face any problem in the future.
- Say No to importing the whole library
If you are planning to use the whole Library, ditch your thoughts! This will increase the bundle size. Take lodash as an example. Do not import _ from “lodash”. This will increase your bundle size by over 500kb.
You should import the only function you need. For example, import is Empty from “lodash/isEmpty” , and your bundler will tree-shake it.
- Learning only frameworks
Over the course of years, programmers have created numerous ready-made solutions for typical problems. Novice developers often think that it’s enough to find the right boilerplate or a code snippet, do some copy and paste and voilà! Their shiny new piece of software is ready. Except that it’s not.
Good developers do differently. Before they touch any boilerplate, they learn a vanilla language, so that they understand how boilerplates work under the hood. And if they need to switch to another framework or learn a new library, it’s easier for them to pick up the toolset. It works one way – if you know jQuery (a JavaScript library), you can have zero idea about JavaScript. But if you learn JS first, you’ll have no problem with learning any JS framework or library.
- Not knowing how much you know
Many junior developers never publish their code. They study a lot, learn a little bit of everything and still they are not sure if they know enough to start working as a programmer. We once had a pre-sales question from a person who wrote a mobile application with GPS connection, which used heuristic algorithms to estimate how to improve the user’s workout routine. Mind you, a typical bootcamp candidate has never written a single line of code and has no idea what a heuristic algorithm is.
All in all, it’s hard to assess your knowledge, especially in the field you don’t know inside out.
- Not designing for different screen sizes
As stated in earlier, consumers today browse everything on mobile only thus it is very important for the designs to be mobile friendly. But there is a constraint in mobiles that they come in different sizes with different screen resolutions.
So, if one wants their user to access their website without any hindrance then they must enable it for their users that they can easily operate from any of the digital devices.
When a developer is building the solution, one can adhere to Bootstrap practices which will help to develop mobile responsive designs.
Most of the front-end mistakes are the result of ignorance or carelessness. A lot of time the developers are in a hurry to finish their product within the deadline and they don’t think about the future and prepare unscalable solutions, they are going to pay for it later by spending time on refactors that cost money.
All of the frontend mistakes presented above are very common and could easily be solved by applying the techniques from this article.
Till then, make mistakes and learn from them.
Happy coding!!
