Frontend development is a dynamic and ever-evolving field. With the constant introduction of new frameworks, libraries, and tools, it's easy to mak...
For further actions, you may consider blocking this person and/or reporting abuse
Valid points.
Though the example of dropdown menu is not correct, e.g. it does not satisfy your first point of semanticity. You could have simulated the details tag using javascript but using it as a dropdown menu is just not it.
Thank you for writing! I agree with most things, but I do have a remark about the example you give with the "Not testing in different browsers".
I totally agree with that testing in different browsers is always good to do! There are some minor differences between the different modern browsers and sometimes they need to be fixed. But supporting browsers that are end-of-life more than 3 years (Internet Explorer) is maybe a bit overkill. Also I think most of the CSS prefixes are not needed anymore, only for some experimental features maybe.
Can't recall it from the top of my head but unfortunately prefixes are still a thing, I finished a project a couple of months ago and umm .. ash! Line clamp! Atm you have to use prefixes for that... It's an ever flowing thing as it seems, just using the default fallback and the need for prefixes falls off eventually with better browser support, caniuse is a friend.
Oh yeah there are sure some prefixes still used/needed (unfortunately). But the 'great days of wild prefixes' are mostly over. Especially with grid and flex. So it was maybe more about the specific example given.
And yes caniuse is a great resource.
Good points. The biggest mistake for me, as a front end developer for over 20 years, is being a front end developer for over 20 years 😆. Reason: Not diversifying enough because the tech stack scope creep that seems more important to recruiters and companies than basic html, css, javascript and the browser. Though these bullet points like html 5, semantic, accessible, x-browser, (even oldschool xhtml, xsl) mobile responsive detail on a cv were like badges of honour they are small fry on the percentage of desirability.
Word of advice, once you master these, don't just stick with nextjs, typescript, npm . Connect the other dots like databases and cloud services. Yes semantic markup is important but its not going to land people on your nicely formatted web page. Seo web performance, bundle size and overal web feel and interactivity will steal the show, and if you can only do semantic markup it you limit your attractibility.
Great point! 2years of dedicated FE behind me and I can say I'm truly greatful for being able to get invested in all of these fields... Next up is Next.js, we did jQuery before... :) but I love CSS and quite hesitant on Tailwindi, what's your 5cents on Tw?
Tailwind is like angular. Proprietary language convention for oo css. Sure learn it if the company you work for uses it, but in practice its not efficient or performant, requires compiling just to see it working, when you could just write actual css in the browser and get immediate feedback, and copy paste it between mediums when whether its straight from the browser debug window to static html page boilerplate example to a nodejs templating library, reactjs css. module, angular, native web component etc. I even gave up scss to plain old css for agile manouverability. Its just much faster testing against browsers. Use css like a paintbrush or a heavy tank.
Thank you for posting! Number 4 is one that stuck out to me - I'll be more cognizant of the image file types I bring into my app. I also didn't know about the element at all! That's pretty neat.
In the screen width section you use max-width, while a good practice is starting with mobile and use min-width to add complexity. In browsers section you prefix flebox for IE 10 and safari 6, which are 13 years old now. Why? And you still use webp in image section without fallback, but webp is fully supported since safari 16 and is not supported by IE. Details and summary is not supported by IE either. Your points are both outdated and inconsistent.
This is a great breakdown of common frontend mistakes! Issues like inefficient state management, poor performance optimization, and accessibility oversights can seriously impact user experience. Debugging and following best practices are key to avoiding these pitfalls.
Which of these mistakes do you think is the hardest to avoid? Also, managing development workflows efficiently can save a lot of time—structured project management can help keep things on track!
Good information
Thank you for sharing, I also covered some common mistakes developers make especially related to CORS
dev.to/reynaldi/7-common-mistakes-...
Great insights 👍
I can't believe that I've been a frontend developer for close to a year now and I'm just knowing about srcset attribute.
Unbelievable. 😂
Thanks for sharing Man, it's helpful.
hi dimma,
I came across your profile. and new to this platform, im trying to connect with front devs like me, these are the skills that im well familiar with JavaScript, Node.js, PostgreSQL.and i've built around 10 projects, most of them are travel booking websites, currently developing a gym membership system.
so i was wondering if you’d be open to referring me in your current company if there's a vaccancy for junior web dev or even a paid internship should be fine. or guiding me toward the right person to speak with. I’d be truly grateful for your time and support.
Good 👍
This is a keeper 👏
Nice post.
Also using chrome test tool, can help identify what should be optimized to improve performance.
Extremely helpful for a newbie...
They just rely on div tags instead of proper tags and use JavaScript at places where not really necessary, reducing the efficiency of website.
Looks great!
Good 👍
valid info
Good one!