03-02-2013

[donjo]

Getting the ball rolling for the next Dojo. Does anyone have any lesson plan ideas they were working on already? If not, let's brainstorm some new ones.

[brntbeer]

How was the html/css class? I assume it went well, what about some more front end fancy looking things?

I'm probably crazy for suggesting thing, but i'd love to see them building some graphs. More specifically with d3.js or rickshaw. I'd definitely lean towards rickshaw because it's a little easier to create i think, and some of the syntax is even along the lines of shoes and we're really messing with some css to change some colors (just thinking of ways to maybe loosely tie the previous lesson together if they were there).

I of course won't be in town again for this one :cry:

[cameronmcefee]

I had thought about doing d3 stuff. The only concern I'd have is whether they'd care about the result. Do kids like graphs? I feel like they might have fun building something interactive with js though.

[brntbeer]

Yeah. I mean making ANYTHING appear is kinda awesome. we could probably start it out with "here are some values you can graph: 5 10 15 20 25" and within 15 seconds someone would do 1500000 as a value and break the graph, which could segway into domain and range pretty well. And at the end we can show how taking a csv file can give you this data? and we can point them to a bunch of other csv's? :grimacing: maybe? haha that gets pretty complicated pretty fast.

[cameronmcefee]

Maybe a lesson that does some simplified version of something like these:

• http://bl.ocks.org/mbostock/1062544
• http://bl.ocks.org/mbostock/1123639

[KartikTalwar]

The particles demo definitely seems better and relatively easier to explain than the rest. I think if we are agreeing on this theme for the next session, walking through the particle demo verbatim should be straight forward (specially for the 2hr time slot). Theres about 25 lines of core logic here but it doesn't necessarily have to be this way. I wouldn't mind simplifying this down.

[cameronmcefee]

The particles demo definitely seems better and relatively easier to explain than the rest.

Agreed. I'm fairy sure we can also change it up so some of the really out there stuff is easier, like only doing one color, or having it cycle through an array of color name strings.

@KartikTalwar You interested in teaching as well, or just simplifying it?

[KartikTalwar]

like only doing one color, or having it cycle through an array of color name strings.

Exactly! I'm not certain at this point about being fully able to attend the session on the 2nd. I'm registered for this all weekend hackathon that starts around the same time. I can definitely do the writeup (readme walkthrough, code, simplification etc) but someone would have to relay it on stage.

I might be able to show up for a while but won't know for sure until the weekend of.

[cameronmcefee]

No problem. I'm sure someone is down to teach, and I can do it if no one wants to.

[KartikTalwar]

Awesome. I'll start working on it.

[brntbeer]

Amazing. Thank you @KartikTalwar

[broccolini]

I would volunteer to teach but I've not ever done anything in d3.js so that's probably a bad idea. I'll be there to help coach though.... ideally would be good to have a look at the lesson plan when it's ready as these kids are fast and I want to make sure I can be helpful!

[KartikTalwar]

Sorry for the delay guys. Haven't forgotten about this. I'm preparing the slides/walkthrough. Hopefully will have things ready for review by tomorrow night. Tried my best to keep it very straightforward.

[cameronmcefee]

I just remembered I'm supposed to be at a wedding related event this weekend. Is there any chance one of you is available to teach this one?

[KartikTalwar]

So I'm almost finished with the slides and would at this point, like you guys to review it and make any necessary changes. I tried to make it like a powerpoint where whoever is presenting can read it off the screen without any extensive knowledge of D3.js

To view the file, just install the GistDeck bookmarklet, visit this gist and click the bookmarklet. https://gist.github.com/KartikTalwar/5055922

You might notice things/concepts used in weird ways but I did that to keep the focus on animation and keeping things simple. After someone looks at this, I'll post the checkpoints from the slide as html files.

[cameronmcefee]

That looks :fire:. Love it. Not to :trollface: too hard, but what if we killed the semicolons completely? They're not technically relavent, and are potentially something the kids will get hung up on typing.

I love that you have the final product in a Fiddle. I kind of almost want to just do the whole lesson in a Fiddle. Then the kids don't even have to download an editor. They could just download chrome and go to a url. Granted, they don't get the experience of structuring an html document, but that's not really the point of the lesson.

