In many professions, tools can help drive the success of a project. Having the right tools determines how efficiently and effectively you can attain your objectives. However, finding the right tools can often be a time-consuming task, as you generally don’t know how well a tool will work until you spend time using it.
As one of a team of full stack developers here at Zion & Zion, I have many tools in my arsenal, but the following are ones I use on a daily basis. These tools have proven to me that any time spent testing and learning them has been well worth it. Some of the tools are geared towards PHP developers working on Macs, but the majority will be environment/language-neutral. There is a mix of browser extensions, applications, and web resources that all make a big impact.
By the end of this article, you should have a great toolset for web development that will make your life a lot easier and save you a whole lot of time.
List of Best Web Development Tools
- MAMP PRO
Browser Extensions specifically with Google Chrome
- Check My Links
- Clear Cache Shortcut
- IP Address and Domain Information
- Google Analytics Debugger
- Tag Assistant
- Compress JPG
- Compress PNG
- Test API Calls
Choosing an IDE is a pretty big deal as a web developer, because it’s usually one you will commit to for a long time. It’s essentially the bread and butter of web development as it’s where all your code goes. I’ve found PHPStorm made by JetBrains to be my favorite, and it’s by far the best on the market. It’s feature-rich, has a clean interface, and most importantly, it’s fast.
To see a full list of features, you can check out their site here.
2. MAMP PRO
MAMP PRO is the greatest. It wasn’t too long ago that I was just using the free version of MAMP, which was amazing. But then I got a taste of MAMP PRO. MAMP PRO has unique features like multiple versions of PHP, multiple domains, and debugging tools. Best of all, it’s super easy to configure. This is one of the most significant and cost-saving tools you can have as it provides you with the ability to test sites, as well as create staging environments.
X-Browsering is one of the best, and most important, parts of web development. Making sure your site looks good and works well on old browsers like Internet Explorer (IE) 7, 8, 9, and 10 is such an important factor for usability. It’s not something that should be ignored. The challenge for Mac users, however, is that IE is only available on windows. That’s where VirtualBox comes in, as it allows you to spin up a new virtual machine with a Microsoft Window’s OS. Then you can choose whatever IE version you need to review your site.
Browser Extensions specifically with Google Chrome
5. Check My Links
If you’re dealing with content heavy sites or just large sites in general, this tool scans the site to make sure you didn’t miss any links or that there are no bogus links left hanging around.
6. Clear Cache Shortcut
This tool almost speaks for itself. There’s nothing more annoying than when you’re trying to fix something and nothing you do seems to be working—until you realize the page is cached. This gives you a quick shortcut to clearing without having to go into your settings.
7. IP Address and Domain Information
This is one of those tools you’ll always want to have readily available. It can be very handy, especially during the debugging or launching stages of a site. Oftentimes, the DNS hasn’t updated yet and you want to know if the IP has changed, or you simply forgot to update your host file, and this will quickly tell you.
Wappalyzer is a browser extension that uncovers the technologies used on websites. It can tell you what type of CMS, eCommerce Platform, Web Server, JS Frameworks, and many more technologies used on the site. This is very helpful when you need to get a report on a site for a client meeting or to present data about another site you haven’t worked on.
9. Google Analytics Debugger
If you ever need to create events, configure cross-domain tracking, or set up other advanced features within Google Analytics, GA Debugger gives you all output information in your console so you can see exactly what information is being passed. This can save a lot of time, instead of having to wait for data to show up in Google Analytics.
10. Tag Assistant
As a web developer, I’ve also had to dabble around with Search Engine Optimization (SEO) and making sure Google Analytics and/or Google Tag Manager is on the site. This browser extension allows me to quickly check if they’re on the site, and what ID they have.
11. Compress JPG
Performance for websites is #1 nowadays, so compressing your images is one of the first things you should do during optimization. They’re both free and easy tools to quickly compress. If you’re dealing with a large amount of images, they also provide an easy to use API for mass compression.
12. Compress PNG
13. Test API Calls
Hurlit.com is a great tool I recently found for testing API calls. It’s great if you need to test authentication quickly, or to see if you’re getting a valid response. I’ve found it useful when trying to debug as well, or when you want to create test scenarios for an API you’re making.