Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Firebug

getfirebug.com

Post reply on HN
Print view View original

51–60 of 84 posts

Re: Firebug

#51

Post by derefr »

leptons wrote: post #48
derefr wrote: post #21

Earlier quoted context omitted.

I learnt CSS long before Firebug. Which means that still to this day, I’m vaguely paranoid that I’m underutilizing Firebug (or its successor dev tools) when I write CSS. The interactive model Firebug exposes just never clicked for me. I feel like said model is maybe more easily-absorbed when you’re starting from scratch, and don’t have the “iterate by editing the CSS file and refreshing the page” model burned into yo…

I started writing CSS the same week it was first available in Internet Explorer 3, so "doing it the way you've always done it" isn't really a good excuse. Being able to click on a value for most things (left, top, width, height, etc) and use the up and down arrow to dynamically move an element around the page, or otherwise tweak anything about it - that's game-changing. If you aren't using the dev tools to tweak your…

I mean, what you're describing doesn't work for me, because the way I write CSS involves heavy reuse of classes and using CSS-Zen-Garden-esque element selectors. I try to "move around an element" in the panel? The whole layout breaks. The approach that makes the CSS inspector functional as a tool for modifying layout, is a completely different paradigm from the one I'm used to.

To be clear, I'm a backend engineer; in recent times I only write CSS about once per year, mostly just to update my portfolio site, or to do some interesting little hack. I've never worked with SCSS/SASS, React, web components, etc.

But in the past, I have worked full-stack, writing both a backend and the frontend that it works with. And, in those cases, the CSS I've written works, and is responsive and accessible, while also being readable and reusable, in the same sense that a well-factored library of functions is readable and reusable.

Re: Firebug

#52

Post by ars »

coolreader18 wrote: post #43
ars wrote: post #38

Earlier quoted context omitted.

If you log the contents of an object with firebug and then modify the object later in your script the firebug output does not change. But do the same thing with Firefox and the contents of the object will change. To preserve the object as it was when debugged you have to either copy it or log all the specific properties you're interested in rather than the object as a whole.

Some would probably find that superior to firebug

It's rare to need to see the current (static) state of an object, more often you want to see how the object changes as the code runs.

Re: Firebug

#53

Post by sroussey »

joshstrange wrote: post #50
julius wrote: post #47

Still remember that Javascript bug that only occured when Firebug was NOT installed. Was quite tricky to debug, until it finally clicked. Back then the browser did not have a console.log() function.

This was still an IE "bug" at least up to 11 IIRC. If you had the console open then `console.*()` worked but if the console was not open then you would get an error. So frustrating to have the problem "go away" when you tried to dig into the issue more. At my last company we had some logic that ran first that would proxy all the console.log calls through some code that would check if IE and if the console was open be…

We recommended to have logging feature flagged, or create a fake console object, but there were a lot of methods. Having the browsers just implement something worked better. You never knew where a statement could still be deep in code.

I guess today, the instructions would be `console?.log()` not that it matters now. :)

Re: Firebug

#54

Post by fao_ »

They're advertising a web development tool on a website that doesn't scale to my laptop's 1280x800 monitor. I literally don't know what to say to that.

Re: Firebug

#55

Post by sroussey »

troyjfarrell wrote: post #8
ChrisMarshallNY wrote: post #4

I loved FireBug. Nowadays, every browser has its capabilities, but back in the day, FireBug was the only game in town.

Venkman was the only game in town. It was a glorious day when Firebug surpassed Venkman. https://wiki.mozilla.org/Venkman/Firebug_Comparison

Yeah, this was the original front end to the debugger apis (which then barely changed for a decade).

Re: Firebug

#56

Post by sroussey »

ars wrote: post #38
JohnBooty wrote: post #28

Earlier quoted context omitted.

In what way(s) do you find it inferior?

If you log the contents of an object with firebug and then modify the object later in your script the firebug output does not change. But do the same thing with Firefox and the contents of the object will change. To preserve the object as it was when debugged you have to either copy it or log all the specific properties you're interested in rather than the object as a whole.

Firebug could do it both ways, that was the beauty of console.dir().

Re: Firebug

#57

Post by FajitaNachos »

paul7986 wrote: post #34

Firebug and or Chrome's similar dev tool is how I design websites for a living. Everything can be changed live in the browser. I start with a bootstrap template change its html/css accordingly and after save it in my html or css files. Just don't refresh the browser though there is a way to have it saved directly to your html file without leaving the browser.

My first real dev project was a chrome extension that would save those html/css and auto commit them to a GitHub repo.

Re: Firebug

#58

Post by paul7986 »

FajitaNachos wrote: post #57
paul7986 wrote: post #34

Firebug and or Chrome's similar dev tool is how I design websites for a living. Everything can be changed live in the browser. I start with a bootstrap template change its html/css accordingly and after save it in my html or css files. Just don't refresh the browser though there is a way to have it saved directly to your html file without leaving the browser.

My first real dev project was a chrome extension that would save those html/css and auto commit them to a GitHub repo.

Yes a friend set it up so it automatically changed the files locally. But, for me I frequently use the undo function in my local files and having it auto save didnt work for me. Personal preference.

Cool that yours auto pushed to a repo.

Re: Firebug

#59

Post by fiddlerwoaroof »

derefr wrote: post #51
leptons wrote: post #48

Earlier quoted context omitted.

I started writing CSS the same week it was first available in Internet Explorer 3, so "doing it the way you've always done it" isn't really a good excuse. Being able to click on a value for most things (left, top, width, height, etc) and use the up and down arrow to dynamically move an element around the page, or otherwise tweak anything about it - that's game-changing. If you aren't using the dev tools to tweak your…

I mean, what you're describing doesn't work for me, because the way I write CSS involves heavy reuse of classes and using CSS-Zen-Garden-esque element selectors. I try to "move around an element" in the panel? The whole layout breaks. The approach that makes the CSS inspector functional as a tool for modifying layout, is a completely different paradigm from the one I'm used to. To be clear, I'm a backend engineer; in…

So, my CSS is similar, when I use dev tools to tweak CSS, I generally adjust the “element” section rather than my classes, to make the element I’ve selected look right. Once I’ve gotten that down, I think about the best way to integrate the new styles into the existing ones.

Re: Firebug

#60

Post by bovermyer »

I feel grateful for everything Firebug did for me over the years. It definitely made my life easier as a web developer.
Post reply on HN