Class Resources & Homework

Slides

You can find all of Leon's slide presentations here. Pro Tip: they are useful for making Anki decks.

Anki

A free flashcard app. Don't pay for the iOS version - you can make an account and use it from Safari. Pro Tip: VSCode has an Anki extension that makes making some types of cards easier.

Additional Homework Links

I'm not intentionally including dates here. The dates were often in flux when class was in real time, and at this point new people are working on their own and at their own pace. Do what works for you, and ask questions in Discord!

Also - I joined class late and am adding these links long after the fact. I think the homework listed was assigned after its class and not due before. I may be wrong in some cases, so pay attention and figure things out as you go along. You can always refer to Leon's posts on Discord.

Class 01

For Homework (Due Thursday - Nov. 5th):

Watch: https://youtu.be/ukLnPbIffxE

Watch: https://youtu.be/Z-zNHHpXoMM

Complete: https://www.coursera.org/learn/learning-how-to-learn

Class 02

Read: https://learn.shayhowe.com/html-css/

Build: HTML for BBC Website (just what is in the attached image)

Other:

https://www.youtube.com/watch?v=TiP7aantnvE > https://www.youtube.com/watch?v=UzffnbBex6c

Class 03

Do: Finish Simple Site Lab from class-03

Read: http://learnlayout.com/

Do: https://www.typingtest.com/ (Five Minute Test)

Do: Practice Typing - https://www.keybr.com/

Other:

Try and watch before class (motivation): https://youtu.be/6vuetQSwFW8

Class 04

Read: https://learn.shayhowe.com/advanced-html-css/responsive-web-design/

Class 05

Do: Make 15 minutes of pain responsive

Read: http://learnlayout.com/

Read: https://learn.shayhowe.com/advanced-html-css/

Do: Practice Typing - https://www.keybr.com/

Class 06

Do: http://flexboxfroggy.com/

Watch: Independence Day

Do: Layout Assignment (will share Thursday)

Make the 15 minutes of pain layout have three media queries!

Read: https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Do: http://flexboxfroggy.com/

Class 07

Do: Real Layout Assignments Do: The 3 layouts we did in class Do: The Level Ground & Source Layouts in the homework-layout-photos Push?: Do Pushwork Homepage and add media queries to other layouts

Class 08

keep working on stuff you need to finish

Class 09

Do: Plan out your networking!

Read: https://javascript.info/variables + Tasks

Read: https://javascript.info/function-basics + Tasks

Do: Delete the JS and do it again for all assignments

Do: Something special for yourself this weekend

Class 10

Do: NETWORK!

Do: Coding Challenge (Released After Class) Read: https://javascript.info/function-expressions + Tasks

Read: https://javascript.info/arrow-functions-basics + Tasks

Read:https://github.com/thejsway/thejsway/blob/master/manuscript/chapter04.md

Do: Delete the JS and do it again for all assignments

Class 11

COMMENT OUT YOUR JS

TYPE IT ALL OUT AGAIN WITHOUT LOOKING

PEAK IF YOU HAVE TOO

REPEAT UNTIL YOU DO NOT HAVE TO PEAK

DELETE YOUR JS ENTIRELY

AND DO IT AGAIN

THEN DO IT AGAIN BUT CHANGE SOMETHING!

Class 12

Watch: Fuck You Pay Me

Do: Setup your portfolio

Do: Draft your proposal / contract

Do: Pick A Vertical and Start Reaching Out

Class 13

Try and read before class (motivation): https://allpoetry.com/poem/8624439-Thinking-by-Walter-D-Wintle

Winter Break

Week 1

Read - https://www.poetryfoundation.org/poems/51642/invictus

Read - https://github.com/bpesquet/thejsway (3, 2, 1... Code! through Write Functions)

Read - http://eloquentjavascript.net/3rd_edition/ (Chapters 1 - 3)

Do - https://www.codecademy.com/learn/introduction-to-javascript (1-6)

Watch - https://youtu.be/SWYqp7iY_Tc

Extra Reading: https://jwiegley.github.io/git-from-the-bottom-up/

