addEventListener() and you!

Event Delegation

What is it? Well I can tell you it is great! Gone are the days of an onMouseOver event watcher on every list item or span on your page. Now you can tell the parents to pay attention to their kids by reminding them to listen to the conversations they little ones are having and reacting appropriately. We do this by using  addEventListener. This brilliant function does just what it says. This one is easier to explain by example, so here goes.

<div id="parent-div">
<span id="child-1">One</span>
<span id="child-2">Two</span>
<span id="child-3">Three</span>
</div>

<script>
// Get the element, add a click listener...
document.getElementById("parent-div").addEventListener("mouseover", function(e) {
// e.target is the moused over element!
// If it was a span item
if(e.target && e.target.nodeName == "SPAN") {
// SPAN item found! Output the ID!
console.log("List item ", e.target.id.replace("child-", ""), " was evented!", e);
}
});
</script>

It is really as simple as that. Now when any child span is moused over the id number for that child will be sent to the console. You can also use specific classes if you use .matches(“className”). Digging deeper into this has me going down the MouseEvent rabbit hole so I know what my next post will be about! I mean who wouldn’t want to learn about MouseEvent.bubbles! BUBBLES!

Final Days as Student at MakerSquare

I am on my last day as a Student at MakerSquare, I have been accepted as a Fellow (more on that later) but I thought it might be a good time to do some reflecting. First thing that strikes me is how long it seemed at the start and how quickly the time went by. I swear days turned to minutes and weeks to hours. I am amazed at how much I learned in such a short period of time. It has been exponential!

I am also aware that the bonds I have developed need attention if I want them to last a lifetime. I am making it a priority to stay in contact with those I have grown close to. This is easily my weakest area so I hope I can stay on top of it. I will never forget the late nights coding and watching TNG. Even the frustrating moments and mini-conflicts that popped up only seemed to draw me closer to my fellow learners.

Even though I am staying on for a bit longer I am still very excited to see what happens to them next. It will give me a hint as to my own future, more things to look forward too, more struggles, more life! I love you all and can’t wait to see the great things that I am sure you will all do!

Maker Square Day 1

I was pretty nervous starting out. School? Not for a long time now, and even back then I was pretty shitty at it. What would be the difference now? Would I do it? Could I do it? My mind was not on my side, throwing doubts in front of me at every step. So I did what any person I admire has done and said to myself “Do the work”.

I have to admit my notes of the first lecture make no sense to me. Random words of JavaScript, some !!!!s and a whole lotta nuttin.

For Example:

1   -> func(targetClass)

-> document.body.classList
if contains ClassList
add to array
call recurse
results = []
node = document.body
if (node.classlist contains className
push -> results

for ( node.children.length)
function(node.children[i])
get
results = results.concat(node.children[i]
}
return results

({   }).a_prop = { x: 5 }

What the heck is that!?!? I call it insane.js, coming to a github near you…

Maybe I would do better with the second lecture given by Muhammad?

read wiki

Do all toy problems. (sweet toys!)

That almost seems worse! I do slightly better on the next. I can verify this by being able clearly state what I learned. Review underscore/lodash implementation. Intro to Time Complexity. Look at pluck and reduce.

Alright, getting better! The next topic was about Paired Programming and how it was an Agile technique where there is the driver, mostly typing, and the Navigator, mostly syntax/logic. I think with the educational model they focus more on the driver being a bit of a noob and the navigator being more comfortable. In practice it is much more cooperative than that. They mentioned Data Structures very briefly. Then they touched on whats it is like to be a junior (code, code, code, sleep, workout, code) and what it might be like to be a senior (code, code, code, code, code, jobs, code, code). I am pretty sure they said much more but… I learned that we had to do 5 min presentations and I got excited about that.

Can’t wait for more!