New to Frontend Engineering: 8 Things To Stop Doing.
1. DON’T: Use generic tags like <div>
and <span>
everywhere just because it’s easy.
INSTEAD: Use semantic tags like <header>
, <footer>
, <article>
, and <section>
to give structure and meaning to your HTML. This improves accessibility and helps search engines understand your content better.
2. DON’T: Hardcode sensitive information, like API keys, directly in your code.
INSTEAD: Use environment variables for sensitive data and configure your project to access them securely. This practice keeps your information safe and easily configurable.
3. DON’T: Assume that if it works in Chrome, it works everywhere.
INSTEAD: Test your app on multiple browsers (e.g., Firefox, Safari, Edge) and devices. Browser compatibility is crucial for reaching a broader audience.
4. DON’T: Wait until you're on a team to learn Git.
INSTEAD: Start using Git from day one. Create branches, make commits, and push changes to GitHub. Version control is essential for tracking changes and collaborating effectively.
5. DON’T: Write everything from scratch for each page or section.
INSTEAD: Build reusable components for common UI elements (buttons, cards, forms). This makes your code modular, reduces redundancy, and speeds up future development.
6. DON’T: Assume that code style doesn’t matter if you’re working alone.
INSTEAD: Set up tools like ESLint and Prettier from day one. They keep your code clean, consistent, and error-free, making it easier to read and debug.
7. DON’T: Organize files randomly or without a system in place.
INSTEAD: Use a clear folder structure with organized folders for components, hooks, utilities, and styles. A well-organized project is easier to navigate and maintain, especially as it grows.
8. DON’T: Forget about mobile devices or wait until the end to make adjustments.
INSTEAD: Design and test with mobile-first principles, using responsive units (%, vw, vh) and media queries to ensure your app looks good on all screen sizes from the start.