Don't Do - Play yo self - start early this is a lot and very important for when we come back

Week 2

Read - http://mwkworks.com/desiderata.html

Read - https://github.com/bpesquet/thejsway/ (Create your first objects -through- Understand object-oriented programming)

Read - http://eloquentjavascript.net/3rd_edition/ (Chapters 4-6)

Do - https://javascript30.com/ (1&&2)

Do - Host your portfolio

Build - A horoscope app where the user can enter their birthday and get their horoscope. There should be minimum 12 unique horoscopes.

Build - A simple calculator that has two inputs and returns the result of +,-,/,* somewhere in the DOM

Class 14

Finish or make break homework better

Class 15

Review Objects Reading!

IMPORTANT: The Great Suspender extension may have been compromised! Please uninstall and reinstall from source: https://github.com/greatsuspender/thegreatsuspender/issues/1263

Peek ahead at the rest of the Array slides and review your objects reading including: https://github.com/thejsway/thejsway/blob/master/manuscript/chapter06.md

Class 16

Read: https://javascript.info/array-methods

Research: Array Methods

Do: JS30 Day 04 Array Cardio

Read: Ahead on slides and problems (try them too)

Read: https://javascript.info/object

Class 17

Do: All the tasks :point_up_2_tone4:

Do: Three Codewars Fundamentals

Class 18

Finish: NASA Photos API

Read: Pillars of OOP - https://medium.com/@hamzzza.ahmed95/four-pillars-of-object-oriented-programming-oop-e8d7822aa219

Watch / Do: https://youtu.be/PFmuCDHHpwk

Watch: https://youtu.be/0fKg7e37bQE

Do: Four Codewars Fundamentals

If you want to push:

Read and do the tasks: https://javascript.info/ Whole Chapter - Objects: the basics Complete and Submit this project: https://github.com/leonnoel/100devs-calculator

Class 19

keep on keepin' on!

Bruh

Class 20

Make the cocktailDB api work with spaces between the names!

