I was wondering what browser you all use for your projects and for web development. I have used Chrome Dev tools before, but not much. I have recently started using Firefox Developers Edition, which I think is OK.
Well, I just finished reading this article, DevTools Showdown: Edge’s F12 vs Firefox vs Chrome and it is an overlook of the three different browsers. It is a nice interesting read. It seems like Microsoft Edge is trying to get into the competition.
Here is a list of browsers with Developer Tools:
The Chrome DevTools are a set of web authoring and debugging tools built into Google Chrome.
Now for Mozilla Firefox there is 2 options to use.
Firebug: The most popular and powerful web development tool.
Right now I’m using Chrome Dev tools. Why? Because it is enough for me and I like it. But sometimes I use Firefox with Firebug addon - it is cool thing too.
I like Chrome’s developer tools the most. I especially like the device mode which allows you to emulate different devices like tablets, mobile phones, etc.
Yes, that’s a great feature, it comes in handy! Firefox has that feature as well, called Responsive Design Mode. Now for, Microsoft Edge, Safari, Opera and others…I don’t know, if they have it or not.
Hands down, Chrome. Firefox has some nice dev tools, yes, but Chrome’s dev tools are easily expanded with extensions, and there are currently some very nice ones for React and Redux.
I’m told Edge has some fine dev tools too, but alas quite specialized in terms of platform support.
At the end of the article, they have this very cool link called DevTools Challenger and you can use this to test the new possibilities of the developer tools. Also, this DevTools Challenger should be utilized with Firefox Developer Edition browser.
Anyways, I thought I would share for those of you who are interested in developer tools. Check it out and give it a chance.
I really am trying to use Firefox’s Dev Edition ( RIP Firebug ), but there are still a few issues that keep me going back to Chrome. Namely the way the console ‘prettifies’ the code I paste into it.
Here’s an example, notice how the JSON in the browser console ( on the right ) matches the formatting from fCC’s editor:
I’m using Chrome because it allows me to make changes to css on the fly and see them updated in the page without having to edit the actual stylesheet. I can make a change see it instantly then just copy and paste it to my custom css file. It also comes in handy when you’re working with frameworks like Bootstrap since you can see the class list that is affecting the style and know just how to select it in either css or JQuery. Just my opinion. Firefox has its benefits too. I like that you can type code in firebug editor like its a file and the click on run to execute. Chrome doesn’t do that.
In Firefox = Ctrl+Shft+M
And the other good similar thing in Firefox is the “View Responsive Layouts”. It’s available in “Web Developer Toolbar”: Resize –> View Responsive Layouts. With this tool you can see any webpage in all common layouts in the same time (tablet, mobile, etc.)
Going through the javascript parts it wasn’t clearly discussed we had developer tools and since I’m use to standalone IDE’s I had trouble figuring out that we have developer tools to act as IDE…hahaha…lots of pain to figure this out. As such no comment on any particular systems tools.
I much prefer Chrome over any other. I’m sure it doesn’t matter too much which you use. but I am most comfortable with Chrome and it does everything I need to and more
I switched from chrome back to firefox because with tree style tabs, I now have all my tabs in a collapsible multi-level nested tree instead of one long row of 5 zillion tabs. It’s a pretty big deal when i do web coding research!
^ Chrome may have better dev tools than Firefox, but as a user I vastly prefer Firefox as well. It’s just more customizable, and it actually listens to user settings as well (like not going over the specified disk cache size, which Chrome and Opera flat out ignore). Plus I always prefer using software made by organizations that either release their software as open source, or at least support the open source community.
And Firefox’s dev tools are actually really good in the latest release (55). Maybe not completely on par with Chrome, but they’re a lot better than they were before.
Chrome dev tools are miles and miles away from any of the other browsers. There isn’t really any competition, they’re just better. I use FF dev edition for most things, just out of personal preference, and the dev tools are ok (the animation stuff is kinda nice, as is the 3D viewer for novely value), but nothing really gets close to Chrome at the minute in terms of level of dev tooling (eg network throttling, paint stuff, memory tools, service worker/manifest tools, lighthouse audits, async debugging). Only exception is Safari if need to debug against an iPhone/iPad.
