
Master web development with over 9000 tricks - bubble_boi
https://medium.com/@david.gilbertson/master-web-development-with-these-9-985-weird-tricks-77c71d1d96f3#.pvqsolvp0
======
nothrabannosir
Love it.

After playing around with it on desktop, I have some (feature) requests, I
hope you don't mind :)

* is it open source? [EDIT: scratch that, found the source: [https://github.com/davidgilbertson/know-it-all](https://github.com/davidgilbertson/know-it-all) ]

* full background coloring of pressed buttons, not just edge

* visual cue as to whether a node has children without having to click on expand

* visual cue of completeness of node's children when collapsed. E.g. I know CSS, but not all of its children. When collapsed, it looks "green".

* Total % counters for each category to help with tracking total goal.

* Description, links to MDN / ... right there in the node somewhere (being open source would help with this a lot, through PRs)

Aside from that, I'm not sure about the usefulness of having buttons on non-
leaf nodes, anyway... you'd expect that someone who knows of all a node's
leaves knows about the node. I know it's not strictly the same, but is the
difference important? It would help simplify the model. Then again I guess
that's just personal preference.

Also note that this is very close to a learning system called flashcards. If
you added automatic decay and quizzing (you can trust the user to be honest)
you get a great way to keep knowledge current. That's the semantic problem
with this; I know and will forever know about <base>, but I might soon forget
a lot of minutiae I currently happen to know about push notifications because
I've been working with them recently. Flashcards take knowledge decay into
account.

But again: great stuff! Love it.

~~~
bubble_boi
Thanks for the useful feedback, it's much appreciated. Buttons are now full
background colors, looks much better. It also should now be easier to see
which nodes have children.

Please have a look at this issue: [https://github.com/davidgilbertson/know-it-
all/issues/8](https://github.com/davidgilbertson/know-it-all/issues/8)

I need to have a think about (and see what other people think) how to deal
with inheritance of 'scores'. If you click "I don't care" to WebGL, it should
trickle down, but probably not for "I know it". So I need to cover the
different scenarios but stay intuitive.

I also need to have a think about how to show some information about what's
happening below an item in the tree. Maybe just a % unrated for each row or
something.

Regarding flashcards, love the idea, don't love the amount of work it would be
:) I left a reply to a comment on medium about this if you're interested.

------
hamandcheese
> So the goal is all green?

> Why you gotta be like that? No, the goal is to have no red. That doesn’t
> mean you need to know everything.

This might be obvious, but I think its also super important, especially in
ones early years of programming. Maximize your "known unknowns" and rest easy
knowing you can Google it later. Being able to recognize when an API,
technique, etc., can be used is half the battle.

------
gjkood
Reading the post made me feel I was reading a P. G. Wodehouse short story set
in contemporary times.

------
FlorianRappl
This is an awesome app, wonderfully curated content!

From a design / usability POV the site could use a little bit more contrast.

~~~
borisyankov
Site is using Helvetica Neue, weight 300, which should never be used for body
text. I can only imagine how it looks on a non-retina display.

~~~
bubble_boi
I've changed it to 400 now.

------
y4mi
i hate websites that utilize so light grays... they're pretty much
indistinguishable from white on my screen. (the triangles in front of the
items on the website he's blogging about)

thankfully, styler extensions exist for both chrome and firefox, with which i
can overwrite the color themes. its still annoying though.

~~~
revx
Agreed that the contrast on these is too low, though perhaps "hate" is too
strong of a word :)

~~~
bubble_boi
I laughed out loud at that. I have improved the contrast now so they will have
to find something else to hate. Probably kittens.

------
ourmandave
_If that doesn’t get your juices flowing, this app isn’t for you, and you
should get your juices checked._

Hilarious, but my insurance doesn't cover that.

------
oblib
The obsessive compulsive in me suddenly feels the urgent need to find 15 more
tricks. How did you resist this?

~~~
SippinLean
That's not an example of obsessive compulsion

~~~
closed
A compulsion to continuously check a website out of constant ruminating about
missing out on knowledge seems like it could fall under OCD if it were highly
disruptive to a person's functioning!

(Not to take this off the rails, since I realize the original comment was
using obsessive compulsive very gently)

------
rebootthesystem
Throughout the years I found Excel and Word to be powerful Engineering tools.
It's interesting to see the author relied heavily on these tools to assemble
the database.

Excel, in particular, at least for me, has always been a powerful productivity
booster. A small list of what I've done with the program includes:

\- Calculation and exploration of coefficient tables for polyphase FIR filters
for FPGA designs (including auto-magically producing Verilog code to paste
into my modules).

\- Generation and maintenance of C code for embedded system control panel menu
state machine. Version control was easily handled using sheets. Again, copy-
and-paste code right into compiler.

\- Acoustics calculations for professional digital theater design including
room resonant modes, full surface material database, sound management
calculators (Helmholtz resonators, etc.).

\- Entry, generation and maintenance of I/O definitions for 1,000+ pin FPGA
designs with copy-and-paste Verilog code output. This makes something that is
virtually impossible to maintain with a code editor into a thing that is
absolutely manageable.

\- Entry, generation and maintenance of PCAD and later Altium Designer
schematic symbol and PCB footprint for components with full IPC parameters.
While Altium has improved this over the years there was a point in time when
defining and maintaining something like a 400+ pin FPGA could take days
(particularly with it's predecessor, PCAD). Using Excel for data entry by
copy-and-pasting directly from PDF data sheets changed a days-long process
into about an hour tops. This required about three months work writing a
custom Excel tool in Visual Basic for Applications, which turbocharges Excel.
Moving signals around, swapping banks and other options that would instill
fear in almost any engineer were reduced to a five minute procedure using
Excel.

\- Automated processing and maintenance of design BOM's. Again, some custom
VBA code. Grab BOM from PCAD/Altium and turn it into something that can be
used, versioned and maintained during production.

\- Simulation of FIFO input/output buffers for the implementation of a frame
store in a real-time FPGA video processor project.

\- Simulation of packet processor for the same project.

\- Calculation and optimization of clock multiplier parameters for the
generation of multiple desired frequencies within specified tolerance ranges

The list goes on. I also used PowerPoint with VBA code to simulate the
operation of a control panel for both presentation and later product training
applications. This code imported the aforementioned state machine definition
and transformed otherwise static slides into something that worked almost
exactly as the actual product.

This is something online versions and competitive online products (Google)
have failed to effectively translate. The desktop versions of the MS Office
suite are incredibly powerful. Granted, most people don't even begin to
scratch the surface of what these can do. I believe it is very important for
engineers to be very well versed on what these tools, particularly Excel, can
do.

As a side note, I highly recommend this Excel add-on. It's a real time saver
and makes for powerful processing of all manner of data you might need to
shape and clean in producing everything from code to database table data:

[http://www.asap-utilities.com/](http://www.asap-utilities.com/)

No affiliation whatsoever, just a happy paid user for many years.

