The goal is to introduce programming for the web. This is a broad concept, so specifically we will look at how to make a web app using only the client side browser (i.e chrome on a personal laptop). The technologies we will use to do this:
html: http://www.w3schools.com/html/default.asp & https://developer.mozilla.org/en-US/docs/Web/HTML
css: http://www.w3schools.com/css/default.asp & https://developer.mozilla.org/en-US/docs/Web/CSS/Reference
bootstrap: http://getbootstrap.com/
javascript: https://developer.mozilla.org/en-US/docs/Web/JavaScript & http://eloquentjavascript.net/ & http://dorey.github.io/JavaScript-Equality-Table/
angular: https://angularjs.org/
Roughly speaking, html, css, and bootstrap are visual components that an end user actually sees, whereas javascript and angular are logical components that allow devs to make a website dynamic by changing the visual components based on user interaction.
This course is also an introduction to programming in general with the above as our vehicle. A few things that may be useful for those of you that have little or no experience with programming:
- Get comfortable with not knowing certain things (nobody is expected to know
every html tag, for instance, devs often look them up).
- Also, during this course I will always admit when I don't know something, expect that to happen a lot!
- Get comfortable looking things up (how to word things in a google search, using stack overflow, reading documentation, etc.).
- Despite the above, don't be afraid to ask! Sometimes you may be looking for something on google you aren't even sure how to phrase.
Slack Channel: okcokcoders.slack.com An API we will use: http://data.worldbank.org/developers/api-overview?display=
the terminal: http://linuxcommand.org/tlcl.php
lodash: https://lodash.com/
angular style guide: https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md
nasa api: https://api.nasa.gov/api.html#earth
<tr>
<th colspan="3" align="left">Week 2</th>
</tr>
<tr>
<td>2.1</td>
<td>CSS: Introduction</td>
<td>JavaScript: Control Flow</td>
</tr>
<tr>
<td>2.2</td>
<td>CSS: Advanced</td>
<td>JavaScript: Functions</td>
</tr>
<tr>
<th colspan="3" align="left">Week 3</th>
</tr>
<tr>
<td>3.1</td>
<td>Twitter Bootstrap: Introduction</td>
<td>JavaScript: Review</td>
</tr>
<tr>
<td>3.2</td>
<td>Twitter Bootstrap: Advanced</td>
<td>JavaScript: Data Structures</td>
</tr>
<tr>
<th colspan="3" align="left">Week 4</th>
</tr>
<tr>
<td>4.1</td>
<td>Command Line</td>
<td>Javascript: Functional</td>
</tr>
<tr>
<td>4.2</td>
<td>Node</td>
<td>Javascript: Functional</td>
</tr>
<tr>
<th colspan="3" align="left">Week 5</th>
</tr>
<tr>
<td>5.1</td>
<td>Angular: Introduction</td>
<td>MVC: Model-View-Controller</td>
</tr>
<tr>
<td>5.2</td>
<td>Angular: Controllers</td>
<td>HTTP</td>
</tr>
<tr>
<th colspan="3" align="left">Week 6</th>
</tr>
<tr>
<td>6.1</td>
<td>Angular: Resources</td>
<td>SPA (Single Page Applications): Ajax</td>
</tr>
<tr>
<td>6.2</td>
<td>Routing</td>
<td>Angular: Route Configuration</td>
</tr>
<tr>
<th colspan="3" align="left">Week 7</th>
</tr>
<tr>
<td>7.1</td>
<td>Angular: Services</td>
<td>$q: Callback Chaining</td>
</tr>
<tr>
<td>7.2</td>
<td>Angular: Directives</td>
</tr>
<tr>
<th colspan="3" align="left">Week 8</th>
</tr>
<tr>
<td>8.1</td>
<td>Angular: Forms</td>
<td>Angular: Filters</td>
</tr>
<tr>
<td>8.2</td>
<td>The Full Thing</td>
</tr>
</tbody>
Week 1 | First Hour | Second Hour |
---|---|---|
1.1 | HTML: Introduction | JavaScript: Introduction to Programming |
1.2 | HTML: Why do we need markup? Tables and Forms | JavaScript: Variables and Data; A prompting program |