Front end Developer Skills

Hello,

This is pretty basic. I was trying to explore the front-end development as I was not from a tech background. But, very much interested in learning. I was exploring this Frontend article here

I just wanted to understand if there are any more skills/languages I have to learn in order to get started with this. May be a basic to advanced guide.

2 Likes

That’s a good idea, we need a topic here full of wiki-posts to detail variety of frameworks, basic skills needed, etc… etc…

As to that article, I’d definitely say typescript is more important than javascript, as it is javascript but with types to make it not hell to debug.

Learn webpack, it’s basically taken over the ‘frontend builder’ scene. It’s own homepage is decent as a reference, careful of tutorials because it’s changed a lot over the years so you want modern tutorials.

Don’t touch jquery. Don’t touch anything that touches jquery. Jquery is not only no longer relevant it’s actively harmful now. Vanilla JS can do everything it can, and if you want some of its few areas where its actually more succinct then just make your own functions to wrap the vanilla functionality or get one of the better libraries out that are actually fast and not harmful to performance and memory.

SASS and such other CSS preprocessors are basically all replaced now with PostCSS, PostCSS should be the CSS preprocessor used for any new CSS work, don’t touch the older ones anymore unless working on an old project that already uses them.

For CSS learn flexbox and grid css, those are the two modern ways supported by every evergreen browser and they make CSS sooooo much easier than the old methods!

And yes, learn git, not just from a gui, I’m entirely of the thinking that you should learn the cli, and not just the commands but what it does and how it works! Such knowledge you won’t use often, but the few times you will it will save your butt!

And of course test test test, the front-end world has a ton of great testing infrastructure from unit test things to full on virtual browsers to test full functionality.

And don’t forget that firefox/chrome/others have some fantastic debugging and performance tools for CSS, JS, and HTML, learn them and use them!

7 Likes

Corresponding tweet for this thread:

Share link for this tweet.

2 Likes

Another great post ODL! And I agree, it definitely makes for a good wiki topic :smiley:

Could split your post as a starting point if you like - but what to call it? State of Frontend Dev 2021?

3 Likes

I saw similar like frontend masters (2019 frontend handbook)

3 Likes

Here are some of the most important front-end developer skills:

  • HTML and CSS are the foundation of front-end development. HTML is used to structure the content of a web page, while CSS is used to style the content.
  • JavaScript is a programming language that can be used to add interactivity to web pages. It is the most important front-end development skill, and any front-end developer should be proficient in it.
  • Frameworks are pre-built libraries of code that can be used to speed up development and make it easier to create complex features. Some popular frameworks include React, Angular, and Vue.js.
  • Responsive design is the ability of a web page to adapt to different screen sizes and devices. This is essential for creating a good user experience, as more and more people are using mobile devices to access the web.
  • Version control is a system for tracking changes to code. It is essential for any developer who wants to be able to revert to previous versions of code or collaborate with other developers on the same project.
  • Testing and debugging are essential skills for any developer who wants to create high-quality code. Testing ensures that the code works as expected, while debugging helps to find and fix errors.
  • Browser developer tools are a set of tools that can be used to inspect web pages and debug code. They are an essential part of any front-end developer’s toolkit.
  • Web performance is the speed at which a web page loads. This is an important factor in the user experience, as slow-loading pages can frustrate users and lead to them abandoning the page.

In addition to these technical skills, front-end developers should also have strong communication and problem-solving skills. They should be able to work well with other developers and stakeholders, and they should be able to identify and solve problems quickly.

Here are some additional skills that can be helpful for front-end developers:

  • Design skills can be helpful for creating attractive and user-friendly web pages.
  • Knowledge of accessibility is important for ensuring that web pages are accessible to people with disabilities.
  • Knowledge of SEO can help to improve the ranking of web pages in search engines.

and you can check this post about frond end interview questions, this will help you in your Technical Interview, Hope this will help you.

1 Like

Essential Front-End Developer Skills for Building Modern Web Experiences

HTML/CSS Mastery
JavaScript Proficiency
Responsive Design
Cross-Browser Compatibility
Version Control/Git
Command Line Proficiency
Web Performance Optimization
Testing and Debugging
Build Tools and Task Runners

1 Like

A person who hires a lot of programmers once recommended to me that if someone wants to do frontend as a job, get really good at CSS. I previously disliked CSS so I avoided it, but I’m trying to catch up now. (I’ve mostly relied on customizing frameworks like Boostrap and Bulma with SASS.)

3 Likes

The state of JS (ages ago and even now) annoys me to no end, I’d assume there’s no end to creating a new library. Good thing there’s Liveview.

1 Like