knowuh · frankenbits · Jan 30, 2016 · Jan 30, 2016 · Jan 30, 2016 · Jan 31, 2016
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,10 @@
 .idea/
 twitter_config.json
+node_modules
+
+03/js/survey.js
+
+xiaoyunver/ps-03/vendor/jquery.min.js
+*_config.json
+*.pyc
+twitter/client/
diff --git a/.idea/.name b/.idea/.name
diff --git a/.idea/workspace.xml b/.idea/workspace.xml
diff --git a/01/index.html b/01/index.html
@@ -2,160 +2,165 @@
 <html class="no-js" lang="">
 
 <head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-  <title>First Day: Hello</title>
-  <meta name="description" content="First day of IDV studio 2">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-
-  <link rel="apple-touch-icon" href="template/img/apple-touch-icon.png">
-  <link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700' rel='stylesheet' type='text/css'>
-  <link href='https://fonts.googleapis.com/css?family=Raleway:400' rel='stylesheet' type='text/css'>
-  <link rel="stylesheet" href="../css/normalize.min.css">
-  <link rel="stylesheet" href="../css/boilerplate.css">
-  <link rel="stylesheet" href="../css/main.css">
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <title>IDV Studio 2</title>
+    <meta name="description" content="">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="apple-touch-icon" href="./img/apple-touch-icon.png">
+    <link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700' rel='stylesheet' type='text/css'>
+    <link href='https://fonts.googleapis.com/css?family=Raleway:400' rel='stylesheet' type='text/css'>
+    <link rel="stylesheet" href="../css/normalize.min.css">
+    <link rel="stylesheet" href="../css/boilerplate.css">
+    <link rel="stylesheet" href="../css/main.css">
+    <script src="../js/vendor/jquery.min.js"></script>
+    <script src="../js/solutions.js"></script>
 </head>
 
 <body>
