├── AttendancePolicy.md ├── CourseOutline.md ├── GradingPolicy.md ├── Resources.md ├── Roster.md ├── finalprojects.md ├── prework.md ├── readme.md └── todo.md /AttendancePolicy.md: -------------------------------------------------------------------------------- 1 | * Attendance code will be given at 8:00pm 2 | * Then it is up to you to make the most of your class time or not. 3 | -------------------------------------------------------------------------------- /CourseOutline.md: -------------------------------------------------------------------------------- 1 | 2 | - __Notes__: 3 | + Tentative calendar (weekly topics), subject to changes depending on 4 | the pace of the course. 5 | + Notes (:file_folder:) involves material discussed in class. 6 | + Reading (:book:) involves material that expands lecture topics, as well as coding examples that you should practice on your own. 7 | + Misc (:newspaper:) is supporting material that is worth taking a look at. 8 | 9 | 10 | ----- 11 | 12 | 13 | | |||| 14 | | ------------- |-------------| -----|------| 15 | | [Day 1. Intro](#day1) | [Day 6. Servers](#day6) | [Day 11. Authentication ](#day11) |[Day 16. react-redux](#day16) 16 | | [Day 2. Software Systems](#day2)| [Day 7. Express](#day7) | [Day 12. React II ](#day12) |[Day 17. react-redux II ](#day17) 17 | | [Day 3. Modules](#day3) | [Day 8. MVC](#day8) | [Day 13. React III](#day13) |[Day 18. Client Side Routing](#day18) 18 | | [Day 4. Debugging](#day4) | [Day 9. MongoDB](#day9) | [Day 14. Webpack](#day14) |[Day 19. Authentication](#day19) 19 | | [Day 5. The Internet ](#day5) | [Day 10. Mongoose](#day10) | [Day 15. Redux ](#day15) |[Day 20. Deployment](#day20) 20 | |||| 21 | 22 | 23 | ## Day 1. Intro to Class 24 | - :file_folder: __Notes__: 25 | + [Notes](https://gist.github.com/jw56578/3e92c40701de2f0a440a5e8e27b03534) 26 | + [Intro](#intro) 27 | 28 | ----- 29 | ## Day 2. Software Systems 30 | - :file_folder: __Notes__: 31 | + [Notes](https://gist.github.com/jw56578/3654cbdd1bf573af9aac750e8731f320) 32 | + [Software Systems](#softwaresystems) 33 | 34 | ----- 35 | ## Day 3. Debugging 36 | - :file_folder: __Notes__: 37 | + [Notes](https://gist.github.com/jw56578/1e0ca3a254687e067b91431fd0cb7c91) 38 | + [Debugging](#debugging) 39 | ----- 40 | ## Day 4. npm 41 | - :file_folder: __Notes__: 42 | + [Notes](https://gist.github.com/jw56578/018c9a8654f8666cddf3b9e9e8bb8964) 43 | + [npm](#npm) 44 | 45 | ----- 46 | ## Day 5. The Internet 47 | - :file_folder: __Notes__: 48 | + [Notes](https://gist.github.com/jw56578/7c6c59a55b9a4a1744c4bba2103a3a11) 49 | 50 | 51 | ----- 52 | ## Day 6. Node Server 53 | - :file_folder: __Notes__: 54 | + [Notes](https://gist.github.com/jw56578/95bd7b05e3571e3908ee8e0695d775c1) 55 | + [Server II](#server2) 56 | 57 | 58 | ----- 59 | ## Day 7. Express 60 | - :file_folder: __Notes__: 61 | + [Notes](https://gist.github.com/jw56578/937836b7252665183013e0f5751c4957) 62 | + [Express](#server3) 63 | 64 | 65 | ----- 66 | 67 | ## Day 8. MVC 68 | - :file_folder: __Notes__: 69 | + [Notes](https://gist.github.com/jw56578/089b3cc1ccbeda8caf916192f437d467) 70 | + [Express](#mvc) 71 | 72 | 73 | ----- 74 | 75 | ## Day 9. MongoDB 76 | - :file_folder: __Notes__: 77 | + [Notes](https://gist.github.com/jw56578/c59c52ce0ad8cd4ea6ffb5660e30666a) 78 | + [MongoDB](#mongodb) 79 | 80 | ----- 81 | 82 | ## Day 10. Mongoose 83 | - :file_folder: __Notes__: 84 | + [Notes](https://gist.github.com/jw56578/6f9b5d30d04129c0ba1f63a2e263f65b) 85 | + [MongoDB](#mongodb) 86 | 87 | ----- 88 | ## Day 11. Authentication 89 | - :file_folder: __Notes__: 90 | + [Notes](https://gist.github.com/jw56578/2bf5e0fef752bf3884d6916d1020a22d) 91 | + [Authentication](#authentication) 92 | ----- 93 | 94 | ## Day 12. React 95 | - :file_folder: __Notes__: 96 | + [Notes](https://gist.github.com/jw56578/2f6eadf5bac3f90b102e67a5c97f33f9) 97 | + [React](#react) 98 | ----- 99 | 100 | ## Day 13. React II 101 | - :file_folder: __Notes__: 102 | + [Notes](https://gist.github.com/jw56578/a1c47c1dc111900b8c4891c9c0a11ae9) 103 | + [React](#react2) 104 | ----- 105 | 106 | ## Day 14. React III 107 | - :file_folder: __Notes__: 108 | + [Notes](https://gist.github.com/jw56578/be26d758fe130237176f9c5c0bb38ad0) 109 | + [React](#react3) 110 | ----- 111 | ## Day 15. Webpack/create-react-app 112 | - :file_folder: __Notes__: 113 | + [Notes](https://gist.github.com/jw56578/5e8ab4ba1ad3e60f613bb60e3ac14193) 114 | + [Webpack](#webpack) 115 | ----- 116 | ## Day 16. Redux 117 | - :file_folder: __Notes__: 118 | + [Notes](https://gist.github.com/jw56578/c0943055ed5ebc06bd131252d3d0391e) 119 | + [redux](#redux) 120 | ----- 121 | ## Day 17. React Redux 122 | - :file_folder: __Notes__: 123 | + [Notes](https://gist.github.com/jw56578/21233e46a39f434d6cb63a84344960aa) 124 | + [redux](#redux) 125 | ----- 126 | ## Day 18. React Redux Actions 127 | - :file_folder: __Notes__: 128 | + [Notes](https://gist.github.com/jw56578/4ace42830072c7c9f8290f38e8131a29) 129 | + [redux](#redux) 130 | ----- 131 | ## Day 19. Client Side Routing 132 | - :file_folder: __Notes__: 133 | + [Notes](https://gist.github.com/jw56578/838eb54eed02a88797d7181f5fbfb403) 134 | + [Testing](#testing) 135 | 136 | ----- 137 | ## Day 20. Deployment 138 | - :file_folder: __Notes__: 139 | + [Notes](https://gist.github.com/jw56578/a974ba41802549ce4d55233ed7198c4b) 140 | + [Heroku](#heroku) 141 | ----- 142 | 143 | 144 | ## Build an eCommerce Site 145 | 146 | - :paperclip: __Topics__: Let's build an ecommerce site from scratch 147 | - :file_folder: __Notes__: 148 | + [Step by Step](https://docs.google.com/presentation/d/1F7GrV06KAhUa-jyZOoRk21AHXDg039iTeOORn6CvuZc/edit#slide=id.p) 149 | - :newspaper: __Misc__: 150 | + [ACA Inventory](https://docs.google.com/spreadsheets/d/1WqUXFDqjWaS9hbIWnzGzNwAVhxHJM--4HbVb-O0lNDk/edit#gid=0) 151 | - :speaker: __To Do__: 152 | + [ACA Store](https://github.com/AustinCodingAcademy/aca-store) 153 | ----- 154 | 155 | 156 | ## MVC 157 | - :paperclip: __Topics__: Programming patterns. MVC Pattern. Using MVC in our own server. 158 | - :file_folder: __Notes__: 159 | + [Notes](https://gist.github.com/jw56578/91835f18580364fb1c3755230fe040b0) 160 | + [MVC](https://docs.google.com/presentation/d/1XNYD0XU26a8zCApeiXvoUnJdY_Ur5A_9WOTxUQuq5QY/edit#slide=id.p) 161 | + [Express Step by Step](https://docs.google.com/presentation/d/11NrFEVHnkXfWUKF7VUwpMv-JkTX9ybXL6pEv6DecPoM/edit#slide=id.p) 162 | + [Express Checklist Controllers](https://docs.google.com/presentation/d/1pNOnAEtE9X7vfoC5i-bINiao6j80i4x6bfocVZ3DtNw/edit#slide=id.g2ad7342cfc_0_34) 163 | - :book: __Reading__: 164 | + [MVC](https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller) 165 | + [MVC Analogy](https://medium.freecodecamp.org/model-view-controller-mvc-explained-through-ordering-drinks-at-the-bar-efcba6255053) 166 | + [Express Routes and Controllers](https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/routes) 167 | + [MIWMIRMIF](http://wiki.c2.com/?MakeItWorkMakeItRightMakeItFast) 168 | - :microscope: __Lab__: 169 | + [Express Practice](https://github.com/AustinCodingAcademy/advanced-express-practice) 170 | + [ACA Chat](https://github.com/AustinCodingAcademy/aca-chat) 171 | - :video_camera: __Videos__ 172 | + [MVC](https://www.youtube.com/results?search_query=mvc) 173 | - :bulb: __Cheat sheet__: 174 | + [Express](https://github.com/azat-co/cheatsheets/tree/master/express4) 175 | - :speaker: __To Do__: 176 | + Express Practice Part 2,3 and 4 177 | + [Sign up for MLab](https://mlab.com/) 178 | ----- 179 | ## Lab 180 | - :paperclip: __Topics__: Let's use what we have learned with node and express to build some real life applications. 181 | - :file_folder: __Notes__: 182 | + [Notes](https://gist.github.com/jw56578/089b3cc1ccbeda8caf916192f437d467) 183 | - :speaker: __To Do__: 184 | + [ACA Chat](https://github.com/AustinCodingAcademy/aca-chat) 185 | + [ACA Tracker](https://github.com/AustinCodingAcademy/aca-tracker) 186 | ----- 187 | ## Database with Mongo DB 188 | - :paperclip: __Topics__: Why do we use databases. Which database should we use? Let's setup a database. 189 | - :file_folder: __Notes__: 190 | + [MongoDB](https://docs.google.com/presentation/d/1ZE9h-6OSI1s05435k_Y20YhIH7FHt8vA2T8UwC8K8Ec) (slides) 191 | + [Setup MongoDB](https://docs.google.com/presentation/d/1a3rOm5ffQBAODF6oGm0LknLoHnj_XTi2M5DYTA4834A/edit#slide=id.p) 192 | + [Mongodb Atlas](https://docs.google.com/presentation/d/1BOKyoHiiU9PrsTWVvjNWu1x9TxYLU7QbB5dXutuFNSk/edit#slide=id.p) 193 | - :book: __Reading__: 194 | + [Why databases](http://www.softwaretestingclass.com/what-is-database-and-why-do-we-need-them/) 195 | + [Mongodb.com](https://www.mongodb.com/) 196 | + [Document databases](https://en.wikipedia.org/wiki/Document-oriented_database) 197 | - :microscope: __Lab__: 198 | + [Setup MongoDB](https://docs.google.com/presentation/d/1a3rOm5ffQBAODF6oGm0LknLoHnj_XTi2M5DYTA4834A/edit#slide=id.p) 199 | - :newspaper: __Misc__: 200 | + [MLab](https://mlab.com/) 201 | + [Install Robo 3T](https://robomongo.org/) 202 | + [DB vs File System](https://youtu.be/5t0Y13AkWgc) 203 | - :video_camera: __Videos__ 204 | + [MongoDB Video](https://youtu.be/_W1c5xPz-QE) 205 | + [Install MongoDB Video](https://youtu.be/tO34_wrkZ3Q) 206 | + [Setup MLab Video](https://youtu.be/BWKaoCUdlBo) 207 | - :bulb: __Cheat sheet__: 208 | + [MongoDB and Mongoose](https://github.com/azat-co/cheatsheets/blob/master/mongodb-mongoose/readme.md) 209 | - :speaker: __To Do__: 210 | + [Express Practice](https://github.com/AustinCodingAcademy/advanced-express-practice) 211 | 212 | 213 | ----- 214 | ## Mongoose 215 | - :paperclip: __Topics__: How does our code talk to a database. How do you retrieve things from a database. How do you save things to a database. 216 | - :file_folder: __Notes__: 217 | + [Mongoose Step by Step](https://docs.google.com/presentation/d/1gLRkTjjj9xUxgwXVer_WYsQb_1TwBZWxq74ThXSlSoE/edit) 218 | - :book: __Reading__: 219 | + [MongooseJS](http://mongoosejs.com/docs/guide.html) 220 | - :newspaper: __Misc__: 221 | + [Mongoose](https://www.npmjs.com/package/mongoose) 222 | - :video_camera: __Videos__ 223 | - :bulb: __Cheat sheet__: 224 | + [MongoDB and Mongoose](https://github.com/azat-co/cheatsheets/blob/master/mongodb-mongoose/readme.md) 225 | - :speaker: __To Do__: 226 | + [Express Practice Part 4](https://github.com/AustinCodingAcademy/advanced-express-practice) 227 | 228 | ----- 229 | 230 | ## Checkpoint 1 231 | 232 | - :paperclip: __Topics__: Let's help out our front end co workers by building a back end service for them. 233 | - :speaker: __To Do__: 234 | + [Checkpoint 1](https://github.com/AustinCodingAcademy/checkpoint-backend-1) 235 | 236 | 237 | ----- 238 | 239 | ## React 240 | - :paperclip: __Topics__: React. Why do we use this tool. 241 | - :file_folder: __Notes__: 242 | + [React](https://docs.google.com/presentation/d/1Bj877oW04FA-bPxX9tgI7C6fY6mvJiLYP4VE_YJ-T6o/edit#slide=id.p) 243 | + [React Step by Step](https://docs.google.com/presentation/d/1q0mEzGOht31YNaNSetx6s5raQc02dts4xawCTTX21d8/edit#slide=id.p) (Slides) 244 | - :book: __Reading__: 245 | + [Why React](https://medium.freecodecamp.com/yes-react-is-taking-over-front-end-development-the-question-is-why-40837af8ab76) 246 | - :microscope: __Lab__: 247 | + [Twitter Clone](https://github.com/AustinCodingAcademy/advanced-twitter-clone) 248 | - :newspaper: __Misc__: 249 | + [React Dev Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) 250 | + [React npm](https://www.npmjs.com/package/react) 251 | - :video_camera: __Videos__ 252 | + [Video 1 - Intro to React 1](https://youtu.be/2_NrCK2SLvI) 253 | + [Video 2 - Intro to React 2](https://youtu.be/aChUw9WyP6w) 254 | + [Video 3 - Intro to React 3](https://youtu.be/CdCYk1WtqYE) 255 | + [Video 4 - React and Map](https://youtu.be/t-diOQsLLsI) 256 | + [React Tic Tac Toe](https://youtu.be/pTHCwUdGFkc) 257 | - :bulb: __Cheat sheet__: 258 | + [React](https://devhints.io/react) 259 | - :speaker: __To Do__: 260 | + [React Homework 1](https://github.com/AustinCodingAcademy/advanced-homework-1) 261 | + [Component Practice](https://github.com/AustinCodingAcademy/advanced-react-component-practice) 262 | + [Prop Practice Child/Parent](https://github.com/AustinCodingAcademy/advanced-prop-practice) 263 | + [Homework 1 Walkthrough](https://docs.google.com/presentation/d/1lOtXFSaYym8hRhUMfPnByXlLyz4ssUq16wm2RNQ4VJg/edit#slide=id.p) 264 | + [Prop Types](https://docs.google.com/presentation/d/1PPw8E0B3TTgXX927QWclm9sj3jsLnpxtVZE4HPYuMok/edit#slide=id.p) 265 | ----- 266 | ## More React 267 | - :paperclip: __Topics__: React. Let's cover some more aspects of React. 268 | - :file_folder: __Notes__: 269 | + [React Events](https://docs.google.com/presentation/d/1Bwkvfo4Txc_bn19vtncJBNejdBe8RtgWNq7foza9-kY/edit#slide=id.p) 270 | + [React State](https://docs.google.com/presentation/d/1wRDIQ8YobRhJqWZEIzj4WpVN1FI08zRSmZUDk49hWlk/edit#slide=id.p) 271 | + [React Component Communication](https://docs.google.com/presentation/d/1XYJGkY85HEwMNVzOjKMnJwuQOAfOeiyvFBtSKwt_XAw/edit#slide=id.p) 272 | 273 | - :speaker: __To Do__: 274 | + [React State Practice](https://github.com/AustinCodingAcademy/advanced-state-practice) 275 | + [React State Practice 2](https://github.com/AustinCodingAcademy/advanced-state-practice-2) 276 | + [Homework](https://github.com/AustinCodingAcademy/advanced-homework-2) 277 | 278 | ----- 279 | ## Even More React 280 | + [React Children](https://stackblitz.com/edit/react-kvzfvz) 281 | + Lifecycle Methods 282 | + [Slides](https://docs.google.com/presentation/d/1WK4REwcHcB_mD8qSQE8SexU27qzT3E8Zi-K3v143g3s/edit#slide=id.p) 283 | + [Example](https://stackblitz.com/edit/react-fk6jdc?file=index.js) 284 | + [Docs](https://reactjs.org/docs/react-component.html#componentdidmount) 285 | + HOC 286 | + [docs](https://reactjs.org/docs/higher-order-components.html) 287 | + [example](https://stackblitz.com/edit/react-mpbddt?file=index.js) 288 | + prop-types 289 | + [docs](https://reactjs.org/docs/typechecking-with-proptypes.html) 290 | + [example](https://stackblitz.com/edit/react-j68awp) 291 | + Conditional Rendering 292 | + [docs](https://reactjs.org/docs/conditional-rendering.html) 293 | + [example](https://stackblitz.com/edit/react-kz56q7) 294 | ## [New Features](https://reactjs.org/blog/2017/09/26/react-v16.0.html) 295 | + [Fragments](https://stackblitz.com/edit/react-ejyjfs) 296 | + [String Components](https://stackblitz.com/edit/react-ejyjfs) 297 | + New features. Research on your own. 298 | + componentDidCatch 299 | + Context API 300 | + Hooks 301 | + Suspense 302 | ----- 303 | ## Webpack 304 | - :paperclip: __Topics__: Why do we use this tool called webpack. 305 | - :file_folder: __Notes__: 306 | + [Webpack](https://docs.google.com/presentation/d/17TEXWgh2RJm6HSGxivtjIEs4DtVAT3OOmkxSKbscEpo/edit#slide=id.p) (Slides) 307 | + [Step by Step](https://docs.google.com/presentation/d/1FdGZ827uf6Y-Kn7jtr74B26SrBEP7njNKfFI9atdXkU/edit#slide=id.p) 308 | - :book: __Reading__: 309 | + [Docs](https://webpack.js.org/) 310 | - :microscope: __Lab__: 311 | - :newspaper: __Misc__: 312 | + [Webpack Package](https://www.npmjs.com/package/webpack) 313 | - :video_camera: __Videos__ 314 | + [Demo](https://youtu.be/deyxI-6C2u4) 315 | - :speaker: __To Do__: 316 | + [webpack-react-starter](https://github.com/AustinCodingAcademy/webpack-react-starter) 317 | ----- 318 | ## Create React App 319 | - :paperclip: __Topics__: Why do we use this tool called create-react-app. 320 | + [create-react-app](https://docs.google.com/presentation/d/1t_YW0fyOOOB29iiYNOg_x75GJ-q_rSradJ8miBEml1U/edit#slide=id.p) 321 | - :file_folder: __Notes__: 322 | + 323 | - :book: __Reading__: 324 | + [Docs](https://reactjs.org/docs/add-react-to-a-new-app.html) 325 | + [Setup](https://www.valentinog.com/blog/react-webpack-babel/) 326 | - :microscope: __Lab__: 327 | - :newspaper: __Misc__: 328 | + [Github](https://github.com/facebook/create-react-app) 329 | + [npm](https://www.npmjs.com/package/create-react-app) 330 | - :video_camera: __Videos__ 331 | + 332 | - :speaker: __To Do__: 333 | 334 | ----- 335 | 336 | ## create-react-app Projects 337 | - :speaker: __To Do__: 338 | + [Notes](https://gist.github.com/jw56578/1260ea1a06b042003e8f2611c8388b73) 339 | + [Component Practice](https://github.com/AustinCodingAcademy/advanced-react-component-practice) 340 | + [Prop Practice Child/Parent](https://github.com/AustinCodingAcademy/advanced-prop-practice) 341 | + [React eCommerce 1](https://github.com/AustinCodingAcademy/advanced-homework-1) 342 | + [React State Practice](https://github.com/AustinCodingAcademy/advanced-state-practice) 343 | + [React State Practice 2](https://github.com/AustinCodingAcademy/advanced-state-practice-2) 344 | + [React eCommerce 2](https://github.com/AustinCodingAcademy/advanced-homework-2) 345 | + Extra Credit 346 | * [Hangman Game](https://github.com/AustinCodingAcademy/advanced-hangman-game) 347 | * [Tic Tac Toe](https://github.com/AustinCodingAcademy/advanced-react-tictactoe) 348 | 349 | ----- 350 | 351 | ## Redux 352 | - :paperclip: __Topics__: Why does the software tool Redux exist. What are Redux reducers. How do we use Redux with React. 353 | - :file_folder: __Notes__: 354 | + [Redux](https://docs.google.com/presentation/d/1dHr0mVIaEyvxGvfaV6LTN1JZt0GHu2mAv1mvR1O49-M/edit#slide=id.p) (slides) 355 | + [Redux Checklist](https://docs.google.com/presentation/d/1sDE1TCNBflAhYwMz0ZIax-79Zh46L9zUdEW6fx9ookk/edit#slide=id.p) (slides) 356 | + [Redux Bank Analogy](https://docs.google.com/presentation/d/1lFbDzokiowkZttmnZWND5U2tizgcnjuZrJzmXVcTD8c/edit#slide=id.p) 357 | - :book: __Reading__: 358 | + [Redux Docs](https://redux.js.org/) 359 | + [Redux Source Code](https://github.com/reactjs/redux) 360 | + [Reducers](https://redux.js.org/docs/basics/Reducers.html) 361 | + [react-redux](https://github.com/reactjs/react-redux) 362 | + [Redux Explained](https://medium.freecodecamp.org/why-redux-makes-sense-to-me-and-how-i-conceptualize-it-c8a3a9db15ca) 363 | + [JS Default Parameters](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters) 364 | + [Shorthand Object Properties](https://dev.to/sarah_chima/enhanced-object-literals-in-es6-a9d) 365 | + [``](https://github.com/reactjs/react-redux/blob/master/src/components/Provider.js) 366 | - :microscope: __Lab__: 367 | + [Explain this error](https://stackblitz.com/edit/react-om655w) 368 | + Fork this project. Use the checklist to add redux to this simple app. 369 | - :newspaper: __Misc__: 370 | + [Screencast From Last Class](https://youtu.be/AsNAEy6vCm4) 371 | + [Demo Video](https://youtu.be/7kX4hPUJYCo) 372 | + [Redux on npm](https://www.npmjs.com/package/redux) 373 | + [20 Videos](https://learnredux.com/) 374 | + [Online course by the guy who created redux](https://egghead.io/courses/getting-started-with-redux) 375 | - :bulb: __Cheat sheet__: 376 | + [Redux](https://devhints.io/redux) 377 | - :speaker: __To Do__: 378 | + Lecture Slides 379 | + Do Lab 380 | + Use the checklist to complete the homework project 381 | + Project [Redux Reducers](https://github.com/AustinCodingAcademy/advanced-redux-practice) 382 | 383 | 384 | ----- 385 | 386 | ## Redux Actions 387 | - :paperclip: __Topics__: How do you change data in Redux. 388 | - :file_folder: __Notes__: 389 | + [Redux Checklist - Changing Data](https://docs.google.com/presentation/d/1sDE1TCNBflAhYwMz0ZIax-79Zh46L9zUdEW6fx9ookk/edit#slide=id.g28e5e7e858_0_507) (slides) 390 | + [Types of Components](https://docs.google.com/presentation/d/1SeoofqOpMdFc-C2bQpFounwGYXbYLJqvMEwFsgw0SeQ/edit#slide=id.g309b73ba6c_0_0) (slides) 391 | + [dispatch quasi source code](https://docs.google.com/presentation/d/1SeoofqOpMdFc-C2bQpFounwGYXbYLJqvMEwFsgw0SeQ/edit#slide=id.g21a03af546_0_0) 392 | - :book: __Reading__: 393 | + [Actions](https://redux.js.org/docs/basics/Actions.html) 394 | + [Presentational and Container Components](https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0) 395 | + [Immutable Update Patterns](https://redux.js.org/docs/recipes/reducers/ImmutableUpdatePatterns.html) 396 | + [dispatch source code](https://github.com/reactjs/redux/blob/master/src/createStore.js#L165) 397 | - :microscope: __Lab__: 398 | + [Let's Add a Tweet](https://stackblitz.com/edit/react-dgrd7w) 399 | - :newspaper: __Misc__: 400 | + [Screencast From Last Class](https://youtu.be/qTnGUsdrb4I) 401 | + [Demo Video](https://youtu.be/km17xRh9G14) 402 | - :bulb: __Cheat sheet__: 403 | + [Redux](https://devhints.io/redux) 404 | - :speaker: __To Do__: 405 | + Lab 406 | + [ redux action practice](https://github.com/AustinCodingAcademy/advanced-redux-actions-practice) 407 | 408 | ----- 409 | ## More Redux 410 | - Rules of reducers 411 | + [Slides](https://docs.google.com/presentation/d/1SeoofqOpMdFc-C2bQpFounwGYXbYLJqvMEwFsgw0SeQ/edit#slide=id.g21a03af546_0_142) (slides) 412 | - Stand alone containers 413 | + [Slides](https://docs.google.com/presentation/d/1sDE1TCNBflAhYwMz0ZIax-79Zh46L9zUdEW6fx9ookk/edit#slide=id.g28fe054e69_0_115) (slides) 414 | - Presentational vs Container Components 415 | + [Example](https://stackblitz.com/edit/react-3fr7wr?file=Messages.js) 416 | + [Slides](https://docs.google.com/presentation/d/1ICIKqoWBnt4d85dfFIQorMRzmSAmiGc4F0L5OBplZg4/edit#slide=id.p) 417 | ----- 418 | 419 | 420 | 421 | ## Client Side Routing 422 | - :paperclip: __Topics__: Discuss what a spa is and the pros and cons. How does client side routing make spa's better. Walkthrough how to use React Router by doing the project. 423 | - :file_folder: __Notes__: 424 | + [Client side routing](https://docs.google.com/presentation/d/1VQY_8NL12QVusNkxbgtNCxrIpmexudHO9OTOeJUpBNo/edit#slide=id.p) 425 | + [Checklist](https://docs.google.com/presentation/d/1CsJVP2K_AofkQIQYkeOtBBP9usSL65FniqKJhhJH334/edit#slide=id.p) 426 | - :book: __Reading__: 427 | + [Training](https://reacttraining.com/react-router/web/guides/quick-start) 428 | - :video_camera: __Videos__ 429 | + [Demo 1](https://youtu.be/_hmmh6mcebw) 430 | + [Demo 2](https://youtu.be/TP-BqSxPHUc) 431 | - :speaker: __To Do__: 432 | + [React Router Address Book](https://github.com/AustinCodingAcademy/advanced-react-router-address-book) 433 | + [React Router Practice](https://github.com/AustinCodingAcademy/advanced-react-router-practice) 434 | ----- 435 | 436 | 437 | 438 | ## Redux Review 439 | - :file_folder: __Notes__: 440 | + [Notes](https://gist.github.com/jw56578/521e0b87b52ec5e17c732ec778e76c67) 441 | + [Taking Notes](https://docs.google.com/presentation/d/16xHmfjdd4X6JQTwl-ynywczFG7LsEKWcxGuQe_TNYvw/edit#slide=id.p) 442 | + [Template](https://docs.google.com/document/d/1CN4YNgIt1z8mfZZnr7yZ1ltOe8NEDGCYyU0_ULLqKbw/edit) 443 | - :newspaper: __Misc__: 444 | + [Redux Dev Tools](https://github.com/zalmoxisus/redux-devtools-extension) 445 | 446 | 447 | ## Redux and Fetch 448 | - :paperclip: __Topics__: How do you use fetch with Redux. By default you cannot. We need to use another tool. What is that tool? 449 | - :file_folder: __Notes__: 450 | + [Notes](https://gist.github.com/jw56578/8e77a54108ec800e562072a872712ccd) 451 | + [Using Fetch with Redux Slides](https://docs.google.com/presentation/d/1Rpt4BWt8q2HpKpAALxmkMJZAXykUmwAScKvkXzK05VU/edit#slide=id.p) 452 | + [Redux thunk checklist](https://docs.google.com/presentation/d/1uUj_KUxAEqpeddFQ2OuVdr0AkaNDygIx87AvMdOUEbI/edit#slide=id.p) 453 | - :book: __Reading__: 454 | + [componentdidmount](https://reactjs.org/docs/react-component.html#componentdidmount) 455 | + [Lifecycle methods](https://engineering.musefind.com/react-lifecycle-methods-how-and-when-to-use-them-2111a1b692b1) 456 | + [HTTP](https://dzone.com/refcardz/http-hypertext-transfer-0) 457 | + [How the Web Works](https://fullstack.austincodingacademy.com/_book/web.html) 458 | + [redux-thunk](https://github.com/gaearon/redux-thunk) 459 | - :microscope: __Lab__: 460 | + [Find the Error](https://stackblitz.com/edit/react-ak8p9s) 461 | + [Address Book](https://github.com/AustinCodingAcademy/advanced-ajax-address-book) 462 | - :newspaper: __Misc__: 463 | + [redux-thunk](https://www.npmjs.com/package/redux-thunk) 464 | + [Redux Dev Tools](https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd?hl=en) 465 | + [Install Postman](https://www.getpostman.com/) 466 | + [themoviedb.org](https://www.themoviedb.org/?language=en) 467 | - :video_camera: __Videos__ 468 | + [Demo](https://youtu.be/EI_B_ncG1x4) 469 | + [Sign up for MovieDB](https://youtu.be/XSX2w8VPID0) 470 | - :bulb: __Cheat sheet__: 471 | + [Fetch](https://devhints.io/js-fetch) 472 | - :speaker: __To Do__: 473 | + Lab 474 | + [Redux Thunk Practice](https://github.com/AustinCodingAcademy/advanced-redux-fetch-practice) 475 | 476 | ----- 477 | ## ACAFlix 478 | - :paperclip: __Topics__: Let's design a web app that is similiar to Netflix. 479 | - :file_folder: __Notes__: 480 | + [Notes](https://gist.github.com/jw56578/66bdabf8c05fc61f4ddb5796d0a92b94) 481 | + [ACA Flix Spec Doc](https://docs.google.com/document/d/19l_2hz-rqoAB2TUTconchbdOiIUewwgW7RjubAhL344/edit) 482 | - :video_camera: __Videos__ 483 | + [Demo](https://youtu.be/bMsq98aLHAA) 484 | - :speaker: __To Do__: 485 | + [Repo](https://github.com/AustinCodingAcademy/advanced-checkpoint-1) 486 | ----- 487 | 488 | 489 | 490 | ## [Checkpoint 2](https://github.com/AustinCodingAcademy/advanced-checkpoint-2) 491 | ----- 492 | ## Authentication 493 | - :paperclip: __Topics__: Authentication. Sign-up/sign-in process. Hashing, tokens and encryption. 494 | - :file_folder: __Notes__: 495 | + [Authentication](https://docs.google.com/presentation/d/1CTFaTFTGhkQbwpQlrONLGzzhiwky9BJqyjINA3wtVU8/edit#slide=id.p) 496 | + [Token Analogy](https://docs.google.com/presentation/d/1qp8uO3T1cNKLREEgowX0O_AM92s-vxjpQvk3y61LdHg/edit#slide=id.p) 497 | + [Step By Step](https://docs.google.com/presentation/d/12weMwELlm42291krJE4Caf7tp0aE9soc6ShMgJEtCWM/edit#slide=id.p) 498 | - :book: __Reading__: 499 | + [hashing](https://en.wikipedia.org/wiki/Hash_function) 500 | + [cryptographic hashing](https://simple.wikipedia.org/wiki/Cryptographic_hash_function) 501 | + [bcrypt](https://en.wikipedia.org/wiki/Bcrypt) 502 | + [JWT](https://medium.com/vandium-software/5-easy-steps-to-understanding-json-web-tokens-jwt-1164c0adfcec) 503 | + [Authorization](https://en.wikipedia.org/wiki/List_of_HTTP_header_fields) 504 | - :microscope: __Lab__: 505 | + 506 | - :newspaper: __Misc__: 507 | + [jwt-simple npm](https://www.npmjs.com/package/jwt-simple) 508 | - :video_camera: __Videos__ 509 | + [bcrypt](https://www.youtube.com/watch?v=O6cmuiTBZVs) 510 | - :bulb: __Cheat sheet__: 511 | + 512 | - :speaker: __To Do__: 513 | + [Authentication Project](https://github.com/AustinCodingAcademy/authentication-project) 514 | 515 | ----- 516 | 517 | 518 | ## Deployment 519 | - :paperclip: __Topics__: How do you get your application on a public web server for everyone to see. What is heroku? 520 | - :file_folder: __Notes__: 521 | + [Survey](https://goo.gl/forms/uyCxIoLnCkreLb2L2) 522 | + [Setup](https://docs.google.com/presentation/d/1DkMr5yVVzLi2tMhCQ_kMyuSGNvbtSmHkqKW4c4SuajQ/edit#slide=id.p) 523 | - :newspaper: __Misc__: 524 | + [Heroku Dashboard](https://dashboard.heroku.com/apps) 525 | - :video_camera: __Videos__ 526 | + [Demo](https://youtu.be/6c8xj-K0vK8) 527 | + [Demo II](https://youtu.be/AZNFox2CvBk) 528 | ----- 529 | 530 | ## Misc 531 | - :paperclip: __Topics__: 532 | + [HTTPS](#https) 533 | + [Mobile](#mobile) 534 | + [Performance](#performance) 535 | + [Coding Challenges](#codingchallenges) 536 | ----- 537 | ## Career Readiness / Interview Prep 538 | 539 | - :paperclip: __Topics__: What do you need to do to prepare for an interview. What should be on your resume. 540 | - :file_folder: __Notes__: 541 | + [Finding a Job](https://docs.google.com/presentation/d/1yPtZPzzKZAnjbDbUA02WJ_dIgAF3okGAVNMoq5pJ03c/edit#slide=id.p) 542 | - :book: __Reading__: 543 | + [Interview Prep Resources](https://discourse.austincodingacademy.com/t/interview-prep-resources/249) 544 | + [Cracking the Code Interview](https://inspirit.net.in/books/placements/Cracking%20the%20Coding%20Interview.pdf) 545 | + [How to win friends and influence people](http://images.kw.com/docs/2/1/2/212345/1285134779158_htwfaip.pdf) 546 | + [Communication Principles](http://www.csus.edu/indiv/l/luenemannu/pdf/communicationprinciples.pdf) 547 | - :microscope: __Lab__: 548 | - :newspaper: __Misc__: 549 | + [Cover Letter Suggestions](https://docs.google.com/document/d/14gYRuEwkiab7c9JDmh3l32NxfrtzKrteOQ17Mdf6IzY/edit) 550 | + [Example Cover Letter](http://www.coverletter.us/software-engineer-cover-letter/) 551 | + [json resume](https://jsonresume.org/themes/) 552 | + [Job Scan](https://www.jobscan.co) 553 | + [fiverr](https://www.fiverr.com/) 554 | + [peopleperhour](https://www.peopleperhour.com/) 555 | + [interviewcake](https://www.interviewcake.com/) 556 | - :video_camera: __Videos__ 557 | + 558 | - :speaker: __To Do__: 559 | + 560 | 561 | ----- 562 | ## Troubleshooting 563 | - :paperclip: __Topics__: How do we figure out what is wrong with our code. 564 | 565 | ----- 566 | ## Mobile Dev 567 | 568 | - :paperclip: __Topics__: Make an app for iOS. Make an app for React Native 569 | - :file_folder: __Notes__: 570 | + [React Native](https://docs.google.com/presentation/d/18ljijnMfIYjP2L5JfRNnklDHNLJYt9Ok4ztVyEkB9Po/edit) 571 | + [React Native Step by Step](https://docs.google.com/presentation/d/11oagYxbkZkAaCRXSmjdCI5fOwWELdTQMqSCvh_gCPi8/edit#slide=id.p) 572 | + [iOS Quick Start](https://docs.google.com/presentation/d/1jQh9OujlUeyFXuDYntiVfE2PNri-vrZJsJPdC5xJmWo/edit#slide=id.p) 573 | + [React Native Repl](https://gist.github.com/jw56578/db7269742d42182fd79980f7f98dd3ad) 574 | - :book: __Reading__: 575 | + [What About Windows]( 576 | https://www.google.com/search?q=what+happened+to+windows+mobile&rlz=1C1GGRV_enUS748US748&oq=what+happened+to+windows+mobile&aqs=chrome.0.69i59j0l5.6109j0j7&sourceid=chrome&ie=UTF-8) 577 | + [React Native Quick Start](https://facebook.github.io/react-native/docs/getting-started.html) 578 | - :newspaper: __Misc__: 579 | + [snack.expo.io](https://snack.expo.io) 580 | - :video_camera: __Videos__ 581 | + [React Native Install for OSX](https://youtu.be/do8OttBpHEU) 582 | + [React Native CS50](https://www.youtube.com/watch?v=X52b-8y2Hf4&list=PLhQjrBD2T382gdfveyad09Ierl_3Jh_wR) 583 | - :microscope: __Lab__: 584 | + [React Native Repl Example](https://repl.it/@jw56578/SpringgreenSurprisedAutoexec) 585 | + [ACA App](https://snack.expo.io/@jw56578/acaapp) 586 | 587 | 588 | ----- 589 | 590 | ## Coding Challenges 591 | 592 | - :paperclip: __Topics__: How do you think through and solve coding challenges. 593 | - :file_folder: __Notes__: 594 | + [Coding Challenge 1](https://docs.google.com/presentation/d/1dU4Feth_mFxCLwccWcpsk83PA41Y2JijNIUxuwaqoQk/edit#slide=id.p) 595 | - :book: __Reading__: 596 | + 597 | - :video_camera: __Videos__ 598 | + 599 | 600 | 601 | 602 | ----- 603 | 604 | ## HTTPS 605 | 606 | - :paperclip: __Topics__: The S in httpS. Public key encryption. 607 | - :file_folder: __Notes__: 608 | + [Demo](https://docs.google.com/presentation/d/1xd56z0dxGKGW7vw5sqWFqAJjryMjm5lEeAvXbnh1-9w/edit#slide=id.p) 609 | - :book: __Reading__: 610 | + [TLS](https://en.wikipedia.org/wiki/Transport_Layer_Security) 611 | - :video_camera: __Videos__ 612 | + [HTTPS](https://www.youtube.com/playlist?list=PLj_QbToz3dk58YFCcIA3vIGBCfBdoLo7c) 613 | 614 | 615 | ----- 616 | ## Performance Tuning 617 | 618 | - :paperclip: __Topics__: Let's make it fast. 619 | - :file_folder: __Notes__: 620 | + [Step by Step](https://docs.google.com/presentation/d/1vIVtIY3VWjCkq6bxIrpsFG2CB5SPVl2zbRALKYyRMac/edit#slide=id.p) 621 | - :microscope: __Lab__: 622 | + [Project](https://github.com/AustinCodingAcademy/performance-tuning) 623 | 624 | 625 | 626 | ----- 627 | ## NodeJS 628 | 629 | - :paperclip: __Topics__: NodeJS. What is it and why do we use it. 630 | - :file_folder: __Notes__: 631 | + [What is NodeJS](https://docs.google.com/presentation/d/1t3O38JqLdG27LsHeKhdyBoNCTKCXcWwpe3Dn7hYQflE/edit#slide=id.p) 632 | + [Step by Step](https://docs.google.com/presentation/d/1rFQqgOa2l7gR6d-PyDOpfgQuKKlEpn8cFn3fijv_afs/edit#slide=id.p) 633 | - :book: __Reading__: 634 | + [Node](https://en.wikipedia.org/wiki/Node.js) 635 | + [Node Docs](https://nodejs.org/api/) 636 | - :microscope: __Lab__: 637 | - :newspaper: __Misc__: 638 | + [Node Source Code](https://github.com/nodejs/node) 639 | - :video_camera: __Videos__ 640 | + [Playlist](https://www.youtube.com/playlist?list=PLj_QbToz3dk5M4Nsc-sGfu_L3GFQc6Hs9) 641 | - :speaker: __To Do__: 642 | + 643 | 644 | 645 | ----- 646 | ## npm 647 | 648 | - :paperclip: __Topics__: npm. What is a package. What is a manager of packages. 649 | - :file_folder: __Notes__: 650 | + [What is NPM](https://docs.google.com/presentation/d/1X2hFMU0qDRTNkaJzZsPiqbf2iGGJcMdgAkIDvyEL-5w/edit#slide=id.p) 651 | + [Step by Step](https://docs.google.com/presentation/d/1E0SAWqg88T9KsvxirznyYZ9NoF7Taen1e8tCMchHykU/edit#slide=id.p) 652 | + [Global Package Step by Step](https://docs.google.com/presentation/d/1oVuSQGuPfB38PQq2lKgnnqC8QR0webT3sqBFTAX-omQ/edit#slide=id.p) 653 | - :book: __Reading__: 654 | + [npm](https://docs.npmjs.com/getting-started/what-is-npm) 655 | + [How to publish](https://docs.npmjs.com/getting-started/publishing-npm-packages) 656 | + [folders](https://docs.npmjs.com/files/folders) 657 | + [package.json](https://docs.npmjs.com/files/package.json) 658 | + [Semantic Versioning](https://docs.npmjs.com/getting-started/semantic-versioning) 659 | + [Global Package](https://ourcodeworld.com/articles/read/393/how-to-create-a-global-module-for-node-js-properly) 660 | - :microscope: __Lab__: 661 | - :newspaper: __Misc__: 662 | + [npmjs.com](https://www.npmjs.com/) 663 | + [Test Packages](https://npm.runkit.com/aca-dash) 664 | - :video_camera: __Videos__ 665 | + [NPM](https://youtu.be/x03fjb2VlGY) 666 | + [Step by Step](https://youtu.be/ixmWPNa_uJQ) 667 | - :speaker: __To Do__: 668 | + 669 | ----- 670 | ## CORS 671 | 672 | - :paperclip: __Topics__: What is CORS. Why do we care about it. How do we handle it. 673 | - :file_folder: __Notes__: 674 | + [What is CORS](https://docs.google.com/presentation/d/1pMpoAXUoeUEINFxLqlTkIf6zvsxengByh5QPthJZW9o/edit#slide=id.p) 675 | - :book: __Reading__: 676 | + [mdn](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) 677 | - :microscope: __Lab__: 678 | - :newspaper: __Misc__: 679 | - :video_camera: __Videos__ 680 | - :speaker: __To Do__: 681 | 682 | ----- 683 | ## Learning how to learn 684 | 685 | - :paperclip: __Topics__: How do you learn things. 686 | - :file_folder: __Notes__: 687 | + [Learning](https://docs.google.com/presentation/d/1L80F3es3yYsi1s9XgNmKl4WafvBjDyuHfhL3f_-56vw/edit#slide=id.p) 688 | - :book: __Reading__: 689 | + 690 | - :microscope: __Lab__: 691 | - :newspaper: __Misc__: 692 | + 693 | - :video_camera: __Videos__ 694 | + 695 | - :speaker: __To Do__: 696 | + 697 | ----- 698 | 699 | 700 | 701 | ## Async 702 | 703 | - :paperclip: __Topics__: Let's explain the concept of asynchronous 704 | - :file_folder: __Notes__: 705 | + [Slides](https://docs.google.com/presentation/d/16xXn02twoDDdNqtSum-mRCLobkmcch4bcWRPpJ3EPZo/edit#slide=id.p) 706 | + [Callback Functions](https://docs.google.com/presentation/d/1S0zTRfrfvTvZVa2Zn-owkqK1q1eF9W6Kc99zVTGgK0Q/edit?usp=sharing) 707 | - :book: __Reading__: 708 | + 709 | - :microscope: __Lab__: 710 | - :newspaper: __Misc__: 711 | + 712 | - :video_camera: __Videos__ 713 | + 714 | - :speaker: __To Do__: 715 | + 716 | ----- 717 | 718 | ## Fetch 719 | 720 | - :paperclip: __Topics__: What is this thing called fetch. 721 | - :file_folder: __Notes__: 722 | + [Fetch](https://docs.google.com/presentation/d/18X5KUGp2y4EvWt8Mxw1OqdcwGgiTCxWmZxTyzK7yQME/edit#slide=id.p) 723 | + [Checklist](https://docs.google.com/presentation/d/123k7T6_SvdaE3D9kJR-kMhi50l_IR2DgFPM5wUpnBdk/edit#slide=id.p) 724 | - :book: __Reading__: 725 | + [intro to fetch](https://developers.google.com/web/updates/2015/03/introduction-to-fetch) 726 | - :microscope: __Lab__: 727 | - :newspaper: __Misc__: 728 | + 729 | - :video_camera: __Videos__ 730 | + 731 | - :speaker: __To Do__: 732 | + 733 | ----- 734 | ## Patterns and Practices 735 | 736 | - :paperclip: __Topics__: There are an infinite number of ways to write your code. The computer doesn't care how you code as long as it gets the job done. So how do you decide from the infinite choices how you should actually write your code. 737 | - :file_folder: __Notes__: 738 | + [Quotes and semicolons]() 739 | + MVC 740 | + Promise 741 | - :book: __Reading__: 742 | + 743 | - :microscope: __Lab__: 744 | - :newspaper: __Misc__: 745 | + 746 | - :video_camera: __Videos__ 747 | + 748 | - :speaker: __To Do__: 749 | + 750 | ----- 751 | ## Service Workers 752 | 753 | - :paperclip: __Topics__: How can we make webs pages work without internet connection? What is a Service Worker. 754 | - :file_folder: __Notes__: 755 | - :book: __Reading__: 756 | + [Slides](https://docs.google.com/presentation/d/16uoU0KXYa24OFI66RHAzy4u29HW_9JOw739mZ-5vrYY/edit#slide=id.p) 757 | + [your-first-pwapp](https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp/) 758 | - :newspaper: __Misc__: 759 | + [Starter Code](https://repl.it/@jw56578/PotableStraightModel) 760 | ----- 761 | ## PWA's 762 | 763 | - :paperclip: __Topics__: What makes a web app be considered a progressive web app. Why would you want to make a PWA. 764 | - :file_folder: __Notes__: 765 | - :book: __Reading__: 766 | + [what-exactly-makes-something-a-progressive-web-app](https://infrequently.org/2016/09/what-exactly-makes-something-a-progressive-web-app/) 767 | + [your-first-pwapp](https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp/) 768 | - :newspaper: __Misc__: 769 | + [Starter Code](https://repl.it/@jw56578/PotableStraightModel) 770 | ----- 771 | 772 | 773 | 774 | ----- 775 | ## Final Project 776 | 777 | - :paperclip: __Topics__: Use these resources to get some inspiration for your final project. 778 | - :file_folder: __Notes__: 779 | + [Notes](https://gist.github.com/jw56578/42cb4af9e6dcf812c1ee8ef2bbc18271) 780 | + [Roadmap](https://docs.google.com/presentation/d/1XDLA13y_6mZvTGZ7gjAVyfF2HPbeXuybHiqg1ry1KSw/edit#slide=id.g43b90f4220_0_0) 781 | - :book: __Reading__: 782 | + [The browser can do some cool stuff](https://discourse.austincodingacademy.com/t/interesting-web-apis/699) 783 | - :microscope: __Lab__: 784 | - :newspaper: __Misc__: 785 | + 786 | - :video_camera: __Videos__ 787 | + 788 | - :speaker: __To Do__: 789 | 790 | ----- 791 | ## Introduction to Class 792 | - :paperclip: __Topics__: Introduction, course in a nutshell, and policies/logistics. Please spend some time outside class to review the course policies and other guidelines. 793 | - :file_folder: __Notes__: 794 | + [Survey](https://goo.gl/forms/5SlLfG6bvj9wsuns1) 795 | + [Intro](https://docs.google.com/presentation/d/144RtxLhmXBncRPb0ywt1vJkIRgjD2qxQ58tlDTKU6gc/edit#slide=id.p) 796 | + [You're Hired](https://docs.google.com/presentation/d/1NpG9RFwmi1k-aDnFVxu2NYVyKDJi6HxwXslTrobJn9k/edit#slide=id.p) 797 | + [Learning](#learning) 798 | + [Final Project ](#finalproject) 799 | + [Review Javascript](https://docs.google.com/presentation/d/1lBMYdvdn-B7lPjO69ouHbaotcDMhra-nKjpZgM-Y7_Y/edit#slide=id.p) 800 | + [Setup](https://docs.google.com/presentation/d/18HwyJt5WVWH-pukNyIfpzqYyCelppKuBQWJTa4oo1Nw/edit#slide=id.p) 801 | + [Reusability](https://docs.google.com/presentation/d/17KzGLZ3L5ilMBsvvJkqO848J3vXY4xjh0ohOPHZhCU4/edit#slide=id.p) 802 | + Textbook, rocket chat, study groups, class format 803 | - :book: __Reading__: 804 | + [Grading Policy](https://github.com/AustinCodingAcademy/advanced-syllabus/blob/master/GradingPolicy.md) 805 | + [Trust the Process](https://discourse.austincodingacademy.com/t/trust-the-process/216) 806 | + [How to Ask Questions](https://medium.com/@gordon_zhu/how-to-be-great-at-asking-questions-e37be04d0603) 807 | + [Communication](https://discourse.austincodingacademy.com/t/communication-with-instructor-and-tas/623) 808 | + [Attendance](https://gist.github.com/jw56578/2bb2c5578de5445a5f2d6e461d94a0bd) 809 | + [Office Hours](https://discourse.austincodingacademy.com/t/advanced-office-hours/327) 810 | - :newspaper: __Misc__: 811 | + [VS Code](https://code.visualstudio.com/) 812 | + [Snippets](https://code.visualstudio.com/docs/editor/userdefinedsnippets) 813 | + [Dev Survey 2018](https://insights.stackoverflow.com/survey/2018) 814 | + [Tutoring](https://austincodingacademy.com/tutors/) 815 | - :speaker: __To Do__: 816 | + [Gist Bio](https://gist.github.com/jw56578/c7c949c451e83e19327c091f99994163) 817 | 818 | ----- 819 | ## Software Systems 820 | - :paperclip: __Topics__:You can use all the buzz words and cool terminology that you want, but when it comes down to it, all we are doing is building a software system. What specific types of software are we making and what kind of tools are we using to help us. 821 | - :city_sunset: __Objective__: Understand what nodejs is.Understand what npm is. Be able to create an npm package. 822 | - :file_folder: __Notes__: 823 | + [Software Systems](https://docs.google.com/presentation/d/1dQgNVrbBntc_0Do_tdKnxoGY58Nlkcq10SvpRDQorpg/edit#slide=id.p)(slides) 824 | + [nodejs](#nodejs) 825 | + [npm](#npm) 826 | + [MERN](https://docs.google.com/presentation/d/1bhmcKZBG4uTvljs3W_7_AH0u1qSJvoQGzm0oNvkUpJg/edit#slide=id.p) 827 | + [git](https://docs.google.com/presentation/d/1JO9zYWD8E3I2yKW4tK52dF3LMCueOlmp1JW90cBkCp4/edit#slide=id.p) 828 | + [eCommerce](#eCommerce) 829 | - :book: __Reading__: 830 | - :newspaper: __Misc__: 831 | - :speaker: __To Do__: 832 | + Sign up for [npmjs.com](https://www.npmjs.com/) 833 | + [ACA Dash](https://github.com/AustinCodingAcademy/aca-dash) 834 | 835 | 836 | ----- 837 | ## Testing 838 | - :paperclip: __Topics__: What is TDD. How do you test your code. How do you test React. What is enzyme. 839 | - :file_folder: __Notes__: 840 | + [Testing](https://docs.google.com/presentation/d/19K7WF1UWjgsZNSCc83Cx86vwT6xJeE8HNPAF-fcW_7Y/edit#slide=id.p)(slides) 841 | + [Testing Step by Step](https://docs.google.com/presentation/d/1oIFt5YJiXsuHx0gidoR1ainqMgpgSeBLjTT2LzOJQak/edit#slide=id.p) 842 | + [Enzyme Step by Step](https://docs.google.com/presentation/d/10KEdHFLby4rqj3nJdKHrJOCRcHA30zzH4qPmuOhO264/edit#slide=id.p) 843 | - :book: __Reading__: 844 | + [Jest Docs](https://facebook.github.io/jest/) 845 | + [Enzyme Docs](http://airbnb.io/enzyme/docs/api/) 846 | - :newspaper: __Misc__: 847 | + [Jest](https://github.com/facebook/jest) 848 | + [Enzyme](https://github.com/airbnb/enzyme) 849 | + [Jest npm](https://www.npmjs.com/package/jest) 850 | + [Enzyme npm](https://www.npmjs.com/package/enzyme) 851 | - :speaker: __To Do__: 852 | + [Testing Project](https://github.com/AustinCodingAcademy/testing-project) 853 | 854 | ----- 855 | ## Debugging 856 | - :paperclip: __Topics__: What is debugging. How do you debug a node app. How do you debug a web app. 857 | - :city_sunset: __Objective__: Be able to use vscode and chrome to set breakpoints and debug a running javascript program. 858 | - :file_folder: __Notes__: 859 | + [Notes](https://gist.github.com/jw56578/018c9a8654f8666cddf3b9e9e8bb8964) 860 | + [Debugging](https://docs.google.com/presentation/d/16yPuG-pXoRiJv4dDUHjpzXO-PR3yxRE8lYRsW3rmrBs/edit#slide=id.p )(slides) 861 | - :book: __Reading__: 862 | + [Chrome Dev Tools](https://developers.google.com/web/tools/chrome-devtools/) 863 | + [What is Debugging](https://en.wikipedia.org/wiki/Debugging) 864 | + [Debugging with VS Code](https://code.visualstudio.com/docs/editor/debugging) 865 | + [Debugging with Chrome DevTools](https://developers.google.com/web/tools/chrome-devtools/javascript/) 866 | - :video_camera: __Videos__ 867 | + [Demo](https://www.youtube.com/watch?time_continue=76&v=H0XScE08hy8) 868 | + [Tutorial](https://youtu.be/x4q86IjJFag) 869 | + [Class Video](https://youtu.be/d7Qo067JbOc) 870 | - :microscope: __Lab__: 871 | + [Debug Node vs Web](https://gist.github.com/jw56578/bdcd21244aa8df279170bed9594d6934) 872 | + [Fix Bug](https://googlechrome.github.io/devtools-samples/debug-js/get-started) 873 | + Debug redux action practice 874 | + Search All files 875 | + [Challenge](https://github.com/AustinCodingAcademy/debugging-challenge) 876 | + [Node debug practice](https://github.com/AustinCodingAcademy/node-debug-practice) 877 | - :speaker: __To Do__: 878 | ----- 879 | ## Modules 880 | - :file_folder: __Notes__: 881 | + [Modules](https://docs.google.com/presentation/d/1KCggLagn3Jbuh3YGk9YqoNKTc3ja8SQRKh4PRCY8OjQ/edit#slide=id.p)(slides) 882 | + [Node Modules](https://docs.google.com/presentation/d/14v0N_RgoSujfYk8atSaCMW9a96HfYB0VS5QHgeiR6lM/edit#slide=id.p) 883 | + [ES6 Modules](https://docs.google.com/presentation/d/1Z-YOT6HRhnohOuk1Z0Q9MvmhkdeGux80930GPA30Ex8/edit#slide=id.p) 884 | - :book: __Reading__: 885 | + [Node Modules](https://nodejs.org/docs/latest/api/modules.html) 886 | - :video_camera: __Videos__ 887 | + [Module Video](https://youtu.be/Ev9RlJtGq_Q?list=PLB3lIeK4NB6ttv_zz3r93b78UQWkM-wIm&t=979) 888 | - :speaker: __To Do__: 889 | + [Module Practice](https://github.com/AustinCodingAcademy/advanced-module-practice) 890 | + [CommonJs Practice](https://github.com/AustinCodingAcademy/commonjs-module-practice) 891 | 892 | ----- 893 | ## Creating a Server 894 | - :paperclip: __Topics__: Internet. Servers. Client-Server communication. Express. Rest. 895 | - :file_folder: __Notes__: 896 | + [Internet Analogy](https://docs.google.com/presentation/d/18p3Qm-_RHM5Qohak3hHBeXW9nsf3eZLyL-rhu9XvI9o/edit#slide=id.p) 897 | + [Understanding a Server](https://docs.google.com/presentation/d/1i20QydrS95WcyEOJgs5oMnuLlLVli6i7qL-2goFmml4/edit#slide=id.g24ef0cf848_0_1) 898 | + [Where's my IP](https://docs.google.com/presentation/d/1mZIbb1FUhoScblsolER7ZXP3PPbB4WAhbNLFMi85yuU/edit) 899 | + [Express Step by Step](https://docs.google.com/presentation/d/11NrFEVHnkXfWUKF7VUwpMv-JkTX9ybXL6pEv6DecPoM/edit#slide=id.p) 900 | + [REST](https://docs.google.com/presentation/d/19lpnY-Wm9q8XIr99oV188GqP3NiSMJ1D8P5dZsUbrVE/edit#slide=id.p) 901 | + [HTTP Practice](https://docs.google.com/presentation/d/1-gMerQiCmCVwos_kAWuDeKIzfgi8Rhy9Q9PehVpNfaI/edit#slide=id.p) 902 | - :book: __Reading__: 903 | + [Express](https://expressjs.com/) 904 | + [use](http://expressjs.com/en/api.html#app.use) 905 | + [frontend-vs-backend](http://blog.teamtreehouse.com/i-dont-speak-your-language-frontend-vs-backend) 906 | + [REST](https://en.wikipedia.org/wiki/Representational_state_transfer) 907 | + [REST API](http://www.vinaysahni.com/best-practices-for-a-pragmatic-restful-api) 908 | + [Express Analogy](https://www.codementor.io/kevinkononenko/understanding-the-basics-of-express-js-by-eating-at-a-restaurant-gxhiv02th?utm_swu=7179) 909 | - :microscope: __Lab__: 910 | + [Server Starter Code](https://github.com/AustinCodingAcademy/advanced-first-web-server) 911 | - :newspaper: __Misc__: 912 | + [Express npm](https://www.npmjs.com/package/express) 913 | + [Postman](https://www.getpostman.com/) 914 | - :video_camera: __Videos__ 915 | + [Demo 1](https://youtu.be/ViwIjpD7bM8) 916 | + [REST](https://youtu.be/7YcW25PHnAA) 917 | - :bulb: __Cheat sheet__: 918 | + [Express](https://github.com/azat-co/cheatsheets/tree/master/express4) 919 | - :speaker: __To Do__: 920 | + [Server Starter Code](https://github.com/AustinCodingAcademy/advanced-first-web-server) 921 | + [Express Practice](https://github.com/AustinCodingAcademy/advanced-express-practice) 922 | ----- 923 | 924 | ## Creating a Server II 925 | - :paperclip: __Topics__: Internet. Servers. Client-Server communication. Express. Rest. Continue learning how to use express step by step 926 | - :file_folder: __Notes__: 927 | + [Express Step by Step](https://docs.google.com/presentation/d/11NrFEVHnkXfWUKF7VUwpMv-JkTX9ybXL6pEv6DecPoM/edit#slide=id.p) 928 | - :book: __Reading__: 929 | + [github.com/remy/nodemon](https://github.com/remy/nodemon) 930 | - :microscope: __Lab__: 931 | + [ACA Chat](https://github.com/AustinCodingAcademy/aca-chat) 932 | 933 | 934 | ----- 935 | 936 | ## Creating a Server III 937 | - :paperclip: __Topics__: Internet. Servers. Client-Server communication. Express. Rest. 938 | - :file_folder: __Notes__: 939 | + [Notes](https://gist.github.com/jw56578/937836b7252665183013e0f5751c4957) 940 | + [Express Step by Step](https://docs.google.com/presentation/d/11NrFEVHnkXfWUKF7VUwpMv-JkTX9ybXL6pEv6DecPoM/edit#slide=id.p) 941 | + [nodemon](https://docs.google.com/presentation/d/1rPTeJKuXs26U9OT1E7qodemWMmIAWrJCWYprSkQoIBI/edit#slide=id.p) 942 | + [fetch](#fetch) 943 | + [CORS](#cors) 944 | - :book: __Reading__: 945 | + [github.com/remy/nodemon](https://github.com/remy/nodemon) 946 | - :microscope: __Lab__: 947 | + [ACA Chat](https://github.com/AustinCodingAcademy/aca-chat) 948 | ----- 949 | -------------------------------------------------------------------------------- /GradingPolicy.md: -------------------------------------------------------------------------------- 1 | * 1-2 graded assignments per week 2 | * 2-3 checkpoint assignments per semeseter 3 | * All assigned projects have a due date that is displayed on campus manager. You may turn in assignments at any time for some credit. 4 | * Assignments will be given credit if turned in on time. If turned in late, 10 points will be deducted. 5 | * Assignments are submitted by pushing code to you github repo, doing a pull request and then submitting the link to that pull request 6 | * Make sure to add the link to the pull request of the homework. 7 | * Some assignments have a point system so that you explicitly know how it will be graded, otherwise I will make github comments to tell you why you lost points. 8 | * Do not copy other peoples code. 9 | * If anything, focus on the checkpoints as they are a majority of your grade. 10 | -------------------------------------------------------------------------------- /Resources.md: -------------------------------------------------------------------------------- 1 | 2 | Resources 3 | * [Online Lessons](https://wooed.teachable.com/p/applied-javascript) 4 | * [Grading Policy](https://discourse.austincodingacademy.com/t/advanced-grading-policy/330) 5 | * [Start on your final project](https://github.com/AustinCodingAcademy/advanced-final-project) 6 | * [Discourse](https://discourse.austincodingacademy.com/c/austin-coding-academy/advanced-2) 7 | * [Stackblitz](https://stackblitz.com/) 8 | * [Watch and Code](https://watchandcode.com/p/practical-javascript) 9 | * [How to ask questions](https://medium.com/@gordon_zhu/how-to-be-great-at-asking-questions-e37be04d0603) 10 | * [Communication](https://discourse.austincodingacademy.com/t/communication-with-instructor-and-tas/623) 11 | * [Office Hours](https://discourse.austincodingacademy.com/t/advanced-office-hours/327) 12 | * [Code Sandbox](https://codesandbox.io/s/new) 13 | * [scrimba](https://scrimba.com) 14 | * [Code Wars](https://www.codewars.com) 15 | * [codeanalogies](https://www.codeanalogies.com/) 16 | * [build-a-computer](https://www.coursera.org/learn/build-a-computer) 17 | * [Repl React Native](https://repl.it/site/languages/react_native) 18 | * [snack.expo.io](https://snack.expo.io/) 19 | * [Devloper Handbook](https://github.com/FrontendMasters/front-end-handbook-2018) 20 | * [Tutoring](https://austincodingacademy.com/tutors/) 21 | * [awwapp](https://awwapp.com/#) 22 | -------------------------------------------------------------------------------- /Roster.md: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /finalprojects.md: -------------------------------------------------------------------------------- 1 | * https://energy-usage-mcam3r0n.herokuapp.com/ 2 | * https://balancedbudget.herokuapp.com/ 3 | * https://agile-basin-94927.herokuapp.com/ 4 | * https://mjm-cocktail-app.herokuapp.com/ 5 | * https://questiontracker.herokuapp.com/ 6 | * https://enigmatic-journey-83333.herokuapp.com/ 7 | * https://pacific-taiga-44171.herokuapp.com/ 8 | * http://austincurrents.com/ 9 | 10 | -------------------------------------------------------------------------------- /prework.md: -------------------------------------------------------------------------------- 1 | * [Complete the practical javascript course](https://watchandcode.com/p/practical-javascript) 2 | 3 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | ## Austin Coding Academy - Full Stack MERN 2 | 3 | This repository holds the course materials for the Q3 2018 edition of 4 | ACA Full Stack MERN 5 | 6 | 7 | - __Instructor:__ [Jon Woo](http://github.com/jw56578), jon [at] austincodingacademy [dot] com 8 | - __Tutor:__ 9 | - __Class Time:__ 10 | - __Session Dates:__ June 24 - Sept 4, 2019 11 | - __Text Book:__ [Pro MERN Stack](https://drive.google.com/open?id=1gkHFLZhoDJN0kCm2vgA8nkWX-w4zHQtu) 12 | - __[Daily Student Presentations](https://drive.google.com/open?id=1P6mFxir-UMLNpLPek0Yux9uZdfGyXDCPaBd9lKbqGFk)__ 13 | - __[Weekly Interview Prep Blog Questions](https://drive.google.com/open?id=198765GJSiNc1sn0zt4KATUW_-0aqMpM4tKbt33ZD-Zo)__ 14 | - [__Course Outline__](CourseOutline.md) 15 | 16 | ----- 17 | 18 | 19 | 20 | ### Description 21 | I like to refer to this class as Applied Javascript, designed to take our Intermediate students to a level of fluency with Node.js and React.js that will allow them to build professional, well designed web applications. You can use these skills to become an entry level developer, a JavaScript developer a senior technical project manager, a full stack developer, or use your ability to learn new languages to switch into a career with Python, Ruby, or one of the many other in-demand languages in Texas. 22 | 23 | This class is designed for someone who has a strong command of front end development, including HTML, CSS, and JavaScript, and who is interested in formalizing their back end development skill set to become full stack. 24 | 25 | 26 | ### Prerequisites / Review 27 | You should be completely comfortable with html and have a basic understanding on javascript. You don't need to be able to code a chess game in javascript but you should know what an if statement or for loop is. 28 | 29 | 30 | 31 | ### Methods of Instruction 32 | 33 | We will be using a combination of materials such as slides, follow along demos, tutorials, 34 | reading assignments and homework projects 35 | 36 | ## Class Format 37 | * Student Presentations - 5-7 mins 38 | * Whiteboard Training - 15 mins 39 | * Homework review and questions - 25-35 mins 40 | * 7:30 p.m. Students are whiteboarding, code planning, cloning and coding 41 | * 8:45 Assign blogs and give Attendance Code 42 | 43 | -------------------------------------------------------------------------------- /todo.md: -------------------------------------------------------------------------------- 1 | ### What we need to be doing with our lives 2 | * Watch online lesson videos and if appropriate follow along doing what is demonstrated. Keep watching over and over and doing until you get it. 3 | * If you don't get it, research online until you find something that makes you get it. 4 | * Always be thinking about a project to work on. Final project 5 | * Always be working on coding challenges on freecodecamp, hacker rank, Code Wars or anything else 6 | * Read industry articles. Share any that helped you understand something or interest you. 7 | * Learn how to organize yourself. Have a reference to all material we cover. You aren't expected to memorize stuff, you just need to know where to look for an example of how to do it. Googling everytime takes too long 8 | * Not watching netflix or going on vacation. 9 | 10 | --------------------------------------------------------------------------------