Proposal: We start the lesson with a quick explanation like "We're going to be doing Javascript today. Here's what the page would look like. See the javascript link tag? […] But we're not going to deal with that stuff today. We just want to write the interesting stuff. Please go to http://jsfiddle.net/"

[brntbeer]

Just using fiddle would be rad if we still get results. Add "put in an HTML document" as homework.

@kartiktalwar, are you not leading this lesson? Maybe I'm confused with @cameronmcefee mentioning not being here to teach

[cameronmcefee]

@brntbeer:

I'm registered for this all weekend hackathon that starts around the same time. I can definitely do the writeup (readme walkthrough, code, simplification etc) but someone would have to relay it on stage.

[KartikTalwar]

@cameronmcefee Nice! I do like the idea of making it all in jsfiddle and then we can assign 'convert to HTML' as homework like @brntbeer suggested. The only reason I made this like a slideshow was because if we code live, people always get confused copying down the lines/lose track (hence the 'preview' slides after code blocks). I think it would still be a good mashup if I change the readme to use fiddle completely. What do you guys think?

[cameronmcefee]

Flipping through Fiddles could be cool, though on the projector it may be hard to read the code, though it may be fine if we just zoom the browser in. I think your slide format could work fine if you don't want to deal with converting everything over. We just have the kids use the Fiddle as the place for the development, and still teach from the slides.

I could go either way.

[KartikTalwar]

@cameronmcefee Yeah that sounds good to me. I'll update the slides tonight to use the fiddle. We can just use the slide for them to write down blocks of code and then switch to fiddle after they are all on the same page.

[brntbeer]

Tried to reply via email. Sorry i didnt get to re-read the thread to see that people couldn't teach.

Who's up for teaching this? what's our mentor list look like? @jonmagic @nrrrdcore @kneath ?

[jonmagic]

I'm up for it. I'll dig in tomorrow.

On Thursday, February 28, 2013 at 18:15, Brent Beer wrote:

Tried to reply via email. Sorry i didnt get to re-read the thread to see that people couldn't teach. Who's up for teaching this? what's our mentor list look like? @jonmagic (https://github.com/jonmagic) @nrrrdcore (https://github.com/nrrrdcore) @kneath (https://github.com/kneath) ?

— Reply to this email directly or view it on GitHub (https://github.com/CoderDojoSF/Lesson-Plans/issues/5#issuecomment-14269905).

[brntbeer]

dear @jonmagic:

[KartikTalwar]

@brntbeer ^ lol nice! @jonmagic I changed it to use fiddle completely and have updated the README in the repo and gist for the slideshow (via gistdeck). Feel free to review it and/or make any changes. There is a link to the JSFiddle under the preview image for each checkpoint.

https://gist.github.com/KartikTalwar/5055922

Let me know if you have any questions

[jonmagic]

The plan looks great. I'll do a run through in the morning before dojo starts. Thanks!

On Friday, March 1, 2013 at 9:52 AM, Kartik Talwar wrote:

@brntbeer (https://github.com/brntbeer) ^ lol nice! @jonmagic (https://github.com/jonmagic) I changed it to use fiddle completely and have updated the README in the repo and gist for the slideshow (via gistdeck). Feel free to review it and/or make any changes. There is a link to the JSFiddle under the preview image for each checkpoint.
https://gist.github.com/KartikTalwar/5055922 Let me know if you have any questions

— Reply to this email directly or view it on GitHub (https://github.com/CoderDojoSF/Lesson-Plans/issues/5#issuecomment-14302010).

[KartikTalwar]

@jonmagic you're welcome! If you have any questions tomorrow, I should be able to reply back immediately here.

[broccolini]

I was going to come today but I am coughing my guts up so no go sorry :(

[jonmagic]

@KartikTalwar thank you for the lesson, it went really well I think. Was really exciting to see everyone adding their own special touch to the animations.

Thank you for the opportunity, will do again!

[KartikTalwar]

@jonmagic awesome! glad to know it worked out nicely!