-  <div class="fixed-width">
-    <h1 id="class-01-">Class 01:</h1>
-    <h2 id="materials-">Materials:</h2>
-    <ul>
-    <li>Pencils, index cards, sharpie, clip, stickers.</li>
-    <li>Handout: <a href="http://www.aiga.org/how-to-survive-a-critique/">how to survive a critique</a></li>
-    <li>Handout: <a href="../ps-guide.html">Problem set guide</a></li>
-    <li>Handout: <a href="./ps01.html">Problem set 1</a></li>
-    </ul>
-    <h2 id="intro-">Intro:</h2>
-    <p>We are here to get to know each other, review the syllabus, talk about
-    our goals for this class, build a good culture, and get setup with the tools
-    we need to participate in this class. I hope to learn your names.</p>
-    <h2 id="social-guidelines">Social guidelines</h2>
-    <ul>
-    <li>Fear &amp; imposter syndrome.</li>
-    <li>Grow your peers.</li>
-    <li>Your destinies are linked.</li>
-    <li>Tone matters. Be critical. Be empathetic.</li>
-    <li>Assume good intentions.</li>
-    <li>Honor questions.</li>
-    <li>We won&#39;t know all the answers.</li>
-    <li>Review key points in <a href="https://www.recurse.com/manual#sub-sec-social-rules">Social rules for learning</a></li>
-    </ul>
-    <h2 id="question-time-15m-">Question time: (15m)</h2>
-    <ul>
-    <li>Backgrounds; who is from fine art, design, computation, or other?</li>
-    <li>Student goals and expectations for studio 2, and and the Information Design and Visualization program.</li>
-    <li>Gauge interest level and existing experience with: Web development, Processing, D3, SVG, design, programming, critique, statistics, JSON, design process.</li>
-    <li>Other interests design, research, or technical experience?</li>
-    <li>Complete <a href="https://docs.google.com/forms/d/1RvLaAHinst8UhbfZqr30kelJFN9M1W9uPuzJnMmhacg/viewform">online survey</a></li>
-    <li>Look at <a href="survey.html">survey results</a></li>
-    </ul>
-    <h2 id="your-coach-10m-">Your coach (10m)</h2>
-    <ul>
-    <li>Fine art Background, and computer interest from early age<ul>
-    <li>Mom</li>
-    <li>Punch cards</li>
-    <li>Photography</li>
-    </ul>
-    </li>
-    <li>MassArt<ul>
-    <li>SIM / Video</li>
-    <li>Walls</li>
-    <li>ICA</li>
-    </ul>
-    </li>
-    <li>Web crazed 90&#39;s and $$</li>
-    <li>MIT Media Lab / John Maeda</li>
-    <li>SNiF</li>
-    <li>Current Work life</li>
-    <li>Printing</li>
-    <li>Memory Issues</li>
-    </ul>
-    <h2 id="personal-data-index-cards-15m-">Personal data index cards (15m)</h2>
-    <ul>
-    <li>Help me learn your names, interests, talents.</li>
-    <li>I am visual learner, show me who you are.</li>
-    <li>This should be &quot;functional&quot;.</li>
-    <li>12 minutes to work.</li>
-    <li>Present one index card.</li>
-    </ul>
-    <h2 id="discuss-data-cards-15m-">Discuss Data Cards (15m)</h2>
-    <h2 id="break-15m-">Break (15m)</h2>
-    <h2 id="work-expectations">Work expectations</h2>
-    <ul>
-    <li>We do the dishes.</li>
-    <li>We are experimenting, and taking risks.</li>
-    <li>The cadence of failure.</li>
-    <li>The secret of photography.</li>
-    <li>Sketch everything.</li>
-    <li>Cheating when possible.</li>
-    <li>Stealing with respect.</li>
-    <li>Frame one thing.</li>
-    <li><a href="https://en.wikipedia.org/wiki/Kaizen">Kaizen</a>.</li>
-    <li>Free gym membership.</li>
-    <li>Super Hero.</li>
-    </ul>
-    <h2 id="how-problem-sets-work-">How problem sets work.</h2>
-    <ul>
-    <li>Lets review <a href="../ps-guide.html">the problem set guide</a></li>
-    </ul>
-    <h2 id="lecture-git-github-assignment-submission-">Lecture: Git, github, assignment submission.</h2>
-    <ul>
-    <li>gauge: shell, editors, git, github, versioning tools.</li>
-    <li>git theory</li>
-    <li>git practice<ul>
-    <li>with github desktop client<ul>
-    <li>checkout</li>
-    <li>pull</li>
-    <li>branch</li>
-    <li>commit</li>
-    <li>pull request</li>
-    </ul>
-    </li>
-    <li>from the shell<ul>
-    <li>checkout</li>
-    <li>pull</li>
-    <li>branch</li>
-    <li>commit</li>
-    <li>pull request</li>
-    </ul>
-    </li>
-    </ul>
-    </li>
-    </ul>
-    <h2 id="coach-does-a-simple-first-pass-on-ps1">Coach does a simple first pass on PS1</h2>
-    <ul>
-    <li>brackets &amp;etc</li>
-    <li>make folder</li>
-    <li>hello world example</li>
-    </ul>
-    <h2 id="students-work-together-to-setup">Students work together to setup</h2>
-    <ul>
-    <li>Windows: mostly follow this <a href="http://blog.teamtreehouse.com/install-node-js-npm-windows">guide to installing node</a><ul>
-    <li><a href="https://www.google.com/chrome/browser/desktop/">chrome</a></li>
-    <li><a href="https://www.cygwin.com/">Cygwin</a></li>
-    <li><a href="https://windows.github.com/">Github desktop</a></li>
-    <li><a href="http://brackets.io/">brackets editor</a></li>
-    <li>options for later<ul>
-    <li><a href="https://atom.io/">atom editor</a> (optional, any editor will do)</li>
-    <li><a href="https://nodejs.org/en/">node &amp; npm</a></li>
-    <li><code>npm install -g live-server</code></li>
-    </ul>
-    </li>
-    </ul>
-    </li>
-    <li>OSX:<ul>
-    <li><a href="https://www.google.com/chrome/browser/desktop/">chrome</a></li>
-    <li><a href="https://desktop.github.com/">Github desktop</a></li>
-    <li><a href="http://brackets.io/">brackets editor</a></li>
-    <li>options for later<ul>
-    <li><a href="https://atom.io/">atom editor</a> (optional, any editor will do)</li>
-    <li><a href="https://nodejs.org/en/">node &amp; npm</a></li>
-    <li><code>npm install -g live-server</code></li>
-    </ul>
-    </li>
-    </ul>
-    </li>
-    </ul></div>
+    <div class="fixed-width">
+        <h1 id="class-01-">Class 01:</h1>
+<h2 id="materials-">Materials:</h2>
+<ul>
+<li>Pencils, index cards, sharpie, clip, stickers.</li>
+<li>Handout: <a href="http://www.aiga.org/how-to-survive-a-critique/">how to survive a critique</a></li>
+<li>Handout: <a href="../ps-guide.html">Problem set guide</a></li>
+<li>Handout: <a href="./ps01.html">Problem set 1</a></li>
+</ul>
+<h2 id="intro-">Intro:</h2>
+<p>We are here to get to know each other, review the syllabus, talk about
+our goals for this class, build a good culture, and get setup with the tools
+we need to participate in this class. I hope to learn your names.</p>
+<h2 id="social-guidelines">Social guidelines</h2>
+<ul>
+<li>Fear &amp; imposter syndrome.</li>
+<li>Grow your peers.</li>
+<li>Your destinies are linked.</li>
+<li>Tone matters. Be critical. Be empathetic.</li>
+<li>Assume good intentions.</li>
+<li>Honor questions.</li>
+<li>We won&#39;t know all the answers.</li>
+<li>Review key points in <a href="https://www.recurse.com/manual#sub-sec-social-rules">Social rules for learning</a></li>
+</ul>
+<h2 id="question-time-15m-">Question time: (15m)</h2>
+<ul>
+<li>Backgrounds; who is from fine art, design, computation, or other?</li>
+<li>Student goals and expectations for studio 2, and and the Information Design and Visualization program.</li>
+<li>Gauge interest level and existing experience with: Web development, Processing, D3, SVG, design, programming, critique, statistics, JSON, design process.</li>
+<li>Other interests design, research, or technical experience?</li>
+<li>Complete <a href="https://docs.google.com/forms/d/1RvLaAHinst8UhbfZqr30kelJFN9M1W9uPuzJnMmhacg/viewform">online survey</a></li>
+<li>Look at <a href="survey.html">survey results</a></li>
+</ul>
+<h2 id="your-coach-10m-">Your coach (10m)</h2>
+<ul>
+<li>Fine art Background, and computer interest from early age<ul>
+<li>Mom</li>
+<li>Punch cards</li>
+<li>Photography</li>
+</ul>
+</li>
+<li>MassArt<ul>
+<li>SIM / Video</li>
+<li>Walls</li>
+<li>ICA</li>
+</ul>
+</li>
+<li>Web crazed 90&#39;s and $$</li>
+<li>MIT Media Lab / John Maeda</li>
+<li>SNiF</li>
+<li>Current Work life</li>
+<li>Printing</li>
+<li>Memory Issues</li>
+</ul>
+<h2 id="personal-data-index-cards-15m-">Personal data index cards (15m)</h2>
+<ul>
+<li>Help me learn your names, interests, talents.</li>
+<li>I am visual learner, show me who you are.</li>
+<li>This should be &quot;functional&quot;.</li>
+<li>12 minutes to work.</li>
+<li>Present one index card.</li>
+</ul>
+<h2 id="discuss-data-cards-15m-">Discuss Data Cards (15m)</h2>
+<h2 id="break-15m-">Break (15m)</h2>
+<h2 id="work-expectations">Work expectations</h2>
+<ul>
+<li>We do the dishes.</li>
+<li>We are experimenting, and taking risks.</li>
+<li>The cadence of failure.</li>
+<li>The secret of photography.</li>
+<li>Sketch everything.</li>
+<li>Cheating when possible.</li>
+<li>Stealing with respect.</li>
+<li>Frame one thing.</li>
+<li><a href="https://en.wikipedia.org/wiki/Kaizen">Kaizen</a>.</li>
+<li>Free gym membership.</li>
+<li>Super Hero.</li>
+</ul>
+<h2 id="how-problem-sets-work-">How problem sets work.</h2>
+<ul>
+<li>Lets review <a href="../ps-guide.html">the problem set guide</a></li>
+</ul>
+<h2 id="lecture-git-github-assignment-submission-">Lecture: Git, github, assignment submission.</h2>
+<ul>
+<li>gauge: shell, editors, git, github, versioning tools.</li>
+<li>git theory</li>
+<li>git practice<ul>
+<li>with github desktop client<ul>
+<li>checkout</li>
+<li>pull</li>
+<li>branch</li>
+<li>commit</li>
+<li>pull request</li>
+</ul>
+</li>
+<li>from the shell<ul>
+<li>checkout</li>
+<li>pull</li>
+<li>branch</li>
+<li>commit</li>
+<li>pull request</li>
+</ul>
+</li>
+</ul>
+</li>
+</ul>
+<h2 id="coach-does-a-simple-first-pass-on-ps1">Coach does a simple first pass on PS1</h2>
+<ul>
+<li>brackets &amp;etc</li>
+<li>make folder</li>
+<li>hello world example</li>
+</ul>
+<h2 id="students-work-together-to-setup">Students work together to setup</h2>
+<ul>
+<li>Windows: mostly follow this <a href="http://blog.teamtreehouse.com/install-node-js-npm-windows">guide to installing node</a><ul>
+<li><a href="https://www.google.com/chrome/browser/desktop/">chrome</a></li>
+<li><a href="https://www.cygwin.com/">Cygwin</a></li>
+<li><a href="https://windows.github.com/">Github desktop</a></li>
+<li><a href="http://brackets.io/">brackets editor</a></li>
+<li>options for later<ul>
+<li><a href="https://atom.io/">atom editor</a> (optional, any editor will do)</li>
+<li><a href="https://nodejs.org/en/">node &amp; npm</a></li>
+<li><code>npm install -g live-server</code></li>
+</ul>
+</li>
+</ul>
+</li>
+<li>OSX:<ul>
+<li><a href="https://www.google.com/chrome/browser/desktop/">chrome</a></li>
+<li><a href="https://desktop.github.com/">Github desktop</a></li>
+<li><a href="http://brackets.io/">brackets editor</a></li>
+<li>options for later<ul>
+<li><a href="https://atom.io/">atom editor</a> (optional, any editor will do)</li>
+<li><a href="https://nodejs.org/en/">node &amp; npm</a></li>
+<li><code>npm install -g live-server</code></li>
+</ul>
+</li>
+</ul>
+</li>
+</ul>
+
+        <div id="dynamic-content"></div>
+    </div>
 </body>
-</html>
+
+</html>
diff --git a/01/js/solutions.js b/01/js/solutions.js