An essential list of resources for front-end developers

So let’s start of with the most important part, what you use to write your code.

There are several options here but here are what I’d recommend.

Atom is a great text editor with a big community around it which has produced some great plugins and themes but this seems to of slowed somewhat in recent months.
Visual Studio Code
Code had a slow start when it was released to the community but it has since grown dramatically with having features such as IntelliSense and inline debugging baked into the application making it more convieniant for developers of all kinds and with an already big marketplace full of really good plugins and themes ready to use is only making the go to text editor now-a-days.
Vim (yes, really)
I added Vim to the list as it is quite a handy editor to at least know the basic functions of, especially if you just need to make a few quick text edits here and there and other simple edits.

Now you have you text editor of choice, what choices are there for slicin’n’dicing those design files up.

Adobe Photoshop
Photoshop, the old guard of web design, pretty obsolete in todays industry but it's still the best for image manipulation and other nice image effects which other competitors lack in.
Sketch is my go to design application, most of it's features now are all that you'll need for designing a web page and even building protoytpes straight from the app is just one of the many features why would want to be using it over Photoshop.

Now that you have coded up your page, done all the design work and optimised the assets, it’s time to test what you’ve built.

Browserstack is a great tool if you want to quickly test presentational and core functionality of a page in lots of different types of browsers, new and old which should cover pretty much any requirement.
IE Virtual machines
Using the IE Virtual machines kindly provided to us by Microsoft is a great way of doing a bit more complex debugging and user testing on as the performance difference is much more realistic that when using Browserstack.

These are my thoughts on the essentials pieces of software and services a front-end developer should know quite well.

I decided not to go into more areas as the list would be endless but here is a quick list of other tools that a front-end developer should be aware of.

As you can see there is a lot of stuff to learn to master the front-end development side of the web and this list is just a small portion of what else is out there!

Happy learning!