Find three APIs and build three simple apps using those APIs (Not all of these work, but it is a start: https://github.com/public-apis/public-apis)

Build one additional app that takes a response from one API and uses it to get data from another

Do: Five Codewars

if you want to push:

Make a rotating list of drinks (an automatic carousel) from the cocktailDB

Make the NASA API handle all the data types including video

Add an API to your portfolio website

Do: A 7kyu Codewars

Also:

Be sure to give your resume a pass through: https://cvcompiler.com/

Class 21

Intro to Git and Github: https://aka.ms/ads/Github Do: Join our Codewars Clan - #100Devs - leonnoel.com/twitch

If you want to push:

Build a slot machine: https://github.com/learnwithleon/100devs-slot-machine

Class 22

keep on keepin' on!

Class 23

DO: Catch Up

DO: Intro JS Course - https://www.codecademy.com/learn/introduction-to-javascript (30 Hours)

DO: Professional Checklist (Will be shared after class) DO: TAKE A BREAK

DO: Catch Up

Class 24

Watch / Do: https://youtu.be/PFmuCDHHpwk

Read / Do: JS Way Ch. 09 (https://github.com/thejsway/thejsway/blob/master/manuscript/chapter09.md)

Read / Do: Eloquent JS Ch. 06 (https://eloquentjavascript.net/06_object.html)

Do: 7 Codewars

DO: Professional Checklist (Will be shared after class)

Class 25

Catch up!

Take a break!

Class 26

Do: Make the pokemon API do something!

Class 27

Read / Do: https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous/Async_await

Watch / Do: https://youtu.be/vn3tm0quoqE

TYPE OUT ALL THE EXAMPLES!!!

Want to Push?

Read / Do: https://javascript.info/async

Class 28

Do: Start prepping THE BANK

Do: Complete Your Professional Links

READ: Modern Javascript For Dinosaurs

WATCH: Node.js Crash Course (just get through it) -

Class 29

keep it up!

Class 30

Do: Start prepping THE BANK

Do: Complete Your Professional Links

Do: Make node-backend-simple-json more readable

Do: Make a coinflip game where the randomization happens server side

Class 31

Watch: https://www.youtube.com/watch?v=8aGhZQkoFbQ

Watch: https://www.youtube.com/watch?v=cCOL7MC4Pl0

Do: https://zellwk.com/blog/crud-express-mongodb/ (SUPER IMPORTANT)

Class 32

Do: Start prepping THE BANK

Do: Complete Your Professional Links

Create: Heroku, Mongo Atlas, and Postman Accounts

Read: Node.js and Express (Fullstack Open - https://fullstackopen.com/en/part3/node_js_and_express)

Do: Make Your Own API and Push To Heroku

rap-api client-side-rap-api

Class 33

Do: Make A Fullstack Todo List and Push To Heroku

Class 34

You got this!

Class 35

Watch: https://youtu.be/SBvmnHTQIPY (Node.js App From Scratch | Express, MongoDB & Google OAuth) THIS IS A BEAST just get through it, so all the topics are not brand new on Tuesday!

Class 36

For today:

Comment the Todolist Code: https://github.com/100devs/todolist-live-review Fork it, comment every line, and submit a PR please

Here is the VOD where we code it from scratch: https://www.twitch.tv/videos/976816027

Read Zell's REST API article: https://www.smashingmagazine.com/2018/01/understanding-using-rest-api/

Watch DevMarketer's MVC video: https://youtu.be/1IsL6g2ixak

Homework:

Finish Brad's Video (just get through it - it's a beast): https://youtu.be/SBvmnHTQIPY

Dream of a MVC Todolist with Authentication (seriously - daydream if it doesn't come up in your actual dreams)

Class 37 - 39

keep going!

Class 40

Demo App

Code (only peek if you need too)

Class 41

:point_right_tone4: Homework Due Tonight (Checklist Links): https://forms.gle/usiNBEkn6mAZS9Zx7

:point_right_tone4: Please fill out this form if you got a client, volunteered, or contributed to open source: https://forms.gle/9Uig4svWfVa3bD2cA

:calendar_spiral: Homework Due Tuesday (May 4th): Please,

Finish: TEAM PROJECT

Read this: https://javascript.info/array-methods

Read this: https://www.freecodecamp.org/news/array-destructuring-in-es6-30e398f21d10/

Watch this: https://youtu.be/R8rmfD9Y5-c

Add what you learn to an interview deck on Anki

5 codewars tagged as arrays (minimum)

Class 43

Please, Finish: TEAM PROJECT Finish: HITLIST Please research the following methods: map reduce filter forEach sort slice pop shift push unshift includes indexOf every

Give a short description of what the method does, how it works, it's time complexity (if appropriate), and give three examples of it in action!

Questions to practice:

One: Given a non-empty array of integers, return the result of multiplying the values together in order. Example: [1, 2, 3, 4] => 1 2 3 * 4 = 24

Two: You will be given an array of all the family members' ages, in any order. The ages will be given in whole numbers, so a baby of 5 months, will have an ascribed 'age' of 0. Return a new array with [youngest age, oldest age, difference between the youngest and oldest age].

Three: Sum all the numbers of the array except the highest and the lowest element (the value, not the index!). Example: [ 6, 2, 1, 8, 10 ] => 16 [ 1, 1, 11, 2, 3 ] => 6

5 codewars tagged as arrays (minimum)

Add what you learn to an interview deck on Anki!

Class 44

Review your methods and the questions assigned last week. :point_right_tone4: ANKI ALERT :rotating_light:

Start React:

Read - https://medium.com/the-node-js-collection/modern-javascript-explained-for-dinosaurs-f695e9747b70 (old, weird, just get through it)

Watch - https://www.youtube.com/watch?v=w7ejDZ8SWv8 (2 hours - just get through it)

Do - https://egghead.io/courses/the-beginner-s-guide-to-react (2-3 hours - just get through it)

Also, if able, please get some movement in as the next month or two will require a lot of hunkered down coding time! I've been enjoying this mobility routine: https://youtu.be/SsT_go-oCcQ

Class 45

Please research the following string methods: charAt charCodeAt concat includes indexOf match repeat replace search slice split substr toLowerCase toUpperCase trim