├── .gitignore ├── .vscode └── settings.json ├── README.md ├── W10D1 ├── D2 │ └── sql │ │ └── sql_menagerie_stub.sql └── sql │ └── intro to rdbms.md ├── W10D3 ├── README.md ├── pets-walkthrough.md ├── sequelize-associations.md └── sequelize-migrations.md ├── W10D4 ├── .gitignore ├── README.md ├── associations.js ├── change.txt ├── config │ └── config.json ├── delete.js ├── insert.js ├── instructor-notes.txt ├── migrations │ ├── 20200722231100-create-pet-type.js │ ├── 20200723141432-create-owner.js │ ├── 20200723141633-create-pet.js │ └── 20200723141942-create-pet-owner.js ├── models │ ├── index.js │ ├── owner.js │ ├── pet.js │ ├── petowner.js │ └── pettype.js ├── package-lock.json ├── package.json ├── querying.js ├── seeders │ └── 20200723142335-add-pet-types.js ├── sql-orm-recipe-box-solution │ ├── assets │ │ ├── site.css │ │ ├── uikit-icons.min.js │ │ ├── uikit.min.css │ │ └── uikit.min.js │ ├── config │ │ └── config.json │ ├── data-access-layer │ │ ├── ingredients-repository.js │ │ ├── ingredients-seed-data.txt │ │ ├── instructions-repository.js │ │ ├── instructions-seed-data.txt │ │ ├── measurement-units-repository.js │ │ ├── recipe-seed-data.txt │ │ └── recipes-repository.js │ ├── migrations │ │ ├── 20200101012349-create-measurement-unit.js │ │ ├── 20200101020332-create-recipe.js │ │ ├── 20200101022518-create-instruction.js │ │ └── 20200101024010-create-ingredient.js │ ├── models │ │ ├── index.js │ │ ├── ingredient.js │ │ ├── instruction.js │ │ ├── measurementunit.js │ │ └── recipe.js │ ├── package-lock.json │ ├── package.json │ ├── seeders │ │ ├── 20200101012638-default-measurement-units.js │ │ ├── 20200101033233-add-recipes.js │ │ ├── 20200101034337-add-ingredients.js │ │ └── 20200101034823-add-instructions.js │ ├── server │ │ ├── controllers │ │ │ ├── dashboard.js │ │ │ ├── ingredients.js │ │ │ ├── instructions.js │ │ │ └── recipes.js │ │ └── index.js │ └── views │ │ ├── home.pug │ │ ├── layout.pug │ │ ├── recipe-detail.pug │ │ ├── recipe-editor.pug │ │ └── recipe-starter.pug ├── transactions.js └── update.js ├── W10D5 ├── README.md ├── W10-empty-LOs.md ├── W10-filled-in-LOs.md ├── sequelize-practice-assessment-solutions.zip ├── sequelize-practice-assessment-starter.zip ├── sequelize-practice-walkthrough │ ├── README.md │ ├── config │ │ └── config.json │ ├── images │ │ └── class-enrollment-data-model.png │ ├── migrations │ │ ├── 20200724204620-create-person.js │ │ ├── 20200724204907-create-campus.js │ │ ├── 20200724205131-create-department.js │ │ ├── 20200724205446-create-course.js │ │ └── 20200724205746-create-enrollment.js │ ├── models │ │ ├── campus.js │ │ ├── course.js │ │ ├── department.js │ │ ├── enrollment.js │ │ ├── index.js │ │ └── person.js │ ├── package-lock.json │ ├── package.json │ ├── queries │ │ └── personLookup.js │ ├── seeders │ │ ├── 20200724210217-add-people.js │ │ ├── 20200724210330-add-campuses.js │ │ ├── 20200724210432-add-departments.js │ │ ├── 20200724210519-add-courses.js │ │ └── 20200724210638-add-enrollments.js │ └── test │ │ ├── campus-model-tests.js │ │ ├── course-model-tests.js │ │ ├── department-model-tests.js │ │ ├── person-model-tests.js │ │ ├── root-tests.js │ │ └── test-utils.js ├── sql-practice-assessment-solution.zip ├── sql-practice-assessment-starter.zip └── sql-practice-walkthrough │ ├── README.md │ ├── create-countries-table.sql │ ├── create-merchant-types-table.sql │ ├── create-merchants-table.sql │ ├── create-users-table.sql │ ├── images │ └── data-model.png │ ├── insert-countries-data.sql │ ├── insert-merchant-types-data.sql │ ├── insert-merchants-data.sql │ ├── insert-users-data.sql │ ├── joined-data-query.sql │ ├── package-lock.json │ ├── package.json │ └── test │ ├── joined-data-spec.js │ ├── table-countries-spec.js │ ├── table-merchant-types-spec.js │ ├── table-merchants-spec.js │ ├── table-testing-utils.js │ └── table-users-spec.js ├── W11D1 ├── README.md ├── http.js ├── httpFile.js ├── httpForm.js ├── index.html ├── lecture.html ├── lectureHttpForm.js ├── node-http.jpeg ├── node-http.md ├── reg-ex.js └── reg-ex.md ├── W11D2 ├── README.md ├── exploring-route-paths │ ├── README.md │ ├── app.js │ ├── banana │ │ └── nested │ │ │ └── index.pug │ ├── package-lock.json │ └── package.json ├── express.md ├── intro-to-express.js ├── intro-to-express.md ├── intro-to-express │ └── app.js ├── live-reload.md ├── package-lock.json ├── package.json ├── pug.md └── render-html-templates │ ├── app.js │ ├── package-lock.json │ ├── package.json │ └── views │ └── layout.pug ├── W11D3 ├── README.md ├── formative-forms-solution-without-mixins │ ├── README.md │ ├── index.js │ ├── package-lock.json │ ├── package.json │ ├── test │ │ ├── 01_home.test.js │ │ ├── 02_create_form.test.js │ │ ├── 03_form_submit.test.js │ │ ├── 04_create_interesting_form.test.js │ │ └── 05_interesting_form_submit.test.js │ └── views │ │ ├── create-interesting.pug │ │ ├── create.pug │ │ ├── includes │ │ ├── basic_info.pug │ │ └── form_errors.pug │ │ ├── index.pug │ │ └── layout.pug └── pug-js-overview │ ├── README.md │ ├── app.js │ ├── appCleanedUp.js │ ├── config │ └── config.json │ ├── controllers │ ├── owners │ │ └── index.js │ └── pets │ │ └── index.js │ ├── migrations │ ├── 20200722231100-create-pet-type.js │ ├── 20200723141432-create-owner.js │ ├── 20200723141633-create-pet.js │ └── 20200723141942-create-pet-owner.js │ ├── models │ ├── index.js │ ├── owner.js │ ├── pet.js │ ├── petowner.js │ └── pettype.js │ ├── package-lock.json │ ├── package.json │ └── views │ ├── layout.pug │ ├── owners.pug │ ├── pets.pug │ └── pettypes.pug ├── W11D4 ├── .env.example ├── .gitignore ├── .sequelizerc ├── README.md ├── app.js ├── config.js ├── config │ ├── database.js │ └── index.js ├── db │ └── models │ │ └── index.js ├── environment-variables.md ├── package-lock.json ├── package.json └── views │ ├── error.pug │ └── index.pug ├── W11D5 ├── README.md ├── empty-LOs.md ├── express-practiceA-solution.zip ├── express-practiceA-starter.zip ├── filled-in-LOs.md ├── practiceA-solution │ ├── README.md │ ├── app.js │ ├── config │ │ └── config.json │ ├── images │ │ ├── new-person-screen.png │ │ └── person-list-screen.png │ ├── migrations │ │ ├── 20200410173300-create-hair-color.js │ │ └── 20200410182639-create-person.js │ ├── models │ │ ├── haircolor.js │ │ ├── index.js │ │ └── person.js │ ├── package-lock.json │ ├── package.json │ ├── seeders │ │ └── 20200410173315-insert-hair-colors.js │ ├── test │ │ ├── 01-form-test.js │ │ ├── 02-submission-page.js │ │ ├── 03-main-page.js │ │ └── utils │ │ │ ├── have-select-with-option.js │ │ │ ├── have-tag-with-attribute.js │ │ │ └── html-collector.js │ └── views │ │ ├── new-person-form.pug │ │ └── person-list.pug ├── practiceA-starter │ ├── README.md │ ├── app.js │ ├── images │ │ ├── new-person-screen.png │ │ └── person-list-screen.png │ ├── package-lock.json │ ├── package.json │ └── test │ │ ├── 01-form-test.js │ │ ├── 02-submission-page.js │ │ ├── 03-main-page.js │ │ └── utils │ │ ├── have-select-with-option.js │ │ ├── have-tag-with-attribute.js │ │ └── html-collector.js ├── practiceA-walkthrough │ ├── .gitignore │ ├── README.md │ ├── app.js │ ├── config │ │ └── config.json │ ├── images │ │ ├── new-person-screen.png │ │ └── person-list-screen.png │ ├── migrations │ │ ├── 20200731213100-create-hair-color.js │ │ └── 20200731213148-create-person.js │ ├── models │ │ ├── haircolor.js │ │ ├── index.js │ │ └── person.js │ ├── package-lock.json │ ├── package.json │ ├── seeders │ │ └── 20200731213510-add-hair-colors.js │ ├── test │ │ ├── 01-form-test.js │ │ ├── 02-submission-page.js │ │ ├── 03-main-page.js │ │ └── utils │ │ │ ├── have-select-with-option.js │ │ │ ├── have-tag-with-attribute.js │ │ │ └── html-collector.js │ └── views │ │ ├── create.pug │ │ └── index.pug ├── practiceB-images │ ├── noodle-id.png │ ├── pasta-create.png │ ├── root.png │ └── sauce-id.png ├── practiceB-solutions │ ├── README.md │ ├── app.js │ ├── config │ │ └── config.json │ ├── migrations │ │ ├── 20200802162832-create-noodle.js │ │ ├── 20200802162857-create-sauce.js │ │ └── 20200802162922-create-pasta.js │ ├── models │ │ ├── index.js │ │ ├── noodle.js │ │ ├── pasta.js │ │ └── sauce.js │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── application.css │ ├── seeders │ │ ├── 20200802163355-insert-noodles.js │ │ └── 20200802163552-insert-sauces.js │ └── views │ │ ├── layout.pug │ │ ├── noodle │ │ └── show.pug │ │ ├── pasta │ │ ├── create.pug │ │ └── index.pug │ │ └── sauce │ │ └── show.pug └── practiceB-starter │ ├── README.md │ ├── app.js │ ├── package-lock.json │ └── package.json ├── W12D2 ├── README.md ├── argon2.js ├── authentication.js ├── bcrypt.js ├── package-lock.json ├── package.json └── pbkdf2.js ├── W12D3 ├── README.md ├── api-walkthrough-hw │ ├── .env.example │ ├── .gitignore │ ├── .sequelizerc │ ├── README.md │ ├── app.js │ ├── bin │ │ └── www │ ├── config │ │ ├── database.js │ │ └── index.js │ ├── db │ │ ├── migrations │ │ │ ├── .keep │ │ │ └── 20200805230358-create-task.js │ │ ├── models │ │ │ ├── index.js │ │ │ └── task.js │ │ └── seeders │ │ │ ├── .keep │ │ │ └── 20200805230541-test-data.js │ ├── package-lock.json │ ├── package.json │ └── routes │ │ ├── index.js │ │ └── tasks.js └── http-vs-json-lecture-video │ ├── README.md │ ├── app.js │ ├── bin │ └── www │ ├── config │ └── config.json │ ├── data │ └── pets.js │ ├── documentation │ └── petrack-data-model.png │ ├── migrations │ ├── 20200415083051-create-pet-type.js │ ├── 20200415083213-create-pet.js │ ├── 20200415083249-create-owner.js │ └── 20200415083316-create-pet-owners.js │ ├── models │ ├── index.js │ ├── owner.js │ ├── pet.js │ ├── petowners.js │ └── pettype.js │ ├── package-lock.json │ ├── package.json │ ├── public │ └── stylesheets │ │ └── style.css │ ├── routes │ ├── api │ │ └── pets.js │ ├── index.js │ ├── owners.js │ └── pets.js │ ├── seeders │ ├── 20200415083852-insert-pet-types.js │ ├── 20200415084015-insert-pets.js │ ├── 20200415084307-insert-owners.js │ └── 20200415084430-insert-pet-owners.js │ └── views │ ├── error.pug │ ├── index.pug │ ├── layout.pug │ └── pets │ ├── detail.pug │ └── index.pug ├── W12D4 ├── README.md ├── jwt-demo.js ├── oauth-demo │ ├── .env.example │ ├── .gitignore │ ├── .sequelizerc │ ├── README.md │ ├── app.js │ ├── bin │ │ └── www │ ├── config │ │ ├── database.js │ │ └── index.js │ ├── db │ │ ├── migrations │ │ │ └── 20200806134623-create-user.js │ │ └── models │ │ │ ├── index.js │ │ │ └── user.js │ ├── package-lock.json │ ├── package.json │ └── views │ │ └── index.pug ├── package-lock.json ├── package.json └── token-based-auth-walkthrough │ ├── .env.example │ ├── .gitignore │ ├── .sequelizerc │ ├── README.md │ ├── app.js │ ├── auth.js │ ├── bin │ └── www │ ├── config │ ├── database.js │ └── index.js │ ├── db │ ├── migrations │ │ ├── .keep │ │ ├── 20200805230358-create-task.js │ │ └── 20200806012228-create-user.js │ ├── models │ │ ├── index.js │ │ ├── task.js │ │ └── user.js │ └── seeders │ │ ├── .keep │ │ └── 20200805230541-test-data.js │ ├── package-lock.json │ ├── package.json │ ├── routes │ ├── index.js │ ├── tasks.js │ └── users.js │ └── utils.js ├── W12D5 ├── README.md └── w12-filled-in-LOs.md ├── W13D1 ├── README.md └── setup-instructions.md ├── W14D1 ├── README.md ├── createElement │ ├── App.js │ ├── Clue.js │ ├── README.md │ ├── index.html │ ├── index.js │ └── styles.css ├── example.js ├── facebook.jpeg ├── practice.js └── solution.js ├── W14D2 ├── README.md ├── jsx-lecture │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── index.css │ │ └── index.js ├── jsx-solutions.zip └── jsx-solutions │ ├── .gitignore │ ├── README.md │ ├── package-lock.json │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ └── manifest.json │ └── src │ ├── App.js │ ├── Navigation.js │ ├── OwnerLink.js │ ├── OwnersList.js │ ├── PetDetailList.js │ ├── PetDetailPage.js │ ├── PetDetails.js │ ├── PetInformationItem.js │ ├── index.css │ └── index.js ├── W14D3 ├── README.md ├── component-lifecycle │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── Stopwatch.js │ │ ├── StopwatchManager.js │ │ └── index.js ├── intro-to-class-components │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── GuessingGame.js │ │ └── index.js ├── react-calculator-solution │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── Calculator.js │ │ └── index.js ├── reactClassComponentSyntax.md ├── reactComponentLifecycle.md ├── reactHandleEvents.md ├── reactState.md └── widgets-solution │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ └── index.html │ └── src │ ├── Auto.js │ ├── Clock.js │ ├── Folder.js │ ├── Root.js │ ├── Weather.js │ ├── index.js │ ├── stylesheets │ ├── index.css │ └── reset.css │ └── util.js ├── W14D4 ├── EOD.md ├── Phase4.md ├── README.md ├── ReactBuilds.md ├── ReactRouter.md ├── code │ └── router-basics │ │ ├── build │ │ ├── fonts │ │ │ └── OpenSans-Regular.ttf │ │ └── images │ │ │ └── image-loading.svg │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── public │ │ ├── fonts │ │ │ └── OpenSans-Regular.ttf │ │ ├── images │ │ │ ├── image-loading.svg │ │ │ └── react-builds-cat.png │ │ └── index.html │ │ └── src │ │ ├── App.js │ │ ├── BreedList.js │ │ ├── DogBrowser.js │ │ ├── DogPicture.js │ │ ├── index.css │ │ └── index.js ├── exploring-react-builds-solution+ │ ├── express-server │ │ ├── app.js │ │ ├── package-lock.json │ │ ├── package.json │ │ └── public │ │ │ ├── asset-manifest.json │ │ │ ├── index.html │ │ │ ├── precache-manifest.4019eea0b3ec7b22963e1fcb6ba6fe9e.js │ │ │ ├── service-worker.js │ │ │ └── static │ │ │ ├── css │ │ │ ├── main.15855541.chunk.css │ │ │ └── main.15855541.chunk.css.map │ │ │ ├── js │ │ │ ├── 2.32c33179.chunk.js │ │ │ ├── 2.32c33179.chunk.js.LICENSE.txt │ │ │ ├── 2.32c33179.chunk.js.map │ │ │ ├── main.822af6ca.chunk.js │ │ │ ├── main.822af6ca.chunk.js.map │ │ │ ├── runtime-main.5cd077e3.js │ │ │ └── runtime-main.5cd077e3.js.map │ │ │ └── media │ │ │ └── react-builds-cat.45f7f4d2.png │ └── react-build │ │ ├── README.md │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── public │ │ └── index.html │ │ ├── src │ │ ├── App.js │ │ ├── class-component │ │ │ ├── ClassComponent.js │ │ │ ├── Nothing.js │ │ │ ├── Other.js │ │ │ └── Something.js │ │ ├── css-modules │ │ │ ├── HeadingA.js │ │ │ ├── HeadingA.module.css │ │ │ ├── HeadingB.js │ │ │ └── HeadingB.module.css │ │ ├── image │ │ │ ├── Image.css │ │ │ ├── Image.js │ │ │ ├── bleu.jpg │ │ │ └── react-builds-cat.png │ │ ├── index.css │ │ └── index.js │ │ └── yarn.lock ├── images │ └── npm_start.png └── rainbow-routes-solution │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ └── index.html │ └── src │ ├── components │ ├── Blue.js │ ├── Green.js │ ├── Indigo.js │ ├── Orange.js │ ├── Rainbow.js │ ├── Red.js │ ├── Violet.js │ └── Yellow.js │ ├── index.css │ └── index.js ├── W14D5 ├── README.md ├── assessment-prep.md ├── context-to-do-list-solution.zip ├── context-to-do-list-solution │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── AppWithContext.js │ │ ├── components │ │ ├── Task.js │ │ ├── TodoForm.js │ │ └── TodoList.js │ │ ├── contexts │ │ └── TodoContext.js │ │ └── index.js ├── contextConsumer.md ├── contextProvider.md ├── creatingContext.md ├── practice-assessment-solution.zip ├── practice-assessment-solution │ ├── .gitignore │ ├── README.md │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── AboutPage.js │ │ ├── App.js │ │ ├── AppWithContext.js │ │ ├── HomePage.js │ │ ├── NameContext.js │ │ ├── Navigation.js │ │ ├── StaffBox.js │ │ ├── StaffPage.js │ │ ├── YourName.js │ │ ├── hello.js │ │ ├── index.css │ │ └── index.js ├── practice-assessment.zip ├── practice-assessment │ ├── README.md │ └── assets │ │ └── react-practice-assessment-image.gif ├── reading-react-context-solution │ ├── .gitignore │ ├── README.md │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── PupContext.js │ │ ├── PupForm.js │ │ ├── index.css │ │ ├── index.js │ │ └── pups │ │ ├── banana-pup.jpg │ │ ├── sleepy-pup.jpg │ │ └── speedy-pup.jpg ├── twitter-revisited-solution.zip ├── twitter-revisited-solution │ ├── twitter-back-end │ │ ├── .env.example │ │ ├── .gitignore │ │ ├── .sequelizerc │ │ ├── app.js │ │ ├── auth.js │ │ ├── bin │ │ │ └── www │ │ ├── config │ │ │ ├── database.js │ │ │ └── index.js │ │ ├── db │ │ │ ├── migrations │ │ │ │ ├── 20200410174004-create-user.js │ │ │ │ └── 20200410174005-create-tweet.js │ │ │ ├── models │ │ │ │ ├── index.js │ │ │ │ ├── tweet.js │ │ │ │ └── user.js │ │ │ └── seeders │ │ │ │ └── 20200406220345-test-data.js │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── routes │ │ │ ├── index.js │ │ │ ├── tweets.js │ │ │ └── users.js │ │ └── utils.js │ └── twitter-front-end │ │ ├── .gitignore │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── public │ │ └── index.html │ │ └── src │ │ ├── App.js │ │ ├── AppWithContext.js │ │ ├── Routes.js │ │ ├── components │ │ ├── Home.js │ │ ├── Profile.js │ │ └── session │ │ │ ├── LoginForm.js │ │ │ └── RegistrationForm.js │ │ ├── contexts │ │ ├── UserContext.js │ │ └── withContext.js │ │ ├── index.css │ │ └── index.js ├── updatingContext.md └── video-lecture │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ └── index.html │ └── src │ ├── App.js │ ├── components │ ├── Home.js │ └── Profile.js │ ├── contexts │ └── ThemeContext.js │ ├── index.css │ └── index.js ├── W15D1 ├── README.md └── redux-flow.png ├── W15D2 ├── 00ReduxWithReact.md ├── 01PreloadedState.md ├── 02-2ContainerComponenets.md ├── 02_1SplittingandCombiningReducers.md ├── README.md ├── solutions │ └── react-redux-todolist │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── public │ │ └── index.html │ │ └── src │ │ ├── App.js │ │ ├── actions │ │ └── taskActions.js │ │ ├── components │ │ ├── Task.js │ │ ├── TodoForm.js │ │ └── TodoList.js │ │ ├── index.js │ │ ├── localStorage.js │ │ ├── reducers │ │ └── tasksReducer.js │ │ └── store.js └── videoCode │ ├── 00-fruit-stand-redux-with-react │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── actions │ │ └── fruitActions.js │ │ ├── components │ │ ├── FruitBulkAdd.js │ │ ├── FruitList.js │ │ ├── FruitManager.js │ │ ├── FruitQuickAdd.js │ │ └── FruitSeller.js │ │ ├── index.css │ │ ├── index.js │ │ ├── localStorage.js │ │ ├── reducers │ │ └── fruitReducer.js │ │ └── store.js │ ├── 01-fruit-stand-redux-with-react-multiple-reducers │ ├── .gitignore │ ├── component-stubs │ │ ├── Farmer.js │ │ ├── FarmerHire.js │ │ ├── FarmerList.js │ │ └── FarmerManager.js │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── actions │ │ ├── farmersActions.js │ │ └── fruitActions.js │ │ ├── components │ │ ├── Farmer.js │ │ ├── FarmerHire.js │ │ ├── FarmerList.js │ │ ├── FarmerManager.js │ │ ├── FruitBulkAdd.js │ │ ├── FruitList.js │ │ ├── FruitManager.js │ │ ├── FruitQuickAdd.js │ │ └── FruitSeller.js │ │ ├── index.css │ │ ├── index.js │ │ ├── localStorage.js │ │ ├── reducers │ │ ├── farmersReducer.js │ │ ├── fruitReducer.js │ │ └── rootReducer.js │ │ └── store.js │ └── 02-fruit-stand-redux-with-react-containers │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ └── index.html │ └── src │ ├── App.js │ ├── actions │ ├── farmersActions.js │ └── fruitActions.js │ ├── components │ ├── Farmer.js │ ├── FarmerHire.js │ ├── FarmerList.js │ ├── FarmerManager.js │ ├── FarmerManagerContainer.js │ ├── FruitBulkAdd.js │ ├── FruitList.js │ ├── FruitManager.js │ ├── FruitManagerContainer.js │ ├── FruitQuickAdd.js │ └── FruitSeller.js │ ├── index.css │ ├── index.js │ ├── localStorage.js │ ├── reducers │ ├── farmersReducer.js │ ├── fruitReducer.js │ └── rootReducer.js │ └── store.js ├── W15D3 ├── README.md ├── connect.md ├── giphy-redux-solution.zip ├── giphy-redux-solution │ ├── .env.example │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── actions │ │ └── gifActions.js │ │ ├── components │ │ ├── App.js │ │ ├── AppContainer.js │ │ ├── GifsList.js │ │ ├── Root.js │ │ └── SearchBar.js │ │ ├── config.js │ │ ├── index.js │ │ ├── reducers │ │ ├── gifsReducer.js │ │ └── rootReducer.js │ │ ├── store.js │ │ └── util │ │ └── apiUtil.js ├── middleware.md ├── pokedex-redux-solution 2 │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ ├── server.js │ └── src │ │ ├── App.js │ │ ├── Fab.js │ │ ├── LoginPanel.js │ │ ├── LoginPanelRedux.js │ │ ├── LogoutButton.js │ │ ├── LogoutButtonRedux.js │ │ ├── PokemonBrowerRedux.js │ │ ├── PokemonBrowser.js │ │ ├── PokemonDetail.js │ │ ├── PokemonDetailRedux.js │ │ ├── PokemonForm.js │ │ ├── PokemonFormRedux.js │ │ ├── index.css │ │ ├── index.js │ │ └── store │ │ ├── authentication.js │ │ ├── configureStore.js │ │ └── pokemon.js ├── pokedex-redux-solution.zip ├── pokedex-redux-solution │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ ├── server.js │ └── src │ │ ├── App.js │ │ ├── Fab.js │ │ ├── LoginPanel.js │ │ ├── LoginPanelRedux.js │ │ ├── LogoutButton.js │ │ ├── LogoutButtonRedux.js │ │ ├── PokemonBrowser.js │ │ ├── PokemonBrowserRedux.js │ │ ├── PokemonDetail.js │ │ ├── PokemonDetailRedux.js │ │ ├── PokemonForm.js │ │ ├── PokemonFormRedux.js │ │ ├── index.css │ │ ├── index.js │ │ └── store │ │ ├── authentication.js │ │ ├── configureStore.js │ │ └── pokemon.js ├── provider.md ├── routes.js ├── thunk.md ├── twitter-backend │ ├── .env.example │ ├── .gitignore │ ├── .sequelizerc │ ├── README.md │ ├── app.js │ ├── bin │ │ └── www │ ├── config │ │ ├── database.js │ │ └── index.js │ ├── db │ │ ├── migrations │ │ │ ├── 20200810123100-create-user.js │ │ │ └── 20200810210044-create-tweet.js │ │ ├── models │ │ │ ├── index.js │ │ │ ├── tweet.js │ │ │ └── user.js │ │ └── seeders │ │ │ ├── 20200810123949-DemoUser.js │ │ │ └── 20200810211123-tweets.js │ ├── package-lock.json │ ├── package.json │ ├── public │ │ ├── css │ │ │ ├── auth.css │ │ │ ├── home.css │ │ │ ├── nav.css │ │ │ ├── reset.css │ │ │ └── tweet-show.css │ │ └── js │ │ │ ├── home.js │ │ │ ├── login.js │ │ │ ├── nav.js │ │ │ ├── signup.js │ │ │ ├── tweet-show.js │ │ │ └── utils │ │ │ └── auth.js │ └── routes │ │ ├── api │ │ ├── index.js │ │ ├── tweets.js │ │ └── users.js │ │ ├── index.js │ │ └── utils │ │ ├── auth.js │ │ └── index.js └── twitter-frontend │ ├── .gitignore │ ├── README.md │ ├── package-lock.json │ ├── package.json │ ├── public │ └── index.html │ └── src │ ├── App.js │ ├── components │ ├── Login.js │ ├── NavBar.js │ ├── NewTweet.js │ ├── SignUp.js │ ├── tweet-show │ │ ├── ConnectedTweetShow.js │ │ └── TweetShow.js │ └── tweets │ │ ├── ConnectedTweets.js │ │ ├── Tweet.js │ │ └── Tweets.js │ ├── index.css │ ├── index.js │ └── store │ ├── actions │ └── tweetActions.js │ ├── authentication.js │ ├── configureStore.js │ ├── middleware │ └── thunk.js │ └── reducers │ ├── rootReducer.js │ ├── tweetsReducer.js │ └── usersReducer.js ├── W15D4 ├── README.md ├── hooks-state-based-solution │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── LoginPanel.js │ │ ├── LogoutButton.js │ │ ├── PokemonBrowser.js │ │ ├── PokemonDetail.js │ │ ├── index.css │ │ ├── index.js │ │ └── routesUtil.js ├── intro-to-react-hooks │ ├── .gitignore │ ├── README.md │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── index.jsx │ │ ├── lifecycle_with_hooks.js │ │ ├── lifecycle_without_hooks.js │ │ ├── state_with_hooks.js │ │ └── state_without_hooks.js ├── intro-to-redux-hooks │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ │ └── index.html │ └── src │ │ ├── App.js │ │ ├── config.js │ │ ├── index.js │ │ └── store │ │ ├── configureStore.js │ │ └── ipAddress.js ├── intro-to-router-hooks │ ├── react-router-hooks │ │ ├── .gitignore │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── public │ │ │ └── index.html │ │ └── src │ │ │ ├── App.js │ │ │ ├── components │ │ │ ├── ComingSoon.js │ │ │ ├── Document.js │ │ │ ├── Home.js │ │ │ └── Report.js │ │ │ ├── index.css │ │ │ └── index.js │ ├── reading │ │ ├── .gitignore │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── public │ │ │ └── index.html │ │ └── src │ │ │ ├── components │ │ │ ├── ComingSoon.js │ │ │ ├── Document.js │ │ │ ├── Home.js │ │ │ └── Report.js │ │ │ ├── index.css │ │ │ └── index.js │ └── starter │ │ ├── .gitignore │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── public │ │ └── index.html │ │ └── src │ │ ├── App.js │ │ ├── components │ │ ├── ComingSoon.js │ │ ├── Document.js │ │ ├── Home.js │ │ └── Report.js │ │ ├── index.css │ │ └── index.js └── redux-fruit-stand │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ ├── public │ └── index.html │ └── src │ ├── App.js │ ├── actions │ ├── farmersActions.js │ └── fruitActions.js │ ├── components │ ├── Farmer.js │ ├── FarmerHire.js │ ├── FarmerList.js │ ├── FarmerManager.js │ ├── FarmerManagerContainer.js │ ├── FruitBulkAdd.js │ ├── FruitList.js │ ├── FruitManager.js │ ├── FruitManagerContainer.js │ ├── FruitQuickAdd.js │ └── FruitSeller.js │ ├── index.css │ ├── index.js │ ├── localStorage.js │ ├── reducers │ ├── farmersReducer.js │ ├── farmersSelectors.js │ ├── fruitReducer.js │ ├── fruitSelectors.js │ └── rootReducer.js │ └── store.js ├── W16D1 └── README.md ├── W17D0 ├── W17D0.0.md ├── W17D0.1.md ├── W17D0.2.md ├── W17D0.4.md ├── W17D0.md └── src │ └── namespaces_and_docstrings.py ├── W17D2 └── W17D2.md ├── W17D3 └── W17D3.md ├── W17D4 ├── knights_travails │ ├── __pycache__ │ │ └── tree.cpython-38.pyc │ ├── path_finder.py │ ├── test │ │ ├── __init__.py │ │ ├── __pycache__ │ │ │ ├── __init__.cpython-37.pyc │ │ │ ├── __init__.cpython-38.pyc │ │ │ ├── test_node.cpython-37.pyc │ │ │ └── test_node.cpython-38.pyc │ │ └── test_node.py │ └── tree.py └── src │ └── why_does_pythons_for_have_an_else.py ├── W17D5 ├── SupplementaryLOs.md ├── W17LOs.md ├── python_practice_problems │ ├── README.md │ ├── problem_01_while_filter.py │ ├── problem_02_for_filter.py │ ├── problem_03_my_comprehension.py │ ├── problem_04_if_statements.py │ ├── problem_05_class.py │ ├── problem_06_inheritance.py │ ├── problem_07_dict.py │ ├── problem_08_built_in.py │ ├── problem_09_get_set.py │ └── problem_10_func.py └── src │ └── bst_alternate_starter.py ├── W18D1 ├── README.md ├── another_package │ ├── __init__.py │ ├── __main__.py │ └── subpackage.py ├── my_package │ ├── __init__.py │ ├── __main__.py │ ├── module1.py │ ├── module2.py │ └── subpackage │ │ ├── module1.py │ │ └── module2.py ├── new_project │ ├── Pipfile │ ├── Pipfile.lock │ └── test │ │ ├── __init__.py │ │ ├── test_pytest.py │ │ └── test_unittest.py ├── pytest-package │ ├── Pipfile │ ├── Pipfile.lock │ ├── stack.py │ └── test │ │ ├── __init__.py │ │ └── test_stack.py ├── tdd-python-solution │ ├── Pipfile │ ├── Pipfile.lock │ ├── app │ │ ├── __init__.py │ │ └── roman_numerals.py │ ├── requirements.txt │ └── test │ │ ├── __init__.py │ │ ├── test_roman_numerals_pytest.py │ │ └── test_roman_numerals_unittest.py └── unittest-package │ ├── stack.py │ └── test │ ├── __init__.py │ └── test_stack.py ├── W18D2 ├── W18D2.md └── solution │ ├── Pipfile │ ├── Pipfile.lock │ ├── app │ ├── __init__.py │ ├── forms.py │ ├── routes.py │ ├── static │ │ ├── scripts │ │ │ └── calendar.js │ │ └── styles │ │ │ └── calendar.css │ └── template │ │ └── main.html │ ├── calendar_this.py │ └── database_setup.sql ├── W18D3 ├── README.md ├── intro-sql-alchemy │ ├── .flaskenv │ ├── .gitignore │ ├── Pipfile │ ├── Pipfile.lock │ ├── app │ │ ├── __init__.py │ │ ├── config.py │ │ ├── models.py │ │ └── routes.py │ ├── database.py │ └── intro.py ├── more-on-classes.md ├── more-on-classes.py └── order-up │ ├── .flaskenv │ ├── .gitignore │ ├── Pipfile │ ├── Pipfile.lock │ ├── app │ ├── __init__.py │ ├── config.py │ ├── forms.py │ ├── models.py │ ├── routes │ │ ├── __init__.py │ │ ├── orders.py │ │ └── session.py │ ├── static │ │ └── order-up.css │ └── templates │ │ ├── base.html │ │ ├── login.html │ │ └── orders.html │ ├── database.py │ └── order_up.py ├── W18D4 ├── W18D4.md └── d4hw.zip ├── W19D1 ├── Alpine_Linux.md ├── Linux_Basics.md ├── Python_Threading.md ├── README.MD └── code_examples │ ├── 00thread_lecture.py │ ├── 01locks.py │ └── 02deadlock.py ├── W19D2 ├── README.md ├── docker-bind-mount-commands.md ├── docker-container-commands.md ├── docker-network-commands.md ├── docker-volume-commands.md └── index.html ├── W19D3 ├── README.md └── dockerfile-example │ ├── .dockerignore │ ├── Dockerfile │ ├── app.py │ ├── hello.py │ └── requirements.txt ├── W19D4 ├── additionalResources.md ├── compose-pros-solution │ ├── phase1 │ │ └── docker-compose.yml │ ├── phase2 │ │ └── docker-compose.yml │ ├── phase3 │ │ └── docker-compose.yml │ └── phase4 │ │ ├── .dockerignore │ │ ├── Dockerfile │ │ └── docker-compose.yml ├── docker-compose.yml ├── dockerComposeCLI.md ├── dockerComposeImages.md ├── dockerComposeIntro.md ├── dockerfileAndProjects.md └── herokuUsingDocker.md ├── W19D5 └── W19D5 - microservices.md ├── W1D1 ├── LOs.md ├── README.md └── amLectureNotes.md ├── W1D2 ├── amLecture.js └── scratch.js ├── W1D3.zip ├── W1D3 ├── README.md ├── array_functions.js ├── functions.js ├── mutability.js ├── nested_loops.js ├── pairs_in_arrays.js ├── pairs_in_arrays.png └── unique_pairs_in_arrays.png ├── W1D4.zip ├── W1D4 ├── filterDemo.js ├── forEach.js ├── helperFunction.js ├── mapDemo.js └── reduceDemo.js ├── W1D5.zip ├── W1D5 ├── README.md ├── assessment_prep.js ├── learning_objectives.js └── structured_exception_handling.js ├── W2D2.zip ├── W2D2 ├── learningObjectives.js ├── objectDestructuring.js ├── objectLecture.js ├── primitiveVsReference.js └── spreadAndRest.js ├── W2D4.zip ├── W2D4 ├── README.md ├── arrow_functions.js ├── closeureLecture.js ├── closureCodeDemo.js ├── contextCodeDemo.js ├── contextLecture.js ├── eod.js ├── functions_cheatsheet.md └── variablesAndScope1.js ├── W2D5.zip ├── W2D5 ├── README.md ├── context.js └── morning_notes.js ├── W3D1.zip ├── W3D1 ├── README.md ├── call_stack.js ├── eod.js ├── event_loop.js ├── setInterval.js ├── setTimeout.js ├── single_vs_multi_threading.png ├── stack_vs_queue.png ├── sync_vs_async.js ├── threading.js └── user_input_in_node.js ├── W3D2 ├── README.md ├── file_io.js ├── foods.txt ├── git_branches.png ├── git_directories.png ├── git_rebase.png ├── my-first-written-file.txt ├── new_foods.txt ├── new_poem.txt └── poem.txt ├── W3D3 ├── shell.md └── ysh_install ├── W3D4 ├── LOs.js ├── Readme.md ├── caseStudy.js ├── debuggingRecursion.js ├── exponent.js ├── factorial.js ├── fibonacci.js ├── flatten.js ├── recursiveCallStack.js ├── recursiveIsEven.js ├── recursiveRange.js └── sum.js ├── W3D5 ├── amLecture.js ├── practice-problems.md └── w3 │ ├── d1.md │ ├── d2.md │ ├── d3.md │ ├── d4.md │ ├── truthy_falsy.md │ └── week-LO-review.md ├── W4D1 ├── README.md ├── async.png ├── browser_layers.png ├── defer.png ├── entry.js ├── index.html ├── no_async_defer.png └── request_response_cycle.png ├── W4D3 ├── EOD │ ├── endOfDay.css │ ├── endOfDay.html │ └── endOfDay.js ├── README.md ├── bubblingPrinciple │ ├── bubblingPrinciple.css │ ├── bubblingPrinciple.html │ └── bubblingPrinciple.js ├── commonPageEventsDemo │ ├── commonPageEvents.css │ ├── commonPageEvents.html │ └── commonPageEvents.js ├── dragAndDrop │ ├── dragAndDrop.css │ ├── dragAndDrop.html │ └── dragAndDrop.js ├── eventTarget │ ├── eventTarget.css │ ├── eventTarget.html │ └── eventTarget.js └── formValidationDemo │ ├── formValidation.css │ ├── formValidation.html │ └── formValidation.js ├── W4D4 ├── README.md ├── example.json ├── index.html ├── json_demo.js └── localStorage_demo.js ├── W5D1 ├── .gitignore ├── README.md ├── built-in-node-packages.md ├── index.js ├── package-lock.json ├── package.json └── using-npm.md ├── W5D2 ├── EOD │ └── index.js ├── README.md ├── classes │ ├── animal.js │ ├── cat.js │ └── index.js ├── es5_classes.js ├── es6_classes.js ├── folder1 │ ├── folder2 │ │ └── mammal.js │ └── other.js ├── folder3 │ └── platypus.js ├── index.js └── pairing_demo │ ├── README.md │ ├── index.html │ └── index.js ├── W5D3.zip ├── W5D3 ├── Enrichment_Materials.md ├── Learning_Objectives.md ├── Lecture_Notes.md ├── README.md ├── aa-class-diagram.pdf └── ls2.pdf ├── W5D4 ├── .gitignore ├── README.md ├── classStruceture.md ├── index.html ├── office │ ├── departments │ │ └── department.js │ ├── employees │ │ └── employee.js │ ├── index.js │ └── simulateBackend.js ├── package-lock.json ├── package.json └── stylesheets │ └── index.css ├── W5D5 ├── W05LOs-empty.md ├── W05LOs-eod.md ├── W05LOs-explained.md └── W5-review.zip ├── W6D2 ├── README.md ├── basicPromise.js ├── coffeeExample.js ├── nodeFetch.js ├── package-lock.json ├── package.json ├── promise-project-solution │ ├── .gitignore │ ├── commands.sh │ ├── curl.js │ ├── output.txt │ ├── output1.txt │ ├── output2.txt │ ├── package-lock.json │ ├── package.json │ └── response.txt └── promiseAll.js ├── W6D3 ├── README.md ├── async.js ├── promiseReview.js └── trivia-game-three-ways-project-solution │ ├── async-await-version.js │ ├── callback-version.js │ ├── game.css │ ├── game.js │ ├── index.html │ └── promise-version.js ├── W6D4 ├── README.md ├── dogs │ ├── README.md │ ├── node_modules │ │ ├── assertion-error │ │ │ ├── History.md │ │ │ ├── README.md │ │ │ ├── index.d.ts │ │ │ ├── index.js │ │ │ └── package.json │ │ ├── chai-spies │ │ │ ├── .travis.yml │ │ │ ├── History.md │ │ │ ├── LICENSE │ │ │ ├── README.md │ │ │ ├── ReleaseNotes.md │ │ │ ├── bower.json │ │ │ ├── chai-spies.js │ │ │ ├── component.json │ │ │ ├── index.js │ │ │ ├── lib │ │ │ │ └── spy.js │ │ │ ├── package.json │ │ │ └── support │ │ │ │ └── compile.js │ │ ├── chai │ │ │ ├── CODEOWNERS │ │ │ ├── CODE_OF_CONDUCT.md │ │ │ ├── CONTRIBUTING.md │ │ │ ├── History.md │ │ │ ├── LICENSE │ │ │ ├── README.md │ │ │ ├── ReleaseNotes.md │ │ │ ├── bower.json │ │ │ ├── chai.js │ │ │ ├── index.js │ │ │ ├── karma.conf.js │ │ │ ├── karma.sauce.js │ │ │ ├── lib │ │ │ │ ├── chai.js │ │ │ │ └── chai │ │ │ │ │ ├── assertion.js │ │ │ │ │ ├── config.js │ │ │ │ │ ├── core │ │ │ │ │ └── assertions.js │ │ │ │ │ ├── interface │ │ │ │ │ ├── assert.js │ │ │ │ │ ├── expect.js │ │ │ │ │ └── should.js │ │ │ │ │ └── utils │ │ │ │ │ ├── addChainableMethod.js │ │ │ │ │ ├── addLengthGuard.js │ │ │ │ │ ├── addMethod.js │ │ │ │ │ ├── addProperty.js │ │ │ │ │ ├── compareByInspect.js │ │ │ │ │ ├── expectTypes.js │ │ │ │ │ ├── flag.js │ │ │ │ │ ├── getActual.js │ │ │ │ │ ├── getEnumerableProperties.js │ │ │ │ │ ├── getMessage.js │ │ │ │ │ ├── getOwnEnumerableProperties.js │ │ │ │ │ ├── getOwnEnumerablePropertySymbols.js │ │ │ │ │ ├── getProperties.js │ │ │ │ │ ├── index.js │ │ │ │ │ ├── inspect.js │ │ │ │ │ ├── isNaN.js │ │ │ │ │ ├── isProxyEnabled.js │ │ │ │ │ ├── objDisplay.js │ │ │ │ │ ├── overwriteChainableMethod.js │ │ │ │ │ ├── overwriteMethod.js │ │ │ │ │ ├── overwriteProperty.js │ │ │ │ │ ├── proxify.js │ │ │ │ │ ├── test.js │ │ │ │ │ └── transferFlags.js │ │ │ ├── package.json │ │ │ ├── register-assert.js │ │ │ ├── register-expect.js │ │ │ ├── register-should.js │ │ │ └── sauce.browsers.js │ │ ├── check-error │ │ │ ├── LICENSE │ │ │ ├── README.md │ │ │ ├── check-error.js │ │ │ ├── index.js │ │ │ └── package.json │ │ ├── deep-eql │ │ │ ├── LICENSE │ │ │ ├── README.md │ │ │ ├── deep-eql.js │ │ │ ├── index.js │ │ │ └── package.json │ │ ├── get-func-name │ │ │ ├── LICENSE │ │ │ ├── README.md │ │ │ ├── get-func-name.js │ │ │ ├── index.js │ │ │ └── package.json │ │ ├── pathval │ │ │ ├── CHANGELOG.md │ │ │ ├── LICENSE │ │ │ ├── README.md │ │ │ ├── index.js │ │ │ ├── package.json │ │ │ └── pathval.js │ │ └── type-detect │ │ │ ├── LICENSE │ │ │ ├── README.md │ │ │ ├── index.js │ │ │ ├── package.json │ │ │ └── type-detect.js │ ├── package-lock.json │ ├── package.json │ ├── problems │ │ └── dog.js │ └── test │ │ └── dog-spec.js ├── jsErrorExamples.js ├── jsErrors.md ├── jsWritingTests.md └── whyWeTest.md ├── W6D5 ├── empty_LOs.md ├── eod.js └── filled_in_LOs.md ├── W7D1 ├── README.md ├── binarySearch.js ├── bubbleSort.js ├── compleityClasses.js ├── mergeSort.js └── search.js ├── W7D2 ├── EOD │ └── anagrams.js ├── LOs.md ├── memoization.js └── tabulation.js ├── W7D3 ├── README.md ├── binarysearch.gif ├── binarysearch.js ├── bubblesort.gif ├── bubblesort.js ├── bubblesort2.gif ├── insertionsort.gif ├── insertionsort.js ├── insertionsort2.gif ├── mergesort.gif ├── mergesort.js ├── mergesort2.gif ├── quicksort.gif ├── quicksort.js ├── quicksort2.gif ├── selectionsort.gif ├── selectionsort.js └── selectionsort2.gif ├── W7D4 ├── README.md ├── W7_empty_LOs.md ├── W7_filled_in_LOs.md └── lecture_notes.md ├── W8D1 ├── README.md ├── board.md ├── doubly-linked-list-removeFromTail.png ├── problem_set1.js ├── problem_set1.md ├── problem_set2.js ├── problem_set2.md └── removeFromTail.js ├── W8D2 ├── README.md ├── binarySearchTree.md ├── binaryTree.md ├── binaryTreeTraversal.pdf ├── binaryTrees.pdf ├── graphs.pdf └── tree_order_project_solution │ ├── lib │ ├── leet_code_105.js │ ├── tree_node.js │ └── tree_order.js │ ├── package-lock.json │ ├── package.json │ └── test │ └── test.js ├── W8D3 ├── README.md ├── eod │ ├── lib │ │ └── friends-of.js │ ├── package-lock.json │ ├── package.json │ └── test │ │ ├── 02-friends-of-spec.js │ │ └── names.js ├── graph.pdf ├── graphs.js └── graphs.md ├── W8D4 ├── README.md ├── binary-hexidecimal.md ├── convert-binary.png ├── convert-hexidecimal.png ├── dns.md ├── dropped-segment.svg ├── encapsulation.svg ├── eod.md ├── full-cycle.svg ├── hardware.md ├── internet-protocol.md ├── ipv4-headers.svg ├── ipv6-headers.svg ├── osi-model.svg ├── recap.md ├── tcp-headers.svg ├── tcp-ip-model.md ├── tcp-ip-model.svg ├── three-way-handshake.svg └── transport-protocols.md ├── W8D5 ├── README.md ├── W8-empty-LOs.md ├── W8-filled-in-LOs.md ├── binary-search-tree.png ├── encapsulation.svg ├── min-max-nodes-balanced.png ├── min-max-nodes-ll.png ├── number-tree.png └── tcp-ip-model.svg ├── W9D1 ├── README.md ├── hello.css ├── index.html ├── reset.css └── styles │ └── world.css ├── W9D2 ├── README.md ├── ajax-project-solution │ ├── index.js │ ├── package-lock.json │ ├── package.json │ └── public │ │ ├── events.js │ │ ├── index.css │ │ └── index.html ├── ajax.png ├── ajax.svg ├── example-project │ ├── README.md │ ├── index.html │ └── index.js ├── package-lock.json ├── package.json ├── pre-ajax.png └── pre-ajax.svg ├── W9D3 ├── Project Solutions │ ├── css-grid-project-solution │ │ ├── grid-project.css │ │ ├── grid-project.html │ │ └── nyt-logo.svg │ └── flexbox-project-solution │ │ ├── flexbox-project.css │ │ ├── flexbox-project.html │ │ └── trello-logo-white.png ├── README.md ├── css │ ├── box.css │ ├── flexbox.css │ ├── grid.css │ ├── mediaQueries.css │ ├── positioning.css │ ├── reset.css │ └── sticky.css ├── images │ ├── border-box.svg │ ├── content-box.svg │ └── the-box-model.svg ├── index.html └── lecture │ ├── 00BoxModel_HW_Review.md │ ├── 01Positioning.md │ ├── 02MediaQueries.md │ ├── 03FlexBox.md │ └── 04Grid.md ├── W9D4 ├── BEM.md ├── Interactivity-CSS │ ├── bem.html │ ├── index.css │ └── index.html ├── eod.md └── interactivity.md ├── W9D5 ├── MacOS-Postgres-Installation.md ├── README.md ├── W9_filled_in_LOs.md ├── Windows-Postgres-Installation.md ├── box-sizing-comparison.png ├── css_practice_assessment │ └── starter │ │ ├── README.md │ │ ├── test.html │ │ └── your-code.css ├── index.css └── index.html ├── assessment2Prep.zip └── assessment2Prep ├── README.md ├── add_folder.png ├── createCounter.md ├── d1.md ├── d2.md ├── d3.md ├── d4.md ├── d5.md ├── empty_learning_objectives.js ├── mutability.md └── returningFunctionDemo.js /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | 3 | node_modules/ 4 | 5 | W8D1/test.js 6 | 7 | .env 8 | 9 | .vscode/ 10 | 11 | __pycache__/ 12 | .venv/ 13 | .pytest_cache/ -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "python.pythonPath": ".pyenv" 3 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # May '20 Cohort Lecture Notes -------------------------------------------------------------------------------- /W10D4/.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules -------------------------------------------------------------------------------- /W10D4/change.txt: -------------------------------------------------------------------------------- 1 | Tests for testing the inserts? 2 | 3 | npm test command at the end of the README 4 | 5 | npm install command at the beginning 6 | 7 | add command to change environment in npx sequelize-cli README 8 | 9 | time for videos are wrong in SQL day 3 10 | 11 | -------------------------------------------------------------------------------- /W10D4/config/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "development": { 3 | "username": "pets_app", 4 | "password": "password", 5 | "database": "pets_dev", 6 | "host": "127.0.0.1", 7 | "dialect": "postgres", 8 | "seederStorage": "sequelize" 9 | }, 10 | "test": { 11 | "username": "pets_app", 12 | "password": "password", 13 | "database": "pets_test", 14 | "host": "127.0.0.1", 15 | "dialect": "postgres", 16 | "seederStorage": "sequelize" 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /W10D4/delete.js: -------------------------------------------------------------------------------- 1 | const { PetType, sequelize } = require('./models/index'); 2 | 3 | async function deleteBirdAndCat() { 4 | await PetType.destroy({ 5 | where: { 6 | type: ['Bird', 'Cat'] 7 | } 8 | }); 9 | 10 | sequelize.close(); 11 | } 12 | 13 | deleteBirdAndCat(); -------------------------------------------------------------------------------- /W10D4/models/petowner.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const PetOwner = sequelize.define('PetOwner', { 4 | petId: DataTypes.INTEGER, 5 | ownerId: DataTypes.INTEGER 6 | }, {}); 7 | PetOwner.associate = function(models) { 8 | // associations can be defined here 9 | PetOwner.belongsTo(models.Pet, { foreignKey: 'petId' }); 10 | PetOwner.belongsTo(models.Owner, { foreignKey: 'ownerId' }); 11 | }; 12 | return PetOwner; 13 | }; -------------------------------------------------------------------------------- /W10D4/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "pets-skeleton", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "pg": "^8.3.0", 14 | "sequelize": "^5.22.3", 15 | "sequelize-cli": "^5.5.1" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /W10D4/sql-orm-recipe-box-solution/models/measurementunit.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const MeasurementUnit = sequelize.define('MeasurementUnit', { 4 | name: DataTypes.STRING 5 | }, {}); 6 | MeasurementUnit.associate = function(models) { 7 | MeasurementUnit.hasMany(models.Ingredient, { foreignKey: 'measurementUnitId' }); 8 | }; 9 | return MeasurementUnit; 10 | }; 11 | -------------------------------------------------------------------------------- /W10D4/sql-orm-recipe-box-solution/models/recipe.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Recipe = sequelize.define('Recipe', { 4 | title: DataTypes.STRING 5 | }, {}); 6 | Recipe.associate = function(models) { 7 | Recipe.hasMany(models.Instruction, { foreignKey: 'recipeId', onDelete: 'CASCADE', hooks: true }); 8 | Recipe.hasMany(models.Ingredient, { foreignKey: 'recipeId', onDelete: 'CASCADE', hooks: true }); 9 | }; 10 | return Recipe; 11 | }; 12 | -------------------------------------------------------------------------------- /W10D4/update.js: -------------------------------------------------------------------------------- 1 | const { PetType, sequelize } = require('./models/index'); 2 | 3 | async function updateElephant() { 4 | const petType = await PetType.findByPk(4); // or whatever id type of Elephant is 5 | 6 | petType.type = "Hamster" // set it to have a new type 7 | 8 | await pettype.save(); // save the changes 9 | 10 | sequelize.close(); 11 | } 12 | 13 | updateElephant(); -------------------------------------------------------------------------------- /W10D5/sequelize-practice-assessment-solutions.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W10D5/sequelize-practice-assessment-solutions.zip -------------------------------------------------------------------------------- /W10D5/sequelize-practice-assessment-starter.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W10D5/sequelize-practice-assessment-starter.zip -------------------------------------------------------------------------------- /W10D5/sequelize-practice-walkthrough/images/class-enrollment-data-model.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W10D5/sequelize-practice-walkthrough/images/class-enrollment-data-model.png -------------------------------------------------------------------------------- /W10D5/sequelize-practice-walkthrough/models/campus.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Campus = sequelize.define('Campus', { 4 | name: DataTypes.STRING 5 | }, {}); 6 | Campus.associate = function(models) { 7 | // associations can be defined here 8 | Campus.hasMany(models.Course, { 9 | foreignKey: 'campusId' 10 | }); 11 | }; 12 | return Campus; 13 | }; -------------------------------------------------------------------------------- /W10D5/sequelize-practice-walkthrough/models/department.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Department = sequelize.define('Department', { 4 | name: DataTypes.STRING 5 | }, {}); 6 | Department.associate = function(models) { 7 | // associations can be defined here 8 | Department.hasMany(models.Course, { 9 | foreignKey: 'departmentId' 10 | }); 11 | }; 12 | return Department; 13 | }; -------------------------------------------------------------------------------- /W10D5/sequelize-practice-walkthrough/models/enrollment.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Enrollment = sequelize.define('Enrollment', { 4 | personId: DataTypes.INTEGER, 5 | courseId: DataTypes.INTEGER 6 | }, {}); 7 | Enrollment.associate = function(models) { 8 | // associations can be defined here 9 | }; 10 | return Enrollment; 11 | }; -------------------------------------------------------------------------------- /W10D5/sequelize-practice-walkthrough/models/person.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Person = sequelize.define('Person', { 4 | firstName: DataTypes.STRING, 5 | lastName: DataTypes.STRING, 6 | email: DataTypes.STRING 7 | }, {}); 8 | Person.associate = function(models) { 9 | Person.belongsToMany(models.Course, { 10 | through: models.Enrollment, 11 | foreignKey: 'personId', 12 | otherKey: 'courseId' 13 | }); 14 | }; 15 | return Person; 16 | }; -------------------------------------------------------------------------------- /W10D5/sequelize-practice-walkthrough/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "practice-orm", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "NODE_ENV=test mocha --timeout 5000" 8 | }, 9 | "author": "", 10 | "license": "ISC", 11 | "dependencies": { 12 | "chai": "^4.2.0", 13 | "mocha": "^7.1.1", 14 | "pg": "^8.0.0", 15 | "sequelize": "^5.21.5", 16 | "sequelize-cli": "^5.5.1", 17 | "umzug": "^2.3.0" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /W10D5/sequelize-practice-walkthrough/test/root-tests.js: -------------------------------------------------------------------------------- 1 | const { close } = require('./test-utils'); 2 | 3 | after(async () => { 4 | if (close) { 5 | await close(); 6 | } 7 | }); 8 | -------------------------------------------------------------------------------- /W10D5/sql-practice-assessment-solution.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W10D5/sql-practice-assessment-solution.zip -------------------------------------------------------------------------------- /W10D5/sql-practice-assessment-starter.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W10D5/sql-practice-assessment-starter.zip -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/create-countries-table.sql: -------------------------------------------------------------------------------- 1 | CREATE TABLE countries ( 2 | -- id SERIAL, 3 | id SERIAL PRIMARY KEY, 4 | name VARCHAR(100) NOT NULL, 5 | continent_name VARCHAR(20) NOT NULL 6 | -- PRIMARY KEY (id) 7 | ); -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/create-merchant-types-table.sql: -------------------------------------------------------------------------------- 1 | CREATE TABLE merchant_types ( 2 | id SERIAL PRIMARY KEY NOT NULL, 3 | type VARCHAR(20) NOT NULL 4 | ); -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/create-users-table.sql: -------------------------------------------------------------------------------- 1 | CREATE TABLE users ( 2 | id SERIAL PRIMARY KEY NOT NULL, 3 | full_name VARCHAR(255) NOT NULL, 4 | created_at TIMESTAMP NOT NULL 5 | ); -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/images/data-model.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W10D5/sql-practice-walkthrough/images/data-model.png -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/insert-countries-data.sql: -------------------------------------------------------------------------------- 1 | INSERT INTO countries (name, continent_name) 2 | VALUES 3 | ('Brazil', 'South America'), 4 | ('China', 'Asia' ), 5 | ('USA', 'North America'); -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/insert-merchant-types-data.sql: -------------------------------------------------------------------------------- 1 | INSERT INTO merchant_types (type) 2 | VALUES 3 | ('Retail' ), 4 | ('Wholesale'); -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/insert-merchants-data.sql: -------------------------------------------------------------------------------- 1 | INSERT INTO 2 | merchants (merchant_name ,country_id,created_at,admin_id,merchant_type_id) 3 | VALUES 4 | ('Zingo', 1, CURRENT_TIMESTAMP, 1, 1 ), 5 | ('Widgets International', 2, CURRENT_TIMESTAMP, 2, 2), 6 | ('Snglrify', 3, CURRENT_TIMESTAMP, 1, 1 ), 7 | ('Better Products 4 U', 3, CURRENT_TIMESTAMP, 1, 2); -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/insert-users-data.sql: -------------------------------------------------------------------------------- 1 | INSERT INTO users (full_name, created_at) 2 | VALUES 3 | ('Zaphod Beeblebrox', CURRENT_TIMESTAMP), 4 | ('Blart Versenwald III', CURRENT_TIMESTAMP); -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/joined-data-query.sql: -------------------------------------------------------------------------------- 1 | SELECT 2 | users.full_name, 3 | merchant_types.type, 4 | countries.name, 5 | merchants.merchant_name 6 | FROM countries 7 | JOIN merchants ON merchants.country_id = countries.id 8 | JOIN users ON users.id = merchants.admin_id 9 | JOIN merchant_types ON merchant_types.id = merchants.merchant_type_id 10 | ORDER BY merchants.merchant_name; -------------------------------------------------------------------------------- /W10D5/sql-practice-walkthrough/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "practice", 3 | "version": "1.0.0", 4 | "description": "In this assessment, you will create:", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "mocha" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "chai": "^4.2.0", 14 | "mocha": "^7.1.1", 15 | "pg": "^8.0.0" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /W11D1/node-http.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D1/node-http.jpeg -------------------------------------------------------------------------------- /W11D2/exploring-route-paths/banana/nested/index.pug: -------------------------------------------------------------------------------- 1 | html 2 | head 3 | title Routes to Test 4 | body 5 | h1 Routes to Test 6 | h2 Product Page 7 | ul 8 | each path in productPaths 9 | li: a(href=path class='class-name')= path 10 | h2 Products Page 11 | ul 12 | each path in productsPaths 13 | li 14 | a(href=path)= path -------------------------------------------------------------------------------- /W11D2/exploring-route-paths/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "exploring-route-paths", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "app.js", 6 | "scripts": { 7 | "start": "node app.js", 8 | "dev": "nodemon --inspect app.js" 9 | }, 10 | "keywords": [], 11 | "author": "", 12 | "license": "ISC", 13 | "dependencies": { 14 | "express": "^4.17.1", 15 | "pug": "^2.0.4" 16 | }, 17 | "devDependencies": { 18 | "nodemon": "^2.0.4" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /W11D2/intro-to-express/app.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | 3 | const app = express(); // application 4 | 5 | // configuration 6 | // connect to database 7 | // defining middlewares 8 | // routes 9 | 10 | const port = 5050; 11 | 12 | app.listen(port, () => console.log('Server is listening on port', port)); -------------------------------------------------------------------------------- /W11D2/render-html-templates/app.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | 3 | const app = express(); 4 | 5 | const port = 8081; 6 | 7 | app.set('view engine', 'pug'); 8 | 9 | // routes 10 | 11 | app.get('*', (req, res) => { 12 | res.render('error', { title: 'Welcome', heading: 'Home' }); 13 | }); 14 | 15 | app.listen(port, () => console.log('Server is listening on port', port)); -------------------------------------------------------------------------------- /W11D2/render-html-templates/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "render-html-templates", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "app.js", 6 | "scripts": { 7 | "start": "node --inspect app.js" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "express": "^4.17.1", 14 | "pug": "^2.0.4" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /W11D2/render-html-templates/views/layout.pug: -------------------------------------------------------------------------------- 1 | html 2 | head 3 | title= title 4 | body 5 | h1 Hello World! #{heading} 6 | h2= heading -------------------------------------------------------------------------------- /W11D3/README.md: -------------------------------------------------------------------------------- 1 | # Forms with Express 2 | 3 | ## CSRF Protection 4 | 5 | - use case (credit to Dustin!): 6 | This is super common in hospitality. And 3rd party vendors are usually the ones responsible, mimicking hotel's websites and pre-charging the customers with non-refundable rates. 7 | -------------------------------------------------------------------------------- /W11D3/formative-forms-solution-without-mixins/README.md: -------------------------------------------------------------------------------- 1 | ``` 2 | npm test test/01_home.test.js 3 | ``` 4 | 5 | 6 | select#favorite-beatle.form-control(name='favoriteBeatle') 7 | option(value="" disabled) --Please choose an option-- 8 | each beatle in ['John', 'Paul', 'Ringo', 'George', 'Scooby-Doo'] 9 | option(value=beatle selected=(beatle === favoriteBeatle? 'selected'))= beatle -------------------------------------------------------------------------------- /W11D3/formative-forms-solution-without-mixins/views/create.pug: -------------------------------------------------------------------------------- 1 | extends layout.pug 2 | 3 | block content 4 | h1= title 5 | include includes/form_errors 6 | form(action='/create' method='post') 7 | include includes/basic_info 8 | div 9 | input(type='submit' value="Create User" class='btn btn-primary') 10 | -------------------------------------------------------------------------------- /W11D3/formative-forms-solution-without-mixins/views/includes/basic_info.pug: -------------------------------------------------------------------------------- 1 | input(type='hidden' name="_csrf" value=csrfToken) 2 | input(name='firstName' placeholder='First Name:' type='text' value=firstName) 3 | input(name='lastName' placeholder='Last Name:' type='text' value=lastName) 4 | input(name='email' placeholder='Email:' type='email' value=email) 5 | input(name='password' placeholder='Password:' type='password') 6 | input(name='confirmedPassword' placeholder='Confirm Password:' type='password') -------------------------------------------------------------------------------- /W11D3/formative-forms-solution-without-mixins/views/includes/form_errors.pug: -------------------------------------------------------------------------------- 1 | if messages.length > 0 2 | div 3 | p The following errors were found: 4 | ul 5 | each message in messages 6 | li= message 7 | -------------------------------------------------------------------------------- /W11D3/pug-js-overview/config/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "development": { 3 | "username": "pets_app", 4 | "password": "password", 5 | "database": "pets_dev", 6 | "host": "127.0.0.1", 7 | "dialect": "postgres", 8 | "seederStorage": "sequelize" 9 | }, 10 | "test": { 11 | "username": "pets_app", 12 | "password": "password", 13 | "database": "pets_test", 14 | "host": "127.0.0.1", 15 | "dialect": "postgres", 16 | "seederStorage": "sequelize" 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /W11D3/pug-js-overview/controllers/owners/index.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const { Pet, Owner, PetType } = require('../../models'); 3 | 4 | const ownerRouter = express.Router(); 5 | 6 | ownerRouter.post('/', async (req, res) => { 7 | await Owner.createWithPets(req.body); 8 | res.redirect('/owners'); 9 | }); 10 | 11 | ownerRouter.get('/', async (req, res) => { 12 | const data = await Owner.getAllWithPets(); 13 | res.render('owners', data); 14 | }); 15 | 16 | module.exports = ownerRouter; -------------------------------------------------------------------------------- /W11D3/pug-js-overview/controllers/pets/index.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | 3 | const petRouter = express.Router(); 4 | 5 | petRouter.post('/', async (req, res) => { 6 | await Pet.createWithOwners(req.body); 7 | res.redirect('/pets'); 8 | }); 9 | 10 | 11 | petRouter.get('/', async (req, res) => { 12 | const data = await Pet.getAllWithPetTypesAndOwners(); 13 | res.render('pets', data); 14 | }); 15 | 16 | module.exports = petRouter; -------------------------------------------------------------------------------- /W11D3/pug-js-overview/models/petowner.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const PetOwner = sequelize.define('PetOwner', { 4 | petId: DataTypes.INTEGER, 5 | ownerId: DataTypes.INTEGER 6 | }, {}); 7 | PetOwner.associate = function(models) { 8 | // associations can be defined here 9 | PetOwner.belongsTo(models.Pet, { foreignKey: 'petId' }); 10 | PetOwner.belongsTo(models.Owner, { foreignKey: 'ownerId' }); 11 | }; 12 | return PetOwner; 13 | }; -------------------------------------------------------------------------------- /W11D3/pug-js-overview/views/layout.pug: -------------------------------------------------------------------------------- 1 | doctype 2 | html(lang='en') 3 | head 4 | meta(charset='utf-8') 5 | title Pet Track 6 | body 7 | header 8 | ul 9 | li: a(href="/pets") Pets 10 | li: a(href="/owners") Owners 11 | main 12 | block mainContent 13 | ul 14 | li hello 15 | footer 16 | block footer -------------------------------------------------------------------------------- /W11D3/pug-js-overview/views/pettypes.pug: -------------------------------------------------------------------------------- 1 | doctype 2 | html(lang='en') 3 | head 4 | meta(charset='utf-8') 5 | title Pet Types 6 | body 7 | ul 8 | each petType in petTypes 9 | li= petType.type 10 | ul 11 | each pet in petType.Pets 12 | li= pet.name -------------------------------------------------------------------------------- /W11D4/.env.example: -------------------------------------------------------------------------------- 1 | NODE_ENV=development 2 | PORT=port 3 | API_KEY=googleApiKey 4 | SECRET_KEY=secretKey 5 | DB_USERNAME=username 6 | DB_PASSWORD=password 7 | DB_URL=url -------------------------------------------------------------------------------- /W11D4/.gitignore: -------------------------------------------------------------------------------- 1 | .env -------------------------------------------------------------------------------- /W11D4/.sequelizerc: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | 'config': path.resolve('config', 'database.js'), 5 | 'models-path': path.resolve('db', 'models'), 6 | 'seeders-path': path.resolve('db', 'seeders'), 7 | 'migrations-path': path.resolve('db', 'migrations') 8 | }; -------------------------------------------------------------------------------- /W11D4/config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | environment: process.env.NODE_ENV || 'development', 3 | port: process.env.PORT || 8080, 4 | db: { 5 | username: process.env.DB_USERNAME, 6 | password: process.env.DB_PASSWORD, 7 | database: process.env.DB_DATABASE, 8 | host: process.env.DB_HOST, 9 | }, 10 | }; -------------------------------------------------------------------------------- /W11D4/config/database.js: -------------------------------------------------------------------------------- 1 | const { 2 | username, 3 | password, 4 | database, 5 | host, 6 | } = require('./index').db; 7 | console.log(username); 8 | console.log(password); 9 | console.log(database); 10 | module.exports = { 11 | development: { 12 | username, 13 | password, 14 | database, 15 | host, 16 | dialect: 'postgres', 17 | }, 18 | }; -------------------------------------------------------------------------------- /W11D4/config/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | environment: process.env.NODE_ENV || 'development', 3 | port: process.env.PORT || 8080, 4 | db: { 5 | username: process.env.DB_USERNAME, 6 | password: process.env.DB_PASSWORD, 7 | database: process.env.DB_DATABASE, 8 | host: process.env.DB_HOST, 9 | }, 10 | }; -------------------------------------------------------------------------------- /W11D4/views/error.pug: -------------------------------------------------------------------------------- 1 | doctype 2 | html(lang='en') 3 | head 4 | meta(charset='utf-8') 5 | title= title 6 | body 7 | h1= title 8 | h2 Message 9 | pre= message 10 | h2 Stack Trace 11 | pre= stack -------------------------------------------------------------------------------- /W11D4/views/index.pug: -------------------------------------------------------------------------------- 1 | doctype 2 | html(lang='en') 3 | head 4 | meta(charset='utf-8') 5 | title Handling Errors 6 | body 7 | h1 Users 8 | ul 9 | each user in users 10 | li= user.name -------------------------------------------------------------------------------- /W11D5/express-practiceA-solution.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/express-practiceA-solution.zip -------------------------------------------------------------------------------- /W11D5/express-practiceA-starter.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/express-practiceA-starter.zip -------------------------------------------------------------------------------- /W11D5/practiceA-solution/images/new-person-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceA-solution/images/new-person-screen.png -------------------------------------------------------------------------------- /W11D5/practiceA-solution/images/person-list-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceA-solution/images/person-list-screen.png -------------------------------------------------------------------------------- /W11D5/practiceA-solution/models/haircolor.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const HairColor = sequelize.define('HairColor', { 4 | color: DataTypes.STRING 5 | }, { 6 | timestamps: false 7 | }); 8 | HairColor.associate = function(models) { 9 | // associations can be defined here 10 | }; 11 | return HairColor; 12 | }; 13 | -------------------------------------------------------------------------------- /W11D5/practiceA-solution/test/utils/html-collector.js: -------------------------------------------------------------------------------- 1 | async function htmlCollector(res, callback) { 2 | let data = ''; 3 | for await (let chunk of res) { 4 | data += chunk; 5 | } 6 | callback(null, data); 7 | } 8 | 9 | module.exports = htmlCollector; -------------------------------------------------------------------------------- /W11D5/practiceA-starter/app.js: -------------------------------------------------------------------------------- 1 | /** 2 | * TODO: Create and configure your Express.js application in here. 3 | * You must name the variable that contains your Express.js 4 | * application "app" because that is what is exported at the 5 | * bottom of the file. 6 | */ 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | /* Do not change this export. The tests depend on it. */ 15 | try { 16 | exports.app = app; 17 | } catch(e) { 18 | exports.app = null; 19 | } 20 | -------------------------------------------------------------------------------- /W11D5/practiceA-starter/images/new-person-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceA-starter/images/new-person-screen.png -------------------------------------------------------------------------------- /W11D5/practiceA-starter/images/person-list-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceA-starter/images/person-list-screen.png -------------------------------------------------------------------------------- /W11D5/practiceA-starter/test/utils/html-collector.js: -------------------------------------------------------------------------------- 1 | async function htmlCollector(res, callback) { 2 | let data = ''; 3 | for await (let chunk of res) { 4 | data += chunk; 5 | } 6 | callback(null, data); 7 | } 8 | 9 | module.exports = htmlCollector; -------------------------------------------------------------------------------- /W11D5/practiceA-walkthrough/.gitignore: -------------------------------------------------------------------------------- 1 | nvm/ -------------------------------------------------------------------------------- /W11D5/practiceA-walkthrough/config/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "development": { 3 | "username": "express_practice_app", 4 | "password": "EzB5Dxo2dabnQBF8", 5 | "database": "express_practice_development", 6 | "host": "127.0.0.1", 7 | "dialect": "postgres", 8 | "seederStorage": "sequelize", 9 | "logging": false 10 | } 11 | } -------------------------------------------------------------------------------- /W11D5/practiceA-walkthrough/images/new-person-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceA-walkthrough/images/new-person-screen.png -------------------------------------------------------------------------------- /W11D5/practiceA-walkthrough/images/person-list-screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceA-walkthrough/images/person-list-screen.png -------------------------------------------------------------------------------- /W11D5/practiceA-walkthrough/models/haircolor.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const HairColor = sequelize.define('HairColor', { 4 | color: DataTypes.STRING 5 | }, {}); 6 | HairColor.associate = function(models) { 7 | // associations can be defined here 8 | HairColor.hasMany(models.Person, { 9 | foreignKey: 'hairColorId' 10 | }); 11 | }; 12 | return HairColor; 13 | }; -------------------------------------------------------------------------------- /W11D5/practiceA-walkthrough/test/utils/html-collector.js: -------------------------------------------------------------------------------- 1 | async function htmlCollector(res, callback) { 2 | let data = ''; 3 | for await (let chunk of res) { 4 | data += chunk; 5 | } 6 | callback(null, data); 7 | } 8 | 9 | module.exports = htmlCollector; -------------------------------------------------------------------------------- /W11D5/practiceA-walkthrough/views/create.pug: -------------------------------------------------------------------------------- 1 | form(action="/new-person" method="post") 2 | input(name="firstName" type="text" required) 3 | input(name="lastName" type="text" required) 4 | input(name="age" type="number") 5 | textarea(name="biography") 6 | select(name="hairColorId" required) 7 | each hairColor in hairColors 8 | option(value=hairColor.id)= hairColor.color 9 | input(type="hidden" name="_csrf" value= csrfToken) 10 | button(type="submit") -------------------------------------------------------------------------------- /W11D5/practiceA-walkthrough/views/index.pug: -------------------------------------------------------------------------------- 1 | table 2 | thead 3 | tr 4 | th First name 5 | th Last name 6 | th Age 7 | th Biography 8 | th Hair Color 9 | tbody 10 | each person in people 11 | tr 12 | td= person.firstName 13 | td= person.lastName 14 | td= person.age 15 | td= person.biography 16 | td= person.HairColor.color -------------------------------------------------------------------------------- /W11D5/practiceB-images/noodle-id.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceB-images/noodle-id.png -------------------------------------------------------------------------------- /W11D5/practiceB-images/pasta-create.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceB-images/pasta-create.png -------------------------------------------------------------------------------- /W11D5/practiceB-images/root.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceB-images/root.png -------------------------------------------------------------------------------- /W11D5/practiceB-images/sauce-id.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W11D5/practiceB-images/sauce-id.png -------------------------------------------------------------------------------- /W11D5/practiceB-solutions/config/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "development": { 3 | "username": "express_practice_b_app", 4 | "password": "password", 5 | "database": "express_practice_b_development", 6 | "host": "127.0.0.1", 7 | "dialect": "postgres", 8 | "seederStorage": "sequelize", 9 | "logging": false 10 | } 11 | } -------------------------------------------------------------------------------- /W11D5/practiceB-solutions/models/noodle.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Noodle = sequelize.define('Noodle', { 4 | name: DataTypes.STRING, 5 | stuffed: DataTypes.BOOLEAN 6 | }, {}); 7 | Noodle.associate = function(models) { 8 | // associations can be defined here 9 | Noodle.hasMany(models.Pasta, { foreignKey: 'noodleId' }); 10 | }; 11 | return Noodle; 12 | }; -------------------------------------------------------------------------------- /W11D5/practiceB-solutions/models/sauce.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Sauce = sequelize.define('Sauce', { 4 | name: DataTypes.STRING, 5 | color: DataTypes.STRING 6 | }, {}); 7 | Sauce.associate = function(models) { 8 | // associations can be defined here 9 | Sauce.hasMany(models.Pasta, { foreignKey: 'sauceId' }); 10 | }; 11 | return Sauce; 12 | }; -------------------------------------------------------------------------------- /W11D5/practiceB-solutions/public/application.css: -------------------------------------------------------------------------------- 1 | body > * { 2 | max-width: 500px; 3 | margin: 0 auto; 4 | } 5 | 6 | form { 7 | display: flex; 8 | flex-direction: column; 9 | width: 400px; 10 | } -------------------------------------------------------------------------------- /W11D5/practiceB-solutions/views/layout.pug: -------------------------------------------------------------------------------- 1 | doctype 2 | html(lang='en') 3 | head 4 | meta(charset='utf-8') 5 | title Pastas 6 | link(rel="stylesheet" href="/application.css") 7 | body 8 | nav 9 | ul 10 | li: a(href="/") Home 11 | li: a(href="/pasta/create") Create a Pasta 12 | block content -------------------------------------------------------------------------------- /W11D5/practiceB-solutions/views/noodle/show.pug: -------------------------------------------------------------------------------- 1 | extends ../pasta/index.pug 2 | 3 | block description 4 | h1= noodle.name 5 | p= noodle.stuffed ? "Stuffed" : "Not Stuffed" 6 | h2 Pastas created with this Noodle: -------------------------------------------------------------------------------- /W11D5/practiceB-solutions/views/sauce/show.pug: -------------------------------------------------------------------------------- 1 | extends ../pasta/index.pug 2 | 3 | block description 4 | h1= sauce.name 5 | p Color: #{sauce.color} 6 | h2 Pasta created with this Sauce: -------------------------------------------------------------------------------- /W11D5/practiceB-starter/app.js: -------------------------------------------------------------------------------- 1 | /** 2 | * TODO: Create and configure your Express.js application in here. 3 | * You must name the variable that contains your Express.js 4 | * application "app" because that is what is exported at the 5 | * bottom of the file. 6 | */ 7 | 8 | 9 | 10 | 11 | 12 | 13 | /* Do not change this export. The tests depend on it. */ 14 | try { 15 | exports.app = app; 16 | } catch(e) { 17 | exports.app = null; 18 | } 19 | -------------------------------------------------------------------------------- /W12D2/argon2.js: -------------------------------------------------------------------------------- 1 | const password = "my password"; 2 | 3 | (async () => { 4 | const argon2 = require("argon2"); 5 | // first argument is the password 6 | const hashedPwdForDb = await argon2.hash(password); 7 | console.log(hashedPwdForDb); 8 | })(); 9 | 10 | const checkPassword = async (password, hashedPwdForDb) => { 11 | return await argon2.verify(hashedPwdForDb, password); 12 | }; 13 | -------------------------------------------------------------------------------- /W12D2/authentication.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W12D2/authentication.js -------------------------------------------------------------------------------- /W12D2/bcrypt.js: -------------------------------------------------------------------------------- 1 | const password = 'my password'; 2 | 3 | (async () => { 4 | const bcrypt = require('bcryptjs'); 5 | // first argument is the password, second argument is the salt rounds 6 | const hashedPwdForDb = await bcrypt.hash(password, 8); 7 | console.log(hashedPwdForDb); 8 | console.log(await bcrypt.compare('hello', hashedPwdForDb)); 9 | })(); 10 | 11 | // const checkPassword = async (password, hashedPwdForDb) => { 12 | // } -------------------------------------------------------------------------------- /W12D2/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "W12D2", 3 | "version": "1.0.0", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "bcryptjs": { 8 | "version": "2.4.3", 9 | "resolved": "https://registry.npmjs.org/bcryptjs/-/bcryptjs-2.4.3.tgz", 10 | "integrity": "sha1-mrVie5PmBiH/fNrF2pczAn3x0Ms=" 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /W12D2/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "W12D2", 3 | "version": "1.0.0", 4 | "description": "## Symmetric vs Asymmetric Cryptographic Algorithms", 5 | "main": "bcrypt.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "bcryptjs": "^2.4.3" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/.env.example: -------------------------------------------------------------------------------- 1 | PORT=8080 2 | DB_USERNAME=postgres 3 | DB_PASSWORD= 4 | DB_DATABASE=«db_name» 5 | DB_HOST=localhost 6 | -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .DS_Store 3 | .env 4 | -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/.sequelizerc: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | 'config': path.resolve('config', 'database.js'), 5 | 'models-path': path.resolve('db', 'models'), 6 | 'seeders-path': path.resolve('db', 'seeders'), 7 | 'migrations-path': path.resolve('db', 'migrations') 8 | }; 9 | -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/README.md: -------------------------------------------------------------------------------- 1 | # Express Sequelize Starter 2 | 3 | -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/config/database.js: -------------------------------------------------------------------------------- 1 | const config = require("./index"); 2 | 3 | const db = config.db; 4 | const username = db.username; 5 | const password = db.password; 6 | const database = db.database; 7 | const host = db.host; 8 | 9 | module.exports = { 10 | development: { 11 | username, 12 | password, 13 | database, 14 | host, 15 | dialect: "postgres", 16 | }, 17 | }; 18 | -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/config/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | environment: process.env.NODE_ENV || "development", 3 | port: process.env.PORT || 8080, // default value is 8080 4 | db: { 5 | username: process.env.DB_USERNAME, 6 | password: process.env.DB_PASSWORD, 7 | database: process.env.DB_DATABASE, 8 | host: process.env.DB_HOST, 9 | }, 10 | }; 11 | 12 | // const variable = var2 ? 'world' : null; 13 | // const variable = var2 && 'world'; -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/db/migrations/.keep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W12D3/api-walkthrough-hw/db/migrations/.keep -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/db/models/task.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Task = sequelize.define('Task', { 4 | name: { 5 | type: DataTypes.STRING(255), 6 | allowNull: false 7 | } 8 | }, {}); 9 | Task.associate = function(models) { 10 | // associations can be defined here 11 | }; 12 | return Task; 13 | }; -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/db/seeders/.keep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W12D3/api-walkthrough-hw/db/seeders/.keep -------------------------------------------------------------------------------- /W12D3/api-walkthrough-hw/routes/index.js: -------------------------------------------------------------------------------- 1 | const express = require("express"); 2 | const router = express.Router(); 3 | 4 | router.get("/", (req, res) => { 5 | console.log('GET / handler'); 6 | res.json({ message: "Hello to the Express APIs demo app!" }); 7 | }); 8 | 9 | module.exports = router; -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/documentation/petrack-data-model.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W12D3/http-vs-json-lecture-video/documentation/petrack-data-model.png -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/models/petowners.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const PetOwners = sequelize.define('PetOwners', { 4 | petId: DataTypes.INTEGER, 5 | ownerId: DataTypes.INTEGER 6 | }, { 7 | timestamps: false 8 | }); 9 | PetOwners.associate = function(models) { 10 | // associations can be defined here 11 | }; 12 | return PetOwners; 13 | }; 14 | -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/models/pettype.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const PetType = sequelize.define('PetType', { 4 | type: DataTypes.STRING 5 | }, { 6 | timestamps: false 7 | }); 8 | PetType.associate = function(models) { 9 | // associations can be defined here 10 | }; 11 | return PetType; 12 | }; 13 | -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/public/stylesheets/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding: 50px; 3 | font: 14px "Lucida Grande", Helvetica, Arial, sans-serif; 4 | } 5 | 6 | a { 7 | color: #00B7FF; 8 | } 9 | -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/routes/index.js: -------------------------------------------------------------------------------- 1 | var express = require('express'); 2 | var router = express.Router(); 3 | 4 | /* GET home page. */ 5 | router.get('/', function(req, res, next) { 6 | res.render('index', { title: 'Petrack' }); 7 | }); 8 | 9 | module.exports = router; 10 | -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/routes/owners.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const asyncHandler = require('express-async-handler'); 3 | const { Pet, PetType, Owner } = require('../models'); 4 | const router = express.Router(); 5 | 6 | /* GET owners listing. */ 7 | router.get('/', asyncHandler(function(_, res) { 8 | res.end('respond with a resource'); 9 | })); 10 | 11 | module.exports = router; 12 | -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/views/error.pug: -------------------------------------------------------------------------------- 1 | extends layout 2 | 3 | block content 4 | h1= message 5 | h2= error.status 6 | pre #{error.stack} 7 | -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/views/index.pug: -------------------------------------------------------------------------------- 1 | extends layout 2 | 3 | block content 4 | p Welcome to #{title} 5 | p Choose a link above to do stuff 6 | -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/views/pets/detail.pug: -------------------------------------------------------------------------------- 1 | extends ../layout 2 | 3 | block content 4 | a(href="/pets") Back 5 | h1 Details 6 | dl 7 | dt Name 8 | dd= pet.name 9 | dt Age 10 | dd= pet.age 11 | dt Type 12 | dd= pet.PetType.type 13 | h2 Owners 14 | ul 15 | each owner in pet.Owners 16 | li: a(href="/owners" + owner.id) #{owner.lastName}, #{owner.firstName} 17 | -------------------------------------------------------------------------------- /W12D3/http-vs-json-lecture-video/views/pets/index.pug: -------------------------------------------------------------------------------- 1 | extends ../layout 2 | 3 | block content 4 | table.pure-table.pure-table-striped 5 | thead 6 | tr 7 | th Pet 8 | th Number of owners 9 | tbody 10 | each pet in pets 11 | tr 12 | td: a(href='/pets/' + pet.id)= pet.name 13 | td= pet.numberOfOwners 14 | -------------------------------------------------------------------------------- /W12D4/oauth-demo/.env.example: -------------------------------------------------------------------------------- 1 | PORT= 2 | DB_USERNAME= 3 | DB_PASSWORD= 4 | DB_DATABASE= 5 | DB_HOST= 6 | JWT_SECRET= 7 | JWT_EXPIRES_IN= 8 | GOOGLE_CLIENT_ID= 9 | GOOGLE_CLIENT_SECRET= -------------------------------------------------------------------------------- /W12D4/oauth-demo/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .env 3 | .DS_Store -------------------------------------------------------------------------------- /W12D4/oauth-demo/.sequelizerc: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | 'config': path.resolve('config', 'database.js'), 5 | 'models-path': path.resolve('db', 'models'), 6 | 'seeders-path': path.resolve('db', 'seeders'), 7 | 'migrations-path': path.resolve('db', 'migrations') 8 | }; 9 | -------------------------------------------------------------------------------- /W12D4/oauth-demo/README.md: -------------------------------------------------------------------------------- 1 | # OAuth 2.0 Demo 2 | 3 | See [app.js] and the comments 4 | 5 | [app.js]: ./app.js -------------------------------------------------------------------------------- /W12D4/oauth-demo/config/database.js: -------------------------------------------------------------------------------- 1 | const config = require("./index"); 2 | 3 | const db = config.db; 4 | const username = db.username; 5 | const password = db.password; 6 | const database = db.database; 7 | const host = db.host; 8 | 9 | module.exports = { 10 | development: { 11 | username, 12 | password, 13 | database, 14 | host, 15 | dialect: "postgres", 16 | }, 17 | }; 18 | -------------------------------------------------------------------------------- /W12D4/oauth-demo/views/index.pug: -------------------------------------------------------------------------------- 1 | doctype 2 | html(lang='en') 3 | head 4 | meta(charset='utf-8') 5 | title 6 | body 7 | h1= loggedIn? "Email: " + email : "Sign In" 8 | if (loggedIn) 9 | h2 Id: #{id} 10 | else 11 | a(href= href) Sign In with Google -------------------------------------------------------------------------------- /W12D4/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "W12D4", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "jwt-demo.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "atob": "^2.1.2", 14 | "btoa": "^1.2.1", 15 | "jsonwebtoken": "^8.5.1" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/.env.example: -------------------------------------------------------------------------------- 1 | PORT=8080 2 | DB_USERNAME=postgres 3 | DB_PASSWORD= 4 | DB_DATABASE=«db_name» 5 | DB_HOST=localhost 6 | -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .DS_Store 3 | .env 4 | -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/.sequelizerc: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | 'config': path.resolve('config', 'database.js'), 5 | 'models-path': path.resolve('db', 'models'), 6 | 'seeders-path': path.resolve('db', 'seeders'), 7 | 'migrations-path': path.resolve('db', 'migrations') 8 | }; 9 | -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/README.md: -------------------------------------------------------------------------------- 1 | # Express Sequelize Starter 2 | 3 | -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/config/database.js: -------------------------------------------------------------------------------- 1 | const config = require("./index"); 2 | 3 | const db = config.db; 4 | const username = db.username; 5 | const password = db.password; 6 | const database = db.database; 7 | const host = db.host; 8 | 9 | module.exports = { 10 | development: { 11 | username, 12 | password, 13 | database, 14 | host, 15 | dialect: "postgres", 16 | }, 17 | }; 18 | -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/config/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | environment: process.env.NODE_ENV || "development", 3 | port: process.env.PORT || 8080, 4 | db: { 5 | username: process.env.DB_USERNAME, 6 | password: process.env.DB_PASSWORD, 7 | database: process.env.DB_DATABASE, 8 | host: process.env.DB_HOST, 9 | }, 10 | jwtConfig: { 11 | secret: process.env.JWT_SECRET, 12 | expiresIn: process.env.JWT_EXPIRES_IN, 13 | }, 14 | }; 15 | -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/db/migrations/.keep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W12D4/token-based-auth-walkthrough/db/migrations/.keep -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/db/models/task.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Task = sequelize.define('Task', { 4 | name: { 5 | type: DataTypes.STRING(255), 6 | allowNull: false 7 | } 8 | }, {}); 9 | Task.associate = function(models) { 10 | // associations can be defined here 11 | }; 12 | return Task; 13 | }; -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/db/seeders/.keep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W12D4/token-based-auth-walkthrough/db/seeders/.keep -------------------------------------------------------------------------------- /W12D4/token-based-auth-walkthrough/routes/index.js: -------------------------------------------------------------------------------- 1 | const express = require("express"); 2 | const router = express.Router(); 3 | 4 | router.get("/", (req, res) => { 5 | console.log('GET / handler'); 6 | res.json({ message: "Hello to the Express APIs demo app!" }); 7 | }); 8 | 9 | module.exports = router; -------------------------------------------------------------------------------- /W14D1/createElement/App.js: -------------------------------------------------------------------------------- 1 | import 'https://unpkg.com/react@16/umd/react.development.js'; 2 | 3 | import Clue from './Clue.js'; 4 | 5 | const App = props => React.createElement( 6 | 'h1', 7 | null, 8 | props.clues.map(clue => React.createElement(Clue, { key: clue.id, ...clue })), 9 | ); 10 | 11 | App.defaultProps = { 12 | clues: [] 13 | }; 14 | 15 | export default App; 16 | -------------------------------------------------------------------------------- /W14D1/createElement/README.md: -------------------------------------------------------------------------------- 1 | # README 2 | 3 | To run this project, use a local Web server. For example: 4 | 5 | ``` 6 | python3 -m http.server 7 | ``` 8 | 9 | Then, open your Web browser to http://localhost:8000 10 | -------------------------------------------------------------------------------- /W14D1/createElement/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | React.createElement Example 7 | 8 | 9 | 10 |

React.createElement Example

11 |
12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /W14D1/facebook.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D1/facebook.jpeg -------------------------------------------------------------------------------- /W14D2/jsx-lecture/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D2/jsx-lecture/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Doge 6 | 7 | 8 |
9 | 10 | 11 | -------------------------------------------------------------------------------- /W14D2/jsx-lecture/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Dog = (props) => { 4 | const { url, banana } =props; 5 | 6 | return ( 7 |
8 | 9 |
{url}
10 |
11 | ); 12 | }; 13 | 14 | function App(props) { 15 | return ( 16 | props.urls.map(url => ) 17 | ); 18 | } 19 | 20 | App.defaultProps = { 21 | urls: [], 22 | }; 23 | 24 | export default App; 25 | -------------------------------------------------------------------------------- /W14D2/jsx-lecture/src/index.css: -------------------------------------------------------------------------------- 1 | /* TODO Add site wide styles */ 2 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D2/jsx-solutions.zip -------------------------------------------------------------------------------- /W14D2/jsx-solutions/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D2/jsx-solutions/public/favicon.ico -------------------------------------------------------------------------------- /W14D2/jsx-solutions/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "start_url": ".", 5 | "display": "standalone", 6 | "theme_color": "#000000", 7 | "background_color": "#ffffff" 8 | } 9 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import PetDetailPage from './PetDetailPage'; 4 | 5 | function App(props) { 6 | return ( 7 | 8 | ); 9 | } 10 | 11 | export default App; 12 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions/src/Navigation.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Navigation = () => 4 |
5 |

Petrack

6 | 16 |
17 | ; 18 | 19 | export default Navigation; 20 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions/src/OwnerLink.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const OwnerLink = props => 4 | 5 | {props.lastName}, {props.firstName} 6 | 7 | ; 8 | 9 | export default OwnerLink; 10 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions/src/PetDetailPage.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import Navigation from './Navigation'; 4 | import PetDetails from './PetDetails'; 5 | 6 | const PetDetailPage = props => 7 | <> 8 | 9 | 10 | 11 | ; 12 | 13 | export default PetDetailPage; 14 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions/src/PetDetails.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import OwnersList from './OwnersList'; 4 | import PetDetailList from './PetDetailList'; 5 | 6 | const PetDetails = props => 7 | <> 8 | 9 | 10 | 11 | ; 12 | 13 | PetDetails.defaultProps = { 14 | pet: { 15 | PetType: {}, 16 | }, 17 | }; 18 | 19 | export default PetDetails; 20 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions/src/PetInformationItem.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const PetInformationItem = props => 4 | <> 5 |
{props.name}
6 |
{props.value}
7 | 8 | ; 9 | 10 | PetInformationItem.defaultProps = { 11 | value: 'loading...', 12 | } 13 | 14 | export default PetInformationItem; 15 | -------------------------------------------------------------------------------- /W14D2/jsx-solutions/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding: 50px; 3 | font: 14px "Lucida Grande", Helvetica, Arial, sans-serif; 4 | } 5 | 6 | a { 7 | color: #00B7FF; 8 | } 9 | 10 | label { 11 | display: block; 12 | margin-bottom: .5em; 13 | } 14 | 15 | input { 16 | display: block; 17 | margin-bottom: 1em; 18 | } 19 | -------------------------------------------------------------------------------- /W14D3/component-lifecycle/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* -------------------------------------------------------------------------------- /W14D3/component-lifecycle/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Simple React App 7 | 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /W14D3/component-lifecycle/src/App.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | import StopwatchManager from "./StopwatchManager"; 4 | 5 | function App() { 6 | return ; 7 | } 8 | 9 | export default App; 10 | -------------------------------------------------------------------------------- /W14D3/component-lifecycle/src/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import App from "./App"; 4 | 5 | ReactDOM.render( 6 | 7 | 8 | , 9 | document.getElementById("root") 10 | ); 11 | -------------------------------------------------------------------------------- /W14D3/intro-to-class-components/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* -------------------------------------------------------------------------------- /W14D3/intro-to-class-components/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Simple React App 7 | 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /W14D3/intro-to-class-components/src/App.js: -------------------------------------------------------------------------------- 1 | import GuessingGame from './GuessingGame'; 2 | import React from 'react'; 3 | 4 | function App() { 5 | return ( 6 | 7 | ); 8 | } 9 | 10 | export default App; -------------------------------------------------------------------------------- /W14D3/intro-to-class-components/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render( 6 | 7 | 8 | , 9 | document.getElementById('root') 10 | ); -------------------------------------------------------------------------------- /W14D3/react-calculator-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D3/react-calculator-solution/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import Calculator from './Calculator'; 3 | 4 | const App = () => ( 5 |
6 |

Calculator

7 | 8 |
9 | ); 10 | 11 | export default App; 12 | -------------------------------------------------------------------------------- /W14D3/react-calculator-solution/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render( 6 | 7 | 8 | , 9 | document.getElementById('root') 10 | ); 11 | -------------------------------------------------------------------------------- /W14D3/widgets-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D3/widgets-solution/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Widgets 8 | 9 | 10 |
11 | 12 | -------------------------------------------------------------------------------- /W14D3/widgets-solution/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './stylesheets/reset.css'; 4 | import './stylesheets/index.css'; 5 | import Root from './Root'; 6 | 7 | document.addEventListener('DOMContentLoaded', () => { 8 | // Uncomment the below debugger for the debugger waterfall 9 | // debugger; 10 | ReactDOM.render( 11 | 12 | 13 | , 14 | document.getElementById('root') 15 | ); 16 | }) -------------------------------------------------------------------------------- /W14D3/widgets-solution/src/util.js: -------------------------------------------------------------------------------- 1 | export const toQueryString = (params) => { 2 | const parts = []; 3 | for (let key in params) { 4 | let val = encodeURIComponent(params[key]); 5 | 6 | if (params[key]) { 7 | parts.push(`${key}=${val}`); 8 | } 9 | } 10 | return parts.join('&'); 11 | } -------------------------------------------------------------------------------- /W14D4/code/router-basics/build/fonts/OpenSans-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D4/code/router-basics/build/fonts/OpenSans-Regular.ttf -------------------------------------------------------------------------------- /W14D4/code/router-basics/public/fonts/OpenSans-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D4/code/router-basics/public/fonts/OpenSans-Regular.ttf -------------------------------------------------------------------------------- /W14D4/code/router-basics/public/images/react-builds-cat.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D4/code/router-basics/public/images/react-builds-cat.png -------------------------------------------------------------------------------- /W14D4/code/router-basics/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Simple React App 7 | 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /W14D4/code/router-basics/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import DogBrowser from './DogBrowser'; 4 | 5 | function App() { 6 | return ( 7 | 8 | ); 9 | } 10 | 11 | export default App; -------------------------------------------------------------------------------- /W14D4/code/router-basics/src/BreedList.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { NavLink } from 'react-router-dom'; 3 | 4 | const BreedList = props => 5 |
6 | {props.breeds.map(breed => ( 7 |
8 | 10 | {breed} 11 | 12 |
13 | ))} 14 |
15 | ; 16 | 17 | export default BreedList; -------------------------------------------------------------------------------- /W14D4/code/router-basics/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ); -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/express-server/app.js: -------------------------------------------------------------------------------- 1 | const express = require("express"); 2 | const path = require("path"); 3 | 4 | const app = express(); 5 | 6 | app.use(express.static(path.join(__dirname, "public"))); 7 | 8 | app.get("*", function (req, res) { 9 | res.sendFile(path.join(__dirname, "public", "index.html")); 10 | }); 11 | 12 | const port = 9000; 13 | 14 | app.listen(port, () => console.log(`Listening on port ${port}...`)); 15 | -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/express-server/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "express-server", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "express": "^4.17.1" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/express-server/public/static/css/main.15855541.chunk.css: -------------------------------------------------------------------------------- 1 | .bleu{width:250px}.HeadingA_heading__2jDs0{color:green}.HeadingB_heading__TNlwb{color:red}.cat{background-image:url(/static/media/react-builds-cat.45f7f4d2.png);width:400px;height:400px} 2 | /*# sourceMappingURL=main.15855541.chunk.css.map */ -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/express-server/public/static/media/react-builds-cat.45f7f4d2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D4/exploring-react-builds-solution+/express-server/public/static/media/react-builds-cat.45f7f4d2.png -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | %REACT_APP_TITLE% 6 | 7 | 8 |
9 | 10 | 11 | -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/class-component/Nothing.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | class Nothing extends React.Component { 4 | constructor (props) { 5 | super(props); 6 | } 7 | 8 | render () { 9 | return

Nothing

10 | } 11 | } 12 | 13 | export default Nothing; -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/class-component/Other.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | class Other extends React.Component { 4 | constructor (props) { 5 | super(props); 6 | } 7 | 8 | render () { 9 | return

Other

10 | } 11 | } 12 | 13 | export default Other; -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/class-component/Something.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | class Something extends React.Component { 4 | constructor (props) { 5 | super(props); 6 | } 7 | 8 | render () { 9 | return

Something

10 | } 11 | } 12 | 13 | export default Something; -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/css-modules/HeadingA.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import styles from './HeadingA.module.css'; 3 | 4 | function HeadingA() { 5 | return ( 6 |

Heading A

7 | ); 8 | } 9 | 10 | export default HeadingA; -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/css-modules/HeadingA.module.css: -------------------------------------------------------------------------------- 1 | .heading { 2 | color: green; 3 | } -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/css-modules/HeadingB.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import styles from './HeadingB.module.css'; 3 | 4 | function HeadingB() { 5 | return ( 6 |

Heading B

7 | ); 8 | } 9 | 10 | export default HeadingB; -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/css-modules/HeadingB.module.css: -------------------------------------------------------------------------------- 1 | .heading { 2 | color: red; 3 | } -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/image/Image.css: -------------------------------------------------------------------------------- 1 | .cat { 2 | background-image: url(./react-builds-cat.png); 3 | width: 400px; 4 | height: 400px; 5 | } -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/image/Image.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import "./Image.css"; 3 | import cat from "./react-builds-cat.png"; 4 | 5 | console.log(cat); // /static/media/react-builds-cat.45f7f4d2.png 6 | 7 | function Image() { 8 | return ( 9 |
10 | {/* Import result is the URL of your image. */} 11 | Cat 12 |
13 |
14 | ); 15 | } 16 | 17 | export default Image; 18 | -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/image/bleu.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D4/exploring-react-builds-solution+/react-build/src/image/bleu.jpg -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/image/react-builds-cat.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D4/exploring-react-builds-solution+/react-build/src/image/react-builds-cat.png -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/index.css: -------------------------------------------------------------------------------- 1 | /* TODO Add site wide styles */ 2 | .bleu { 3 | width: 250px; 4 | } 5 | 6 | .active { 7 | font-weight: 900; 8 | } 9 | 10 | .nav-link { 11 | display: block; 12 | height: fit-content; 13 | } -------------------------------------------------------------------------------- /W14D4/exploring-react-builds-solution+/react-build/src/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import "./index.css"; 4 | import App from "./App"; 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById("root") 11 | ); 12 | -------------------------------------------------------------------------------- /W14D4/images/npm_start.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D4/images/npm_start.png -------------------------------------------------------------------------------- /W14D4/rainbow-routes-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D4/rainbow-routes-solution/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Rainbow Router 7 | 8 | 9 |
10 | 11 | -------------------------------------------------------------------------------- /W14D4/rainbow-routes-solution/src/components/Green.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Green = () => ( 4 |
5 |

Green

6 |
7 | ); 8 | 9 | export default Green; 10 | -------------------------------------------------------------------------------- /W14D4/rainbow-routes-solution/src/components/Indigo.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Indigo = () => ( 4 |
5 |

Indigo

6 |
7 | ); 8 | 9 | export default Indigo; 10 | -------------------------------------------------------------------------------- /W14D4/rainbow-routes-solution/src/components/Orange.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Orange = () => ( 4 |
5 |

Orange

6 |
7 | ); 8 | 9 | export default Orange; 10 | -------------------------------------------------------------------------------- /W14D4/rainbow-routes-solution/src/components/Violet.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Violet = () => ( 4 |
5 |

Violet

6 |
7 | ); 8 | 9 | export default Violet; 10 | -------------------------------------------------------------------------------- /W14D4/rainbow-routes-solution/src/components/Yellow.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Yellow = () => ( 4 |
5 |

Yellow

6 |
7 | ); 8 | 9 | export default Yellow; 10 | -------------------------------------------------------------------------------- /W14D4/rainbow-routes-solution/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import { BrowserRouter } from 'react-router-dom'; 5 | import Rainbow from './components/Rainbow'; 6 | 7 | const Root = () => ( 8 | 9 | 10 | 11 | ); 12 | 13 | document.addEventListener('DOMContentLoaded', () => { 14 | ReactDOM.render( 15 | , 16 | document.getElementById('root'), 17 | ); 18 | }); 19 | -------------------------------------------------------------------------------- /W14D5/context-to-do-list-solution.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D5/context-to-do-list-solution.zip -------------------------------------------------------------------------------- /W14D5/context-to-do-list-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D5/context-to-do-list-solution/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | To-do List 6 | 7 | 8 |
9 | 10 | 11 | -------------------------------------------------------------------------------- /W14D5/context-to-do-list-solution/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import TodoForm from './components/TodoForm'; 3 | import TodoList from './components/TodoList'; 4 | 5 | const App = () => ( 6 |
7 |

To-do List

8 | 9 | 10 |
11 | ); 12 | 13 | export default App; 14 | -------------------------------------------------------------------------------- /W14D5/context-to-do-list-solution/src/components/Task.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Task = ({ task, deleteTask }) => { 4 | const handleClick = () => { 5 | deleteTask(task.id); 6 | } 7 | 8 | return ( 9 |
  • 10 |

    {task.message}

    11 | 12 |
    • 13 | ); 14 | } 15 | 16 | export default Task; 17 | -------------------------------------------------------------------------------- /W14D5/context-to-do-list-solution/src/contexts/TodoContext.js: -------------------------------------------------------------------------------- 1 | import { createContext } from "react"; 2 | 3 | const TodoContext = createContext(); 4 | 5 | export default TodoContext; 6 | -------------------------------------------------------------------------------- /W14D5/context-to-do-list-solution/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import AppWithContext from './AppWithContext'; 4 | 5 | ReactDOM.render( 6 | 7 | 8 | , 9 | document.getElementById('root') 10 | ); 11 | -------------------------------------------------------------------------------- /W14D5/creatingContext.md: -------------------------------------------------------------------------------- 1 | 2 | # Creating a Context 3 | In order to use React Context we need to create a Context Object by invoking the method `React.createContext()` 4 | 5 | Usually this will be done in a file in our `src/context/` directory. 6 | 7 | Ex: 8 | ```javascript 9 | // src/context/SampleContext.js 10 | 11 | import { createContext } from 'react'; 12 | 13 | const SampleContext = createContext(); 14 | 15 | export default SampleContext; 16 | ``` 17 | 18 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D5/practice-assessment-solution.zip -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Simple React App 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/src/AboutPage.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const AboutPage = props => 4 |
    5 |

    {props.company.name}

    6 |

    {props.company.about.story}

    7 |
    8 | ; 9 | 10 | export default AboutPage; 11 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/src/HomePage.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import YourName from './YourName'; 4 | 5 | const HomePage = props => 6 |
    7 |

    {props.company.name}

    8 |

    {props.company.established}

    9 |

    {props.company.description}

    10 | 11 |
    12 | ; 13 | 14 | export default HomePage; 15 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/src/NameContext.js: -------------------------------------------------------------------------------- 1 | import { createContext } from 'react'; 2 | 3 | const NameContext = createContext(); 4 | 5 | export default NameContext; 6 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/src/StaffBox.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const StaffBox = props => 4 |
    5 |
    {props.name}
    6 |
    {props.title}
    7 | {props.name} 8 |
    9 | ; 10 | 11 | export default StaffBox; 12 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/src/StaffPage.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import StaffBox from './StaffBox'; 3 | 4 | const StaffPage = props => 5 | <> 6 | { props.staff.map(person => ) } 7 | 8 | ; 9 | 10 | export default StaffPage; 11 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/src/YourName.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import NameContext from './NameContext'; 3 | 4 | const YourName = () => 5 | 6 | {value => } 7 | 8 | ; 9 | 10 | export default YourName; 11 | -------------------------------------------------------------------------------- /W14D5/practice-assessment-solution/src/index.css: -------------------------------------------------------------------------------- 1 | /* TODO Add site wide styles */ 2 | -------------------------------------------------------------------------------- /W14D5/practice-assessment.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D5/practice-assessment.zip -------------------------------------------------------------------------------- /W14D5/practice-assessment/assets/react-practice-assessment-image.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D5/practice-assessment/assets/react-practice-assessment-image.gif -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/README.md: -------------------------------------------------------------------------------- 1 | 2 | # React Context Pups Starter 3 | -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Simple React App 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/src/PupContext.js: -------------------------------------------------------------------------------- 1 | import { createContext } from "react"; 2 | 3 | const PupContext = createContext(); 4 | 5 | export default PupContext; -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding: 50px; 3 | } 4 | 5 | #app { 6 | display: flex; 7 | flex-direction: column; 8 | width: 500px; 9 | } 10 | 11 | img { 12 | width: 500px; 13 | } -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ); 12 | -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/src/pups/banana-pup.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D5/reading-react-context-solution/src/pups/banana-pup.jpg -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/src/pups/sleepy-pup.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D5/reading-react-context-solution/src/pups/sleepy-pup.jpg -------------------------------------------------------------------------------- /W14D5/reading-react-context-solution/src/pups/speedy-pup.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D5/reading-react-context-solution/src/pups/speedy-pup.jpg -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W14D5/twitter-revisited-solution.zip -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-back-end/.env.example: -------------------------------------------------------------------------------- 1 | PORT=8080 2 | DB_USERNAME=twitter_lite_app 3 | DB_PASSWORD=«the twitter_lite_app user password» 4 | DB_DATABASE=twitter_lite 5 | DB_HOST=localhost 6 | JWT_SECRET=«generate_strong_secret_here» 7 | JWT_EXPIRES_IN=604800 8 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-back-end/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .env -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-back-end/.sequelizerc: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | 'config': path.resolve('config', 'database.js'), 5 | 'models-path': path.resolve('db', 'models'), 6 | 'seeders-path': path.resolve('db', 'seeders'), 7 | 'migrations-path': path.resolve('db', 'migrations') 8 | }; 9 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-back-end/config/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | environment: process.env.NODE_ENV || "development", 3 | port: process.env.PORT || 8080, 4 | db: { 5 | username: process.env.DB_USERNAME, 6 | password: process.env.DB_PASSWORD, 7 | database: process.env.DB_DATABASE, 8 | host: process.env.DB_HOST, 9 | }, 10 | jwtConfig: { 11 | secret: process.env.JWT_SECRET, 12 | expiresIn: process.env.JWT_EXPIRES_IN, 13 | }, 14 | }; 15 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-back-end/db/models/tweet.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | module.exports = (sequelize, DataTypes) => { 3 | const Tweet = sequelize.define( 4 | "Tweet", 5 | { 6 | message: { 7 | type: DataTypes.STRING(280), 8 | allowNull: false, 9 | }, 10 | }, 11 | {} 12 | ); 13 | Tweet.associate = function (models) { 14 | Tweet.belongsTo(models.User, { 15 | as: "user", 16 | foreignKey: "userId", 17 | }); 18 | }; 19 | return Tweet; 20 | }; 21 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-back-end/routes/index.js: -------------------------------------------------------------------------------- 1 | const express = require("express"); 2 | const router = express.Router(); 3 | 4 | router.get("/", (req, res) => { 5 | res.send("index root"); 6 | }); 7 | 8 | module.exports = router; 9 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-front-end/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-front-end/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Simple React App 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-front-end/src/contexts/UserContext.js: -------------------------------------------------------------------------------- 1 | import { createContext } from "react"; 2 | 3 | const UserContext = createContext(); 4 | 5 | export default UserContext; 6 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-front-end/src/contexts/withContext.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import UserContext from './UserContext'; 3 | 4 | // Bonus: Higher order components 5 | const withContext = (Component) => { 6 | return function ContextComponent(props) { 7 | return ( 8 | 9 | {value => } 10 | 11 | ); 12 | } 13 | } 14 | 15 | export default withContext; 16 | -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-front-end/src/index.css: -------------------------------------------------------------------------------- 1 | /* TODO Add site wide styles */ 2 | 3 | .active { 4 | font-weight: bold; 5 | } -------------------------------------------------------------------------------- /W14D5/twitter-revisited-solution/twitter-front-end/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import { BrowserRouter } from 'react-router-dom'; 4 | import './index.css'; 5 | import AppWithContext from './AppWithContext'; 6 | 7 | ReactDOM.render( 8 | 9 | 10 | 11 | 12 | , 13 | document.getElementById("root") 14 | ); 15 | -------------------------------------------------------------------------------- /W14D5/video-lecture/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* -------------------------------------------------------------------------------- /W14D5/video-lecture/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | React Context 7 | 8 | 9 | 10 |
    11 | 12 | 13 | -------------------------------------------------------------------------------- /W14D5/video-lecture/src/components/Home.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Profile from "./Profile"; 3 | 4 | const Home = () => ( 5 |
    6 | 7 |
    8 | ); 9 | 10 | export default Home; 11 | -------------------------------------------------------------------------------- /W14D5/video-lecture/src/contexts/ThemeContext.js: -------------------------------------------------------------------------------- 1 | import { createContext } from "react"; 2 | 3 | const ThemeContext = createContext(); 4 | 5 | export default ThemeContext; 6 | -------------------------------------------------------------------------------- /W14D5/video-lecture/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0px; 3 | } 4 | 5 | #app { 6 | width: 100vw; 7 | height: 100vh; 8 | } 9 | 10 | #home { 11 | height: 100%; 12 | display: flex; 13 | justify-content: center; 14 | align-items: center; 15 | } -------------------------------------------------------------------------------- /W14D5/video-lecture/src/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import "./index.css"; 4 | import App from "./App"; 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById("root") 11 | ); 12 | -------------------------------------------------------------------------------- /W15D1/redux-flow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W15D1/redux-flow.png -------------------------------------------------------------------------------- /W15D2/solutions/react-redux-todolist/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | To-do List 7 | 8 | 9 | 10 |
    11 | 12 | 13 | -------------------------------------------------------------------------------- /W15D2/solutions/react-redux-todolist/src/components/Task.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Task = ({ task, deleteTask }) => { 4 | const handleClick = () => { 5 | debugger 6 | deleteTask(task.id); 7 | } 8 | 9 | return ( 10 |
  • 11 |

    {task.message}

    12 | 13 |
    • 14 | ); 15 | } 16 | 17 | export default Task; -------------------------------------------------------------------------------- /W15D2/solutions/react-redux-todolist/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | import { store } from './store'; 5 | import { createTask, deleteTask } from './actions/taskActions'; 6 | 7 | window.store = store; 8 | window.createTask = createTask; 9 | window.deleteTask = deleteTask; 10 | 11 | ReactDOM.render( 12 | 13 | 14 | , 15 | document.getElementById('root') 16 | ); -------------------------------------------------------------------------------- /W15D2/solutions/react-redux-todolist/src/store.js: -------------------------------------------------------------------------------- 1 | import { createStore } from 'redux'; 2 | import tasksReducer from './reducers/tasksReducer'; 3 | import { loadState, saveState } from './localStorage'; 4 | 5 | const preloadedState = loadState(); 6 | debugger 7 | export const store = createStore(tasksReducer, preloadedState); 8 | 9 | store.subscribe(() => { 10 | const tasksState = store.getState(); 11 | console.log(tasksState); 12 | saveState(tasksState); 13 | }); 14 | -------------------------------------------------------------------------------- /W15D2/videoCode/00-fruit-stand-redux-with-react/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D2/videoCode/00-fruit-stand-redux-with-react/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Fruit Stand 6 | 7 | 8 | 9 |
    10 | 11 | 12 | -------------------------------------------------------------------------------- /W15D2/videoCode/00-fruit-stand-redux-with-react/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import FruitManager from './components/FruitManager'; 3 | 4 | function App() { 5 | return ( 6 | <> 7 |

    Fruit Stand

    8 | 9 | 10 | ); 11 | } 12 | 13 | export default App; 14 | -------------------------------------------------------------------------------- /W15D2/videoCode/00-fruit-stand-redux-with-react/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: 'Varela Round', sans-serif; 3 | } 4 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/component-stubs/Farmer.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Farmer = ({ farmer, pay }) => { 4 | const handleClick = () => pay(farmer.id); 5 | 6 | return ( 7 |
  • 8 | {farmer.name} 9 | {farmer.paid === false && 10 | 11 | } 12 |
    • 13 | ); 14 | }; 15 | 16 | export default Farmer; 17 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/component-stubs/FarmerManager.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import FarmerList from './FarmerList'; 3 | import FarmerHire from './FarmerHire'; 4 | 5 | class FarmerManager extends React.Component { 6 | render() { 7 | return ( 8 |
    9 |

    Farmer Manager

    10 | 11 | 12 |
    13 | ); 14 | } 15 | } 16 | 17 | export default FarmerManager; 18 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Fruit Stand 6 | 7 | 8 | 9 |
    10 | 11 | 12 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import FruitManager from './components/FruitManager'; 3 | import FarmerManager from './components/FarmerManager'; 4 | 5 | function App() { 6 | return ( 7 | <> 8 |

    Fruit Stand

    9 | 10 | 11 | 12 | ); 13 | } 14 | 15 | export default App; 16 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/src/actions/farmersActions.js: -------------------------------------------------------------------------------- 1 | export const HIRE_FARMER = 'HIRE_FARMER'; 2 | export const PAY_FARMER = 'PAY_FARMER'; 3 | 4 | export const hireFarmer = (name) => ({ 5 | type: HIRE_FARMER, 6 | id: new Date().getTime(), 7 | name, 8 | }); 9 | 10 | export const payFarmer = (id) => ({ 11 | type: PAY_FARMER, 12 | id, 13 | }); 14 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/src/components/Farmer.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Farmer = ({ farmer, pay }) => { 4 | const handleClick = () => pay(farmer.id); 5 | 6 | return ( 7 |
  • 8 | {farmer.name} 9 | {farmer.paid === false && 10 | 11 | } 12 |
    • 13 | ); 14 | }; 15 | 16 | export default Farmer; 17 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/src/components/FarmerManager.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import FarmerList from './FarmerList'; 3 | import FarmerHire from './FarmerHire'; 4 | 5 | class FarmerManager extends React.Component { 6 | render() { 7 | return ( 8 |
    9 |

    Farmer Manager

    10 | 11 | 12 |
    13 | ); 14 | } 15 | } 16 | 17 | export default FarmerManager; 18 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: 'Varela Round', sans-serif; 3 | } 4 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | import store from './store'; 6 | 7 | window.store = store; 8 | 9 | ReactDOM.render( 10 | 11 | 12 | , 13 | document.getElementById('root') 14 | ); 15 | -------------------------------------------------------------------------------- /W15D2/videoCode/01-fruit-stand-redux-with-react-multiple-reducers/src/reducers/rootReducer.js: -------------------------------------------------------------------------------- 1 | import { combineReducers } from 'redux'; 2 | import fruitReducer from './fruitReducer'; 3 | import farmersReducer from './farmersReducer'; 4 | 5 | const rootReducer = combineReducers({ 6 | fruit: fruitReducer, 7 | farmers: farmersReducer 8 | }); 9 | 10 | export default rootReducer; 11 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Fruit Stand 6 | 7 | 8 | 9 |
    10 | 11 | 12 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import FruitManagerContainer from './components/FruitManagerContainer'; 3 | import FarmerManagerContainer from './components/FarmerManagerContainer'; 4 | 5 | function App() { 6 | return ( 7 | <> 8 |

    Fruit Stand

    9 | 10 | 11 | 12 | ); 13 | } 14 | 15 | export default App; 16 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/actions/farmersActions.js: -------------------------------------------------------------------------------- 1 | export const HIRE_FARMER = 'HIRE_FARMER'; 2 | export const PAY_FARMER = 'PAY_FARMER'; 3 | 4 | export const hireFarmer = (name) => ({ 5 | type: HIRE_FARMER, 6 | id: new Date().getTime(), 7 | name, 8 | }); 9 | 10 | export const payFarmer = (id) => ({ 11 | type: PAY_FARMER, 12 | id, 13 | }); 14 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/components/Farmer.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Farmer = ({ farmer, pay }) => { 4 | const handleClick = () => pay(farmer.id); 5 | 6 | return ( 7 |
  • 8 | {farmer.name} 9 | {farmer.paid === false && 10 | 11 | } 12 |
    • 13 | ); 14 | }; 15 | 16 | export default Farmer; 17 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/components/FarmerManager.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import FarmerList from './FarmerList'; 3 | import FarmerHire from './FarmerHire'; 4 | 5 | const FarmerManager = ({ farmers, pay, hire }) => { 6 | return ( 7 |
    8 |

    Farmer Manager

    9 | 10 | 11 |
    12 | ); 13 | }; 14 | 15 | export default FarmerManager; 16 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/components/FruitList.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const FruitList = ({ fruit }) => { 4 | return ( 5 |
    6 | {fruit.length > 0 7 | ?
      {fruit.map((fruitName, index) =>
    • {fruitName}
      • )}
    8 | : No fruit currently in stock! 9 | } 10 |
    11 | ); 12 | }; 13 | 14 | export default FruitList; 15 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/components/FruitQuickAdd.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const FruitQuickAdd = ({ add }) => { 4 | const handleClick = (event) => add(event.target.innerText); 5 | 6 | return ( 7 |
    8 |

    Quick Add

    9 | 10 | 11 |
    12 | ); 13 | }; 14 | 15 | export default FruitQuickAdd; 16 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: 'Varela Round', sans-serif; 3 | } 4 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | import store from './store'; 6 | 7 | window.store = store; 8 | 9 | ReactDOM.render( 10 | 11 | 12 | , 13 | document.getElementById('root') 14 | ); 15 | -------------------------------------------------------------------------------- /W15D2/videoCode/02-fruit-stand-redux-with-react-containers/src/reducers/rootReducer.js: -------------------------------------------------------------------------------- 1 | import { combineReducers } from 'redux'; 2 | import fruitReducer from './fruitReducer'; 3 | import farmersReducer from './farmersReducer'; 4 | 5 | const rootReducer = combineReducers({ 6 | fruit: fruitReducer, 7 | farmers: farmersReducer 8 | }); 9 | 10 | export default rootReducer; 11 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W15D3/giphy-redux-solution.zip -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/.env.example: -------------------------------------------------------------------------------- 1 | REACT_APP_GIPHY_API_KEY= -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Giphy Search 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/actions/gifActions.js: -------------------------------------------------------------------------------- 1 | import * as APIUtil from '../util/apiUtil'; 2 | 3 | export const RECEIVE_GIFS = 'RECEIVE_GIFS'; 4 | 5 | const receiveGifs = gifs => { 6 | return { 7 | type: RECEIVE_GIFS, 8 | gifs: gifs, 9 | }; 10 | }; 11 | 12 | export const fetchGifs = searchTerm => dispatch => ( 13 | APIUtil.fetchGifs(searchTerm) 14 | .then(res => res.json()) 15 | .then(res => dispatch(receiveGifs(res.data))) 16 | ); 17 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/components/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import GifsList from './GifsList'; 3 | import SearchBar from './SearchBar'; 4 | 5 | const App = ({ gifUrls, fetchGifs }) => ( 6 | <> 7 | 8 | 9 | 10 | ); 11 | 12 | export default App; 13 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/components/GifsList.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const GifsList = ({ gifUrls }) => ( 4 |
    5 | {gifUrls.map((url, i) => ( 6 | gif 7 | ))} 8 |
    9 | ); 10 | 11 | export default GifsList; 12 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/components/Root.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Provider } from 'react-redux'; 3 | import AppContainer from './AppContainer'; 4 | 5 | const Root = ({ store }) => ( 6 | 7 | 8 | 9 | ); 10 | 11 | export default Root; 12 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/config.js: -------------------------------------------------------------------------------- 1 | export const apiKey = process.env.REACT_APP_GIPHY_API_KEY; 2 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/reducers/gifsReducer.js: -------------------------------------------------------------------------------- 1 | import { RECEIVE_GIFS } from '../actions/gifActions'; 2 | 3 | const gifsReducer = (state = [], action) => { 4 | switch (action.type) { 5 | case RECEIVE_GIFS: 6 | return action.gifs; 7 | default: 8 | return state; 9 | } 10 | }; 11 | 12 | export default gifsReducer; 13 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/reducers/rootReducer.js: -------------------------------------------------------------------------------- 1 | import { combineReducers } from 'redux'; 2 | import gifsReducer from './gifsReducer'; 3 | 4 | export default combineReducers({ 5 | gifs: gifsReducer, 6 | }); 7 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/store.js: -------------------------------------------------------------------------------- 1 | import { createStore, applyMiddleware } from 'redux'; 2 | import thunk from 'redux-thunk'; 3 | import logger from 'redux-logger'; 4 | import rootReducer from './reducers/rootReducer'; 5 | 6 | const configureStore = () => { 7 | return createStore(rootReducer, applyMiddleware(thunk, logger)); 8 | }; 9 | 10 | export default configureStore; 11 | -------------------------------------------------------------------------------- /W15D3/giphy-redux-solution/src/util/apiUtil.js: -------------------------------------------------------------------------------- 1 | import { apiKey } from '../config'; 2 | 3 | export const fetchGifs = searchTerm => ( 4 | fetch(`http://api.giphy.com/v1/gifs/search?api_key=${apiKey}&q=${searchTerm}&limit=3`) 5 | ); 6 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution 2/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution 2/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | State-Based Pokedex 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution 2/server.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const path = require('path'); 3 | const port = process.env.PORT || 8080; 4 | const app = express(); 5 | app.use(express.static(__dirname)); 6 | app.use(express.static(path.join(__dirname, 'build'))); 7 | app.get('/ping', function (req, res) { 8 | return res.send('pong'); 9 | }); 10 | app.get('/*', function (req, res) { 11 | res.sendFile(path.join(__dirname, 'build', 'index.html')); 12 | }); 13 | app.listen(port); 14 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution 2/src/Fab.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Fab = props => { 4 | return ( 5 |
    6 | ➕ 7 |
    8 | ); 9 | } 10 | 11 | export default Fab; 12 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution 2/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | import { Provider } from 'react-redux'; 6 | import configureStore from './store/configureStore'; 7 | 8 | const store = configureStore(); 9 | 10 | ReactDOM.render( 11 | 12 | 13 | 14 | 15 | , 16 | document.getElementById('root') 17 | ); 18 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W15D3/pokedex-redux-solution.zip -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | State-Based Pokedex 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution/server.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const path = require('path'); 3 | const port = process.env.PORT || 8080; 4 | const app = express(); 5 | app.use(express.static(__dirname)); 6 | app.use(express.static(path.join(__dirname, 'build'))); 7 | app.get('/ping', function (req, res) { 8 | return res.send('pong'); 9 | }); 10 | app.get('/*', function (req, res) { 11 | res.sendFile(path.join(__dirname, 'build', 'index.html')); 12 | }); 13 | app.listen(port); 14 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution/src/Fab.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Fab = props => { 4 | return ( 5 |
    6 | ➕ 7 |
    8 | ); 9 | } 10 | 11 | export default Fab; 12 | -------------------------------------------------------------------------------- /W15D3/pokedex-redux-solution/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | import { Provider } from 'react-redux'; 6 | import configureStore from './store/configureStore'; 7 | 8 | const store = configureStore(); 9 | 10 | ReactDOM.render( 11 | 12 | 13 | 14 | 15 | , 16 | document.getElementById('root') 17 | ); 18 | -------------------------------------------------------------------------------- /W15D3/twitter-backend/.env.example: -------------------------------------------------------------------------------- 1 | DB_USERNAME=twitter_lite_app 2 | DB_PASSWORD= 3 | DB_DATABASE=twitter_lite_development 4 | DB_HOST=localhost 5 | PORT= 6 | JWT_SECRET= 7 | JWT_EXPIRES_IN=604800 -------------------------------------------------------------------------------- /W15D3/twitter-backend/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .env 3 | .DS_Store -------------------------------------------------------------------------------- /W15D3/twitter-backend/.sequelizerc: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | 'config': path.resolve('config', 'database.js'), 5 | 'models-path': path.resolve('db', 'models'), 6 | 'seeders-path': path.resolve('db', 'seeders'), 7 | 'migrations-path': path.resolve('db', 'migrations') 8 | }; -------------------------------------------------------------------------------- /W15D3/twitter-backend/bin/www: -------------------------------------------------------------------------------- 1 | const app = require('../app'); 2 | const db = require('../db/models'); 3 | const { port } = require('../config'); 4 | 5 | db.sequelize.authenticate() 6 | .then(() => { 7 | console.log('Connected to database successfully'); 8 | app.listen(port, () => console.log('Server is listening on port', port)); 9 | }) 10 | .catch(() => { 11 | console.log('Error connecting to database'); 12 | }); -------------------------------------------------------------------------------- /W15D3/twitter-backend/config/database.js: -------------------------------------------------------------------------------- 1 | const config = require("./index"); 2 | 3 | const db = config.db; 4 | const username = db.username; 5 | const password = db.password; 6 | const database = db.database; 7 | const host = db.host; 8 | 9 | module.exports = { 10 | development: { 11 | username, 12 | password, 13 | database, 14 | host, 15 | dialect: "postgres", 16 | seederStorage: "sequelize" 17 | }, 18 | }; 19 | -------------------------------------------------------------------------------- /W15D3/twitter-backend/config/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | environment: process.env.NODE_ENV || "development", 3 | port: process.env.PORT || 8080, 4 | db: { 5 | username: process.env.DB_USERNAME || 'postgres', 6 | password: process.env.DB_PASSWORD, 7 | database: process.env.DB_DATABASE, 8 | host: process.env.DB_HOST, 9 | }, 10 | jwtConfig: { 11 | secret: process.env.JWT_SECRET, 12 | expiresIn: process.env.JWT_EXPIRES_IN, 13 | } 14 | }; -------------------------------------------------------------------------------- /W15D3/twitter-backend/routes/index.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const router = express.Router(); 3 | const apiRouter = require('./api'); 4 | 5 | router.use('/api', apiRouter); 6 | 7 | module.exports = router; -------------------------------------------------------------------------------- /W15D3/twitter-frontend/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D3/twitter-frontend/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Twitter Lite 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D3/twitter-frontend/src/components/tweet-show/TweetShow.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | const TweetShow = ({ tweet, user }) => { 4 | return ( 5 | <> 6 |

    The Tweet!

    7 |
    8 |

    {tweet.message}

    9 |

    Author: {user.username}

    10 |

    Created at: {tweet.createdAt}

    11 |
    12 | 13 | ); 14 | }; 15 | 16 | export default TweetShow; 17 | -------------------------------------------------------------------------------- /W15D3/twitter-frontend/src/components/tweets/Tweet.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { NavLink } from 'react-router-dom'; 3 | 4 | const Tweet = ({tweet, user}) => { 5 | return ( 6 |
  • 7 |

    {tweet.message}

    8 |

    Author: {user.username}

    9 | Show Tweet! 10 |
    • 11 | ) 12 | }; 13 | 14 | export default Tweet; -------------------------------------------------------------------------------- /W15D3/twitter-frontend/src/components/tweets/Tweets.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import Tweet from './Tweet'; 3 | 4 | const Tweets = ({tweets, users}) => { 5 | return( 6 | <> 7 |

    Tweets!

    8 |
      9 | {Object.values(tweets).map(tweet =>( 10 | 11 | ))} 12 |
    13 | 14 | ) 15 | }; 16 | 17 | export default Tweets; -------------------------------------------------------------------------------- /W15D3/twitter-frontend/src/index.css: -------------------------------------------------------------------------------- 1 | /* TODO Add site wide styles */ 2 | -------------------------------------------------------------------------------- /W15D3/twitter-frontend/src/store/configureStore.js: -------------------------------------------------------------------------------- 1 | import { createStore, applyMiddleware } from 'redux'; 2 | import rootReducer from './reducers/rootReducer'; 3 | import thunk from './middleware/thunk'; 4 | 5 | const configureStore = (preloadedState = {}) => { 6 | return createStore( 7 | rootReducer, 8 | preloadedState, 9 | applyMiddleware(thunk) 10 | ) 11 | } 12 | 13 | export default configureStore; -------------------------------------------------------------------------------- /W15D3/twitter-frontend/src/store/middleware/thunk.js: -------------------------------------------------------------------------------- 1 | const thunk = ({dispatch, getState}) => next => action =>{ 2 | if(typeof action === "function"){ 3 | return action(dispatch, getState); 4 | } 5 | return next(action); 6 | } 7 | 8 | export default thunk; -------------------------------------------------------------------------------- /W15D3/twitter-frontend/src/store/reducers/rootReducer.js: -------------------------------------------------------------------------------- 1 | import { combineReducers } from 'redux'; 2 | import tweetsReducer from './tweetsReducer'; 3 | import usersReducer from './usersReducer'; 4 | import authReducer from '../authentication'; 5 | 6 | const rootReducer = combineReducers({ 7 | tweets: tweetsReducer, 8 | users: usersReducer, 9 | auth: authReducer 10 | }) 11 | 12 | export default rootReducer; -------------------------------------------------------------------------------- /W15D4/hooks-state-based-solution/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D4/hooks-state-based-solution/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Simple React App 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D4/hooks-state-based-solution/src/LogoutButton.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | function LogoutButton({ updateUser }) { 4 | const logout = () => { 5 | fetch(`/api/session`, { 6 | method: 'delete' 7 | }).then(() => updateUser()); 8 | } 9 | 10 | return ( 11 |
    12 | 13 |
    14 | ); 15 | } 16 | 17 | export default LogoutButton; 18 | -------------------------------------------------------------------------------- /W15D4/hooks-state-based-solution/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ); 12 | -------------------------------------------------------------------------------- /W15D4/hooks-state-based-solution/src/routesUtil.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Route, Redirect } from 'react-router-dom'; 3 | 4 | export const PrivateRoute = ({ 5 | component: Component, 6 | needLogin, 7 | cProps, 8 | ...rest 9 | }) => ( 10 | 13 | needLogin === true ? ( 14 | 15 | ) : ( 16 | 17 | ) 18 | } 19 | /> 20 | ); -------------------------------------------------------------------------------- /W15D4/intro-to-react-hooks/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D4/intro-to-react-hooks/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Simple React App 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D4/intro-to-redux-hooks/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D4/intro-to-redux-hooks/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Get My IP - Starter 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D4/intro-to-redux-hooks/src/config.js: -------------------------------------------------------------------------------- 1 | export const ipUrl = process.env.REACT_APP_BASEURL || `https://httpbin.org`; 2 | -------------------------------------------------------------------------------- /W15D4/intro-to-redux-hooks/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import { Provider } from 'react-redux'; 4 | import App from './App'; 5 | import configureStore from './store/configureStore'; 6 | 7 | const store = configureStore(); 8 | 9 | ReactDOM.render( 10 | 11 | 12 | 13 | 14 | , 15 | document.getElementById('root') 16 | ); 17 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/react-router-hooks/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/react-router-hooks/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | React Router Hooks 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/react-router-hooks/src/components/Document.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { useParams } from 'react-router-dom'; 3 | 4 | const Document = () => { 5 | const { userId, docId } = useParams(); 6 | 7 | return ( 8 | <> 9 |

    Document {docId}

    10 |

    Created by User {userId}

    11 | 12 | ); 13 | }; 14 | 15 | export default Document; -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/react-router-hooks/src/index.css: -------------------------------------------------------------------------------- 1 | /* TODO Add site wide styles */ 2 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/reading/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/reading/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | React Router Hooks 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/reading/src/components/ComingSoon.js: -------------------------------------------------------------------------------- 1 | import React, {useEffect} from "react"; 2 | import { useHistory } from "react-router-dom"; 3 | 4 | const ComingSoon = () => { 5 | const history = useHistory(); 6 | 7 | useEffect(() => { 8 | const tid = setTimeout(() => { 9 | history.replace('/') 10 | }, 2000) 11 | return () => clearTimeout(tid) 12 | }); 13 | 14 | return ( 15 |

    Coming Soon

    16 | ); 17 | } 18 | 19 | export default ComingSoon; -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/reading/src/components/Document.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { useParams } from 'react-router-dom'; 3 | 4 | const Document = () => { 5 | const { userId, docId } = useParams(); 6 | 7 | return ( 8 | <> 9 |

    Document {docId}

    10 |

    Created by User {userId}

    11 | 12 | ); 13 | }; 14 | 15 | export default Document; -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/reading/src/index.css: -------------------------------------------------------------------------------- 1 | /* TODO Add site wide styles */ 2 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/starter/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/starter/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | React Router Hooks 6 | 7 | 8 |
    9 | 10 | 11 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/starter/src/components/ComingSoon.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const ComingSoon = () => { 4 | return ( 5 |

    Coming Soon

    6 | ); 7 | } 8 | 9 | export default ComingSoon; -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/starter/src/components/Document.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const Document = () => { 4 | return ( 5 | <> 6 |

    Document

    7 |

    Created by User

    8 | 9 | ); 10 | }; 11 | 12 | export default Document; -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/starter/src/index.css: -------------------------------------------------------------------------------- 1 | /* TODO Add site wide styles */ 2 | -------------------------------------------------------------------------------- /W15D4/intro-to-router-hooks/starter/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | import './index.css'; 5 | import { BrowserRouter as Router } from "react-router-dom"; 6 | 7 | ReactDOM.render( 8 | 9 | 10 | 11 | 12 | , 13 | document.getElementById('root') 14 | ); 15 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Fruit Stand 6 | 7 | 8 | 9 |
    10 | 11 | 12 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import FruitManagerContainer from './components/FruitManagerContainer'; 3 | import FarmerManagerContainer from './components/FarmerManagerContainer'; 4 | 5 | function App() { 6 | return ( 7 | <> 8 |

    Fruit Stand

    9 | 10 | 11 | 12 | ); 13 | } 14 | 15 | export default App; 16 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/actions/farmersActions.js: -------------------------------------------------------------------------------- 1 | export const HIRE_FARMER = 'HIRE_FARMER'; 2 | export const PAY_FARMER = 'PAY_FARMER'; 3 | 4 | export const hireFarmer = (name) => ({ 5 | type: HIRE_FARMER, 6 | id: new Date().getTime(), 7 | name, 8 | }); 9 | 10 | export const payFarmer = (id) => ({ 11 | type: PAY_FARMER, 12 | id, 13 | }); 14 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/components/Farmer.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Farmer = ({ farmer, pay }) => { 4 | const handleClick = () => pay(farmer.id); 5 | 6 | return ( 7 |
  • 8 | {farmer.name} 9 | {farmer.paid === false && 10 | 11 | } 12 |
    • 13 | ); 14 | }; 15 | 16 | export default Farmer; 17 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/components/FarmerList.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import Farmer from './Farmer'; 3 | 4 | const FarmersList = ({ farmers, pay }) => { 5 | return ( 6 |
    7 |

    Farmers

    8 | {farmers.length > 0 9 | ?
      {farmers.map((farmer) => )}
    10 | : No farmers currently available! 11 | } 12 |
    13 | ); 14 | }; 15 | 16 | export default FarmersList; 17 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/components/FarmerManager.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import FarmerList from './FarmerList'; 3 | import FarmerHire from './FarmerHire'; 4 | 5 | const FarmerManager = ({ farmers, pay, hire }) => { 6 | return ( 7 |
    8 |

    Farmer Manager

    9 | 10 | 11 |
    12 | ); 13 | }; 14 | 15 | export default FarmerManager; 16 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/components/FruitList.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const FruitList = ({ fruit }) => { 4 | return ( 5 |
    6 | {fruit.length > 0 7 | ?
      {fruit.map((fruitName, index) =>
    • {fruitName}
      • )}
    8 | : No fruit currently in stock! 9 | } 10 |
    11 | ); 12 | }; 13 | 14 | export default FruitList; 15 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/components/FruitQuickAdd.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const FruitQuickAdd = ({ add }) => { 4 | const handleClick = (event) => add(event.target.innerText); 5 | 6 | return ( 7 |
    8 |

    Quick Add

    9 | 10 | 11 |
    12 | ); 13 | }; 14 | 15 | export default FruitQuickAdd; 16 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: 'Varela Round', sans-serif; 3 | } 4 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import { Provider } from 'react-redux'; 4 | import './index.css'; 5 | import App from './App'; 6 | import store from './store'; 7 | 8 | window.store = store; 9 | 10 | ReactDOM.render( 11 | 12 | 13 | 14 | 15 | , 16 | document.getElementById('root') 17 | ); 18 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/reducers/farmersSelectors.js: -------------------------------------------------------------------------------- 1 | 2 | export const getAllFarmers = ({ farmers }) => ( 3 | Object.keys(farmers).map(id => farmers[id]) 4 | ); 5 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/reducers/fruitSelectors.js: -------------------------------------------------------------------------------- 1 | 2 | export const getDistinctFruit = ({ fruit }) => ( 3 | Array.from(new Set(fruit)).sort() 4 | ); 5 | -------------------------------------------------------------------------------- /W15D4/redux-fruit-stand/src/reducers/rootReducer.js: -------------------------------------------------------------------------------- 1 | import { combineReducers } from 'redux'; 2 | import fruitReducer from './fruitReducer'; 3 | import farmersReducer from './farmersReducer'; 4 | 5 | const rootReducer = combineReducers({ 6 | fruit: fruitReducer, 7 | farmers: farmersReducer 8 | }); 9 | 10 | export default rootReducer; 11 | -------------------------------------------------------------------------------- /W17D4/knights_travails/__pycache__/tree.cpython-38.pyc: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W17D4/knights_travails/__pycache__/tree.cpython-38.pyc -------------------------------------------------------------------------------- /W17D4/knights_travails/test/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W17D4/knights_travails/test/__init__.py -------------------------------------------------------------------------------- /W17D4/knights_travails/test/__pycache__/__init__.cpython-37.pyc: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W17D4/knights_travails/test/__pycache__/__init__.cpython-37.pyc -------------------------------------------------------------------------------- /W17D4/knights_travails/test/__pycache__/__init__.cpython-38.pyc: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W17D4/knights_travails/test/__pycache__/__init__.cpython-38.pyc -------------------------------------------------------------------------------- /W17D4/knights_travails/test/__pycache__/test_node.cpython-37.pyc: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W17D4/knights_travails/test/__pycache__/test_node.cpython-37.pyc -------------------------------------------------------------------------------- /W17D4/knights_travails/test/__pycache__/test_node.cpython-38.pyc: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W17D4/knights_travails/test/__pycache__/test_node.cpython-38.pyc -------------------------------------------------------------------------------- /W17D5/python_practice_problems/README.md: -------------------------------------------------------------------------------- 1 | # Do these! Run the files in your terminal to test your solutions. -------------------------------------------------------------------------------- /W18D1/another_package/__init__.py: -------------------------------------------------------------------------------- 1 | print("Running another_package/__init__.py as", __name__) 2 | 3 | value = "another_package/__init__.py" 4 | -------------------------------------------------------------------------------- /W18D1/another_package/__main__.py: -------------------------------------------------------------------------------- 1 | print("Running another_package/__main__.py as", __name__) 2 | 3 | from another_package.subpackage import value 4 | 5 | value = "another_package/__main__.py" 6 | -------------------------------------------------------------------------------- /W18D1/another_package/subpackage.py: -------------------------------------------------------------------------------- 1 | print("Running another_package/subpackage.py as", __name__) 2 | 3 | value = "another_package/subpackge.py" 4 | -------------------------------------------------------------------------------- /W18D1/my_package/__init__.py: -------------------------------------------------------------------------------- 1 | print("Running my_package/__init__.py as", __name__) 2 | 3 | value = "my_package/__init__.py" 4 | -------------------------------------------------------------------------------- /W18D1/my_package/__main__.py: -------------------------------------------------------------------------------- 1 | print("Running my_package/__main__.py as", __name__) 2 | 3 | value = "my_package/__main__.py" 4 | -------------------------------------------------------------------------------- /W18D1/my_package/module1.py: -------------------------------------------------------------------------------- 1 | print("Running my_package/module1.py as", __name__) 2 | 3 | value = "my_package/module.py" 4 | -------------------------------------------------------------------------------- /W18D1/my_package/module2.py: -------------------------------------------------------------------------------- 1 | print("Running my_package/module1.py as", __name__) 2 | 3 | from .subpackage.module2 import value as module2_value 4 | print("Imported .subpackage.module2 with value", module2_value) 5 | 6 | value = "my_package/module.py" 7 | -------------------------------------------------------------------------------- /W18D1/my_package/subpackage/module1.py: -------------------------------------------------------------------------------- 1 | print("Running my_package/subpackage/module.py as", __name__) 2 | 3 | from another_package import value 4 | print("Value from another package is", value) 5 | 6 | value = "my_package/module.py" 7 | -------------------------------------------------------------------------------- /W18D1/my_package/subpackage/module2.py: -------------------------------------------------------------------------------- 1 | print("my_package/subpackage/module2.py as", __name__) 2 | 3 | value = "my_package/subpackage/module2.py" 4 | -------------------------------------------------------------------------------- /W18D1/new_project/Pipfile: -------------------------------------------------------------------------------- 1 | [[source]] 2 | name = "pypi" 3 | url = "https://pypi.org/simple" 4 | verify_ssl = true 5 | 6 | [dev-packages] 7 | 8 | [packages] 9 | pytest = "*" 10 | 11 | [requires] 12 | python_version = "3.8" 13 | -------------------------------------------------------------------------------- /W18D1/new_project/test/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W18D1/new_project/test/__init__.py -------------------------------------------------------------------------------- /W18D1/new_project/test/test_pytest.py: -------------------------------------------------------------------------------- 1 | def test_true(): 2 | assert 4 == 4 3 | 4 | def test_false(): 5 | assert 1 != 2 -------------------------------------------------------------------------------- /W18D1/new_project/test/test_unittest.py: -------------------------------------------------------------------------------- 1 | import unittest 2 | 3 | class FirstTests(unittest.TestCase): 4 | def test_first(self): 5 | self.assertTrue(True) 6 | 7 | def test_second(self): 8 | self.assertFalse(False) -------------------------------------------------------------------------------- /W18D1/pytest-package/Pipfile: -------------------------------------------------------------------------------- 1 | [[source]] 2 | name = "pypi" 3 | url = "https://pypi.org/simple" 4 | verify_ssl = true 5 | 6 | [dev-packages] 7 | 8 | [packages] 9 | pytest = "*" 10 | requests = "*" 11 | 12 | [requires] 13 | python_version = "3.8" 14 | -------------------------------------------------------------------------------- /W18D1/pytest-package/stack.py: -------------------------------------------------------------------------------- 1 | class Stack: 2 | def __init__(self): 3 | self._values = [] 4 | 5 | def __len__(self): 6 | return len(self._values) 7 | 8 | def peek(self): 9 | return self._values[-1] 10 | 11 | def pop(self): 12 | return self._values.pop() 13 | 14 | def push(self, value): 15 | self._values.append(value) 16 | -------------------------------------------------------------------------------- /W18D1/pytest-package/test/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W18D1/pytest-package/test/__init__.py -------------------------------------------------------------------------------- /W18D1/tdd-python-solution/Pipfile: -------------------------------------------------------------------------------- 1 | [[source]] 2 | name = "pypi" 3 | url = "https://pypi.org/simple" 4 | verify_ssl = true 5 | 6 | [dev-packages] 7 | 8 | [packages] 9 | pytest = "*" 10 | 11 | [requires] 12 | python_full_version="3.8.2" -------------------------------------------------------------------------------- /W18D1/tdd-python-solution/app/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W18D1/tdd-python-solution/app/__init__.py -------------------------------------------------------------------------------- /W18D1/tdd-python-solution/requirements.txt: -------------------------------------------------------------------------------- 1 | -i https://pypi.org/simple 2 | attrs==19.3.0 3 | more-itertools==8.3.0 4 | packaging==20.4 5 | pluggy==0.13.1 6 | py==1.8.1 7 | pyparsing==2.4.7 8 | pytest==5.4.2 9 | six==1.14.0 10 | wcwidth==0.1.9 -------------------------------------------------------------------------------- /W18D1/tdd-python-solution/test/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W18D1/tdd-python-solution/test/__init__.py -------------------------------------------------------------------------------- /W18D1/tdd-python-solution/test/test_roman_numerals_pytest.py: -------------------------------------------------------------------------------- 1 | from app.roman_numerals import parse 2 | from pytest import mark 3 | 4 | 5 | @mark.parametrize("s,expected", [ 6 | ("IX", 9), ("X", 10), ("XI", 11), ("XIV", 14), ("XIX", 19), ("XX", 20), 7 | ("XXXIV", 34), ("XLI", 41), ("L", 50), ("XCIX", 99), ("C", 100), 8 | ("CCCXXXIII", 333), ("DLV", 555), ("CDXLIX", 449), ("MCMLXXII", 1972), 9 | ]) 10 | def test_roman_numeral_parser(s, expected): 11 | result = parse(s) 12 | 13 | assert result == expected 14 | -------------------------------------------------------------------------------- /W18D1/unittest-package/stack.py: -------------------------------------------------------------------------------- 1 | class Stack: 2 | def __init__(self): 3 | self._values = [] 4 | 5 | def __len__(self): 6 | return len(self._values) 7 | 8 | def peek(self): 9 | return self._values[-1] 10 | 11 | def push(self, value): 12 | self._values.append(value) 13 | 14 | def pop(self): 15 | return self._values.pop() 16 | -------------------------------------------------------------------------------- /W18D1/unittest-package/test/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W18D1/unittest-package/test/__init__.py -------------------------------------------------------------------------------- /W18D2/solution/Pipfile: -------------------------------------------------------------------------------- 1 | [[source]] 2 | name = "pypi" 3 | url = "https://pypi.org/simple" 4 | verify_ssl = true 5 | 6 | [dev-packages] 7 | pylint = "*" 8 | rope = "*" 9 | 10 | [packages] 11 | flask = "*" 12 | psycopg2-binary = "*" 13 | flask-wtf = "*" 14 | flask-login = "*" 15 | python-dotenv = "*" 16 | pycodestyle = "*" 17 | 18 | [requires] 19 | python_version = "3.8" -------------------------------------------------------------------------------- /W18D2/solution/app/__init__.py: -------------------------------------------------------------------------------- 1 | from app import routes 2 | from flask import Flask 3 | import os 4 | 5 | app = Flask(__name__) 6 | app.config.update({'SECRET_KEY': os.environ.get('SECRET_KEY')}) 7 | app.register_blueprint(routes.bp) 8 | -------------------------------------------------------------------------------- /W18D2/solution/app/static/scripts/calendar.js: -------------------------------------------------------------------------------- 1 | document.addEventListener('DOMContentLoaded', () => { 2 | document 3 | .getElementById('date-selector') 4 | .addEventListener('change', function () { 5 | const d = new Date(Date.parse(this.value)); 6 | location.href = `/${d.getFullYear()}/${d.getMonth() + 1}/${d.getDate() + 1}`; 7 | }); 8 | }); -------------------------------------------------------------------------------- /W18D2/solution/calendar_this.py: -------------------------------------------------------------------------------- 1 | from app import app 2 | -------------------------------------------------------------------------------- /W18D3/README.md: -------------------------------------------------------------------------------- 1 | # W18D3 2 | 3 | # More on Classes 4 | 5 | - [More on Classes] 6 | 7 | - [More on Classes Code] 8 | 9 | [More on Classes]: ./more-on-classes.md 10 | 11 | [More on Classes Code]: ./more-on-classes.py -------------------------------------------------------------------------------- /W18D3/intro-sql-alchemy/.flaskenv: -------------------------------------------------------------------------------- 1 | FLASK_APP=app.py -------------------------------------------------------------------------------- /W18D3/intro-sql-alchemy/Pipfile: -------------------------------------------------------------------------------- 1 | [[source]] 2 | name = "pypi" 3 | url = "https://pypi.org/simple" 4 | verify_ssl = true 5 | 6 | [dev-packages] 7 | pylint = "*" 8 | 9 | [packages] 10 | flask = "~=1.1" 11 | python-dotenv = "~=0.13" 12 | psycopg2-binary = "*" 13 | flask-wtf = "*" 14 | sqlalchemy = "*" 15 | flask-sqlalchemy = "*" 16 | 17 | [requires] 18 | python_version = "3.8" 19 | -------------------------------------------------------------------------------- /W18D3/intro-sql-alchemy/app/__init__.py: -------------------------------------------------------------------------------- 1 | from flask import Flask 2 | import app.routes as routes 3 | from .config import Configuration 4 | from .models import db 5 | 6 | app = Flask(__name__) 7 | app.config.from_object(Configuration) 8 | app.register_blueprint(routes.bp) 9 | db.init_app(app) 10 | 11 | @app.route('/') 12 | def hello(): 13 | return '

    Hello, world!

    ' -------------------------------------------------------------------------------- /W18D3/intro-sql-alchemy/app/config.py: -------------------------------------------------------------------------------- 1 | import os 2 | 3 | class Configuration: 4 | SQLALCHEMY_TRACK_MODIFICATIONS = False 5 | SQLALCHEMY_DATABASE_URI = os.environ.get('DATABASE_URL') -------------------------------------------------------------------------------- /W18D3/intro-sql-alchemy/app/routes.py: -------------------------------------------------------------------------------- 1 | from flask import Blueprint 2 | 3 | 4 | bp = Blueprint('main', __name__, url_prefix='') 5 | 6 | @bp.route("/") 7 | def main(): 8 | return '

    Hello World!

    ' -------------------------------------------------------------------------------- /W18D3/intro-sql-alchemy/intro.py: -------------------------------------------------------------------------------- 1 | from app import app -------------------------------------------------------------------------------- /W18D3/order-up/.flaskenv: -------------------------------------------------------------------------------- 1 | FLASK_APP=order_up.py 2 | -------------------------------------------------------------------------------- /W18D3/order-up/Pipfile: -------------------------------------------------------------------------------- 1 | [[source]] 2 | name = "pypi" 3 | url = "https://pypi.org/simple" 4 | verify_ssl = true 5 | 6 | [dev-packages] 7 | pylint = "*" 8 | pycodestyle = "*" 9 | rope = "*" 10 | 11 | [packages] 12 | flask = "*" 13 | python-dotenv = "*" 14 | sqlalchemy = "*" 15 | flask-sqlalchemy = "*" 16 | psycopg2-binary = "*" 17 | wtforms = "*" 18 | flask-wtf = "*" 19 | flask-login = "*" 20 | 21 | [requires] 22 | python_version = "3.8" 23 | -------------------------------------------------------------------------------- /W18D3/order-up/app/config.py: -------------------------------------------------------------------------------- 1 | import os 2 | 3 | 4 | class Configuration: 5 | SECRET_KEY = os.environ.get('SECRET_KEY') 6 | SQLALCHEMY_DATABASE_URI = os.environ.get("DATABASE_URL") 7 | SQLALCHEMY_TRACK_MODIFICATIONS = False 8 | -------------------------------------------------------------------------------- /W18D3/order-up/app/routes/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W18D3/order-up/app/routes/__init__.py -------------------------------------------------------------------------------- /W18D3/order-up/app/templates/base.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | {% if title %} 5 | {{ title }} - Order Up! 6 | {% else %} 7 | Welcome to Order Up! 8 | {% endif %} 9 | 10 | 11 | {% block content %}{% endblock %} 12 | 13 | 14 | -------------------------------------------------------------------------------- /W18D3/order-up/order_up.py: -------------------------------------------------------------------------------- 1 | from app import app 2 | -------------------------------------------------------------------------------- /W18D4/d4hw.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W18D4/d4hw.zip -------------------------------------------------------------------------------- /W19D2/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 |

    I changed this!

    10 | 11 | -------------------------------------------------------------------------------- /W19D3/dockerfile-example/.dockerignore: -------------------------------------------------------------------------------- 1 | hello.py -------------------------------------------------------------------------------- /W19D3/dockerfile-example/app.py: -------------------------------------------------------------------------------- 1 | from flask import Flask 2 | 3 | 4 | app = Flask(__name__) 5 | 6 | @app.route('/hello') 7 | def hello(): 8 | return "Hello World!" -------------------------------------------------------------------------------- /W19D3/dockerfile-example/hello.py: -------------------------------------------------------------------------------- 1 | dflskdjfkds -------------------------------------------------------------------------------- /W19D3/dockerfile-example/requirements.txt: -------------------------------------------------------------------------------- 1 | flask -------------------------------------------------------------------------------- /W19D4/compose-pros-solution/phase1/docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: '3' 2 | 3 | services: 4 | web: 5 | build: . 6 | image: rkoron/flask-redis-app:latest 7 | environment: 8 | - FLASK_ENV=development 9 | ports: 10 | - 5000:5000 11 | 12 | redis: 13 | image: redis:4.0.11-alpine -------------------------------------------------------------------------------- /W19D4/compose-pros-solution/phase4/.dockerignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .git 3 | Dockerfile -------------------------------------------------------------------------------- /W19D4/compose-pros-solution/phase4/Dockerfile: -------------------------------------------------------------------------------- 1 | # create your custom drupal image here, based of official drupal 2 | 3 | FROM drupal:8.6 4 | 5 | RUN apt-get update && apt-get install -y git \ 6 | && rm -rf /var/lib/apt/lists/* 7 | WORKDIR /var/www/html/themes 8 | RUN git clone --branch 8.x-3.x --single-branch --depth 1 https://git.drupal.org/project/bootstrap.git/ \ 9 | && chown -R www-data:www-data bootstrap 10 | -------------------------------------------------------------------------------- /W19D4/compose-pros-solution/phase4/docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: "2" 2 | 3 | services: 4 | drupal: 5 | build: . 6 | image: rkoron/custom-drupal 7 | ports: 8 | - "8080:80" 9 | postgres: 10 | image: postgres:9.6 11 | environment: 12 | - POSTGRES_PASSWORD=password 13 | volumes: 14 | # now everytime we boot up compose we will have the 15 | # same password and data available to us 16 | - drupal-data:/var/lib/postgresql/data 17 | volumes: 18 | drupal-data: 19 | -------------------------------------------------------------------------------- /W1D1/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W1D1/README.md -------------------------------------------------------------------------------- /W1D3.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W1D3.zip -------------------------------------------------------------------------------- /W1D3/nested_loops.js: -------------------------------------------------------------------------------- 1 | // Nested Loops 2 | for (let i = 0; i < 2; i++) { 3 | // console.log(i); 4 | for (let j = 0; j < 3; j++) { 5 | // console.log(' ', j); 6 | 7 | console.log(i, j); 8 | } 9 | } -------------------------------------------------------------------------------- /W1D3/pairs_in_arrays.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W1D3/pairs_in_arrays.png -------------------------------------------------------------------------------- /W1D3/unique_pairs_in_arrays.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W1D3/unique_pairs_in_arrays.png -------------------------------------------------------------------------------- /W1D4.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W1D4.zip -------------------------------------------------------------------------------- /W1D5.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W1D5.zip -------------------------------------------------------------------------------- /W2D2.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W2D2.zip -------------------------------------------------------------------------------- /W2D4.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W2D4.zip -------------------------------------------------------------------------------- /W2D5.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W2D5.zip -------------------------------------------------------------------------------- /W3D1.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W3D1.zip -------------------------------------------------------------------------------- /W3D1/call_stack.js: -------------------------------------------------------------------------------- 1 | function foo() { 2 | console.log('a'); // 1st 3 | bar(); 4 | console.log('e'); // 5th 5 | } 6 | 7 | function bar() { 8 | console.log('b'); // 2nd 9 | baz(); 10 | console.log('d'); // 4th 11 | } 12 | 13 | function baz() { 14 | console.log('c'); // 3rd 15 | } 16 | 17 | foo(); 18 | 19 | // Call Stack 20 | 21 | // ------ top ------- 22 | 23 | // ------ bottom ------- -------------------------------------------------------------------------------- /W3D1/eod.js: -------------------------------------------------------------------------------- 1 | let count = 10 2 | 3 | function afterOneSecond() { 4 | console.log('1 seconds is up!'); 5 | count--; 6 | if (count !== 0) { 7 | setTimeout(afterOneSecond, 1000); 8 | } 9 | } 10 | 11 | const timeout = setTimeout(afterOneSecond, 1000); -------------------------------------------------------------------------------- /W3D1/setTimeout.js: -------------------------------------------------------------------------------- 1 | function foo(first, second, third) { 2 | console.log('--------'); // 3rd 3 | 4 | console.log(first); 5 | console.log(second); 6 | console.log(third); 7 | console.log('time is up'); 8 | 9 | console.log('--------'); 10 | // returns undefined 11 | } 12 | 13 | console.log('before setTimeout'); // 1st 14 | 15 | const args = ['first argument', 'second argument']; 16 | 17 | setTimeout(function (...args) { foo(...args, 'third argument') }, 2000, ...args); 18 | 19 | console.log('after setTimeout'); // 2nd -------------------------------------------------------------------------------- /W3D1/single_vs_multi_threading.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W3D1/single_vs_multi_threading.png -------------------------------------------------------------------------------- /W3D1/stack_vs_queue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W3D1/stack_vs_queue.png -------------------------------------------------------------------------------- /W3D1/threading.js: -------------------------------------------------------------------------------- 1 | function nextTask() { 2 | console.log('starting task'); 3 | 4 | while(true) { 5 | 6 | } 7 | 8 | console.log('done with task!'); 9 | } 10 | 11 | setTimeout(function() { 12 | console.log('time\'s up!'); 13 | }, 1000); 14 | 15 | nextTask(); 16 | 17 | // setTimeout should be printing time's up after 1 second, but nextTask is 18 | // taking a very long time and not allowing the setTimeout function to run 19 | // If JavaScript was a multi-threaded language, this would not be a problem. -------------------------------------------------------------------------------- /W3D2/foods.txt: -------------------------------------------------------------------------------- 1 | ramen 2 | sushi 3 | taco 4 | pizzas -------------------------------------------------------------------------------- /W3D2/git_branches.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W3D2/git_branches.png -------------------------------------------------------------------------------- /W3D2/git_directories.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W3D2/git_directories.png -------------------------------------------------------------------------------- /W3D2/git_rebase.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W3D2/git_rebase.png -------------------------------------------------------------------------------- /W3D2/my-first-written-file.txt: -------------------------------------------------------------------------------- 1 | Hello World! -------------------------------------------------------------------------------- /W3D2/new_foods.txt: -------------------------------------------------------------------------------- 1 | rxmen 2 | sushi 3 | txco 4 | pizzxs -------------------------------------------------------------------------------- /W3D2/new_poem.txt: -------------------------------------------------------------------------------- 1 | tulips are red 2 | violets are blue 3 | error on line 32 -------------------------------------------------------------------------------- /W3D2/poem.txt: -------------------------------------------------------------------------------- 1 | roses are red 2 | violets are blue 3 | error on line 32 -------------------------------------------------------------------------------- /W3D5/w3/week-LO-review.md: -------------------------------------------------------------------------------- 1 | 4. Find what `-c`, `-r`, and `-b` flags do in `grep` by reading the manual. 2 | 3 | * `-c` stands for "count". It will limit the output of grep to just the number of matches, not the matches themselves. 4 | * `-r` stands for "recursive", and it will tell grep that it should look through the subdirectories of the requested path. 5 | * `-b` stands for "byte-offset" and it will tell you the line number, and position of grep's matches. -------------------------------------------------------------------------------- /W4D1/async.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W4D1/async.png -------------------------------------------------------------------------------- /W4D1/browser_layers.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W4D1/browser_layers.png -------------------------------------------------------------------------------- /W4D1/defer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W4D1/defer.png -------------------------------------------------------------------------------- /W4D1/entry.js: -------------------------------------------------------------------------------- 1 | console.log('hello!'); -------------------------------------------------------------------------------- /W4D1/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /W4D1/no_async_defer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W4D1/no_async_defer.png -------------------------------------------------------------------------------- /W4D1/request_response_cycle.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W4D1/request_response_cycle.png -------------------------------------------------------------------------------- /W4D3/README.md: -------------------------------------------------------------------------------- 1 | A secondary learning objective will be parsing documentation. This will be a large focus when going over the drag and drop event. 2 | 3 | Another secondary leraning objective is going over basic css properties with our events. 4 | 5 | We will be writing our events with students, not going over prewritten code. 6 | 7 | -------------------------------------------------------------------------------- /W4D3/dragAndDrop/dragAndDrop.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Red Square is a Drag 8 | 9 | 11 | 12 | 13 | 14 |
    Drag Me!
    15 |
    Drop Zone
    16 | 17 | 18 | -------------------------------------------------------------------------------- /W4D3/eventTarget/eventTarget.css: -------------------------------------------------------------------------------- 1 | .box { 2 | border: 2px solid gray; 3 | height: 50px; 4 | width: 50px; 5 | margin: 5px; 6 | } -------------------------------------------------------------------------------- /W4D4/example.json: -------------------------------------------------------------------------------- 1 | { 2 | "key1": "", 3 | "key2": [ 4 | { 5 | "key3": "value" 6 | } 7 | ] 8 | } -------------------------------------------------------------------------------- /W4D4/json_demo.js: -------------------------------------------------------------------------------- 1 | window.addEventListener('DOMContentLoaded', () => { 2 | debugger 3 | const data = { 4 | Angela: "\"instructor\"", 5 | Tadeo: "student", 6 | ages: [40, 35] 7 | } 8 | 9 | const jsonString = JSON.stringify(data); 10 | 11 | console.log(jsonString) 12 | 13 | const stringifiedAgain = JSON.stringify(jsonString); 14 | console.log(stringifiedAgain); 15 | 16 | const convertedData = JSON.parse(jsonString); 17 | 18 | debugger; 19 | }) -------------------------------------------------------------------------------- /W4D4/localStorage_demo.js: -------------------------------------------------------------------------------- 1 | const data = { 2 | 3 | }; 4 | 5 | data.key = ["value"] 6 | 7 | // console.log(data.key); 8 | // console.log(data["key"]); 9 | 10 | localStorage.setItem('key', JSON.stringify({ 11 | "key1": "value", 12 | "key2": "value", 13 | })); 14 | 15 | console.log(JSON.parse(localStorage.getItem('key'))); -------------------------------------------------------------------------------- /W5D1/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ -------------------------------------------------------------------------------- /W5D1/built-in-node-packages.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W5D1/built-in-node-packages.md -------------------------------------------------------------------------------- /W5D1/index.js: -------------------------------------------------------------------------------- 1 | console.log('Hello World!') -------------------------------------------------------------------------------- /W5D1/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "W5D1", 3 | "version": "1.0.0", 4 | "description": "## Built-in Node Packages", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "node index.js", 8 | "test": "mocha --watch", 9 | "dev": "node index.js" 10 | }, 11 | "keywords": [], 12 | "author": "", 13 | "license": "ISC", 14 | "dependencies": { 15 | "colors": "^1.4.0", 16 | "lodash": "^4.17.15", 17 | "mocha": "^8.0.1" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /W5D2/EOD/index.js: -------------------------------------------------------------------------------- 1 | const { Mammal } = require('../folder1/folder2/mammal'); 2 | 3 | console.log(Mammal); 4 | const { Platypus, otherKey } = require('../folder3/platypus'); 5 | // const platypusFile = require('../folder3/platypus'); 6 | // console.log(platypusFile); 7 | // const Platypus = platypusFile.Platypus; 8 | // const otherKey = platypusFile.otherKey; 9 | console.log(Platypus); 10 | console.log(otherKey); -------------------------------------------------------------------------------- /W5D2/classes/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | Animal: require('./animal'), 3 | Cat: require('./cat').Cat, 4 | hello: 'hello' 5 | }; -------------------------------------------------------------------------------- /W5D2/folder1/folder2/mammal.js: -------------------------------------------------------------------------------- 1 | class Mammal { 2 | constructor(habitat) { 3 | this.habitat = habitat; 4 | this.liveBirth = true; 5 | this.warmBlooded = true; 6 | this.hasHair = true; 7 | } 8 | 9 | typicalMammal() { 10 | const typical = this.liveBirth && this.warmBlooded && this.hasHair; 11 | return typical; 12 | } 13 | } 14 | 15 | const obj = { 16 | Mammal: Mammal 17 | } 18 | 19 | module.exports = obj; -------------------------------------------------------------------------------- /W5D2/folder1/other.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W5D2/folder1/other.js -------------------------------------------------------------------------------- /W5D2/folder3/platypus.js: -------------------------------------------------------------------------------- 1 | const { Mammal } = require('../folder1/folder2/mammal'); 2 | 3 | class Platypus extends Mammal { 4 | constructor(habitat) { 5 | super(habitat); 6 | this.liveBirth = false; 7 | } 8 | 9 | attack() { 10 | console.log("Playpus attakced with venomous claws!"); 11 | } 12 | } 13 | 14 | exports.Platypus = Platypus; 15 | exports.otherKey = 'hello world!'; -------------------------------------------------------------------------------- /W5D2/pairing_demo/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |

    Hello World! Testing Live Server

    11 | 12 | -------------------------------------------------------------------------------- /W5D3.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W5D3.zip -------------------------------------------------------------------------------- /W5D3/README.md: -------------------------------------------------------------------------------- 1 | # a/A Online May 2020 Week 6 Day 3 - SOLID OOP 2 | 3 | * [Learning Objectives](./Learning_Objectives.md) 4 | * [Lecture Notes](./Lecture_Notes.md) 5 | * [Enrichment Materials](./Enrichment_Materials.md) 6 | -------------------------------------------------------------------------------- /W5D3/aa-class-diagram.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W5D3/aa-class-diagram.pdf -------------------------------------------------------------------------------- /W5D3/ls2.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W5D3/ls2.pdf -------------------------------------------------------------------------------- /W5D4/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /W5D5/W5-review.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W5D5/W5-review.zip -------------------------------------------------------------------------------- /W6D2/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "W6D2", 3 | "version": "1.0.0", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "node-fetch": { 8 | "version": "2.6.0", 9 | "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz", 10 | "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==" 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /W6D2/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "W6D2", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "basicPromise.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "node-fetch": "^2.6.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /W6D2/promise-project-solution/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ -------------------------------------------------------------------------------- /W6D2/promise-project-solution/commands.sh: -------------------------------------------------------------------------------- 1 | node curl.js -o output.txt https://appacademy.io 2 | 3 | node curl.js https://artii.herokuapp.com/make?text=curl++this 4 | 5 | node curl.js https://artii.herokuFLAP.com/make?text=curl++this -------------------------------------------------------------------------------- /W6D2/promise-project-solution/output1.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W6D2/promise-project-solution/output1.txt -------------------------------------------------------------------------------- /W6D2/promise-project-solution/output2.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W6D2/promise-project-solution/output2.txt -------------------------------------------------------------------------------- /W6D2/promise-project-solution/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "promise-project-solution", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "private": true, 13 | "dependencies": { 14 | "dashdash": "^1.14.1", 15 | "node-fetch": "^2.6.0" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /W6D2/promise-project-solution/response.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W6D2/promise-project-solution/response.txt -------------------------------------------------------------------------------- /W6D3/trivia-game-three-ways-project-solution/async-await-version.js: -------------------------------------------------------------------------------- 1 | export async function getClue() { 2 | const response = await fetch("https://jservice.xyz/api/random-clue"); 3 | if (!response.ok) throw new Error(response.status); 4 | return await response.json(); 5 | } 6 | -------------------------------------------------------------------------------- /W6D3/trivia-game-three-ways-project-solution/game.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #DFDFDF; 3 | } 4 | 5 | #game-board { 6 | background-color: white; 7 | margin: auto; 8 | padding: 1em; 9 | width: 600px; 10 | } 11 | 12 | #answer, #score { 13 | font-size: 1.5em; 14 | margin: 1.25em 0; 15 | } 16 | 17 | #question, #value { 18 | font-size: 1.25em; 19 | margin: 1.25em 0; 20 | } 21 | 22 | #category-title, #invalid-count { 23 | font-size: 1em; 24 | margin: 1.25em 0; 25 | } 26 | -------------------------------------------------------------------------------- /W6D3/trivia-game-three-ways-project-solution/promise-version.js: -------------------------------------------------------------------------------- 1 | export function getClue() { 2 | return fetch('https://jservice.xyz/api/random-clue') 3 | .then(response => { 4 | console.log('step 1'); 5 | if (!response.ok) throw new Error(response.status); 6 | 7 | return response.json(); 8 | }); 9 | } 10 | getClue().then 11 | 12 | fetch('sdflkj') // Pending promise gets fulfilled/resolved when response comes back 13 | .then(res => console.log(res)) // entire response of the fetch request 14 | -------------------------------------------------------------------------------- /W6D4/README.md: -------------------------------------------------------------------------------- 1 | # LOs 2 | 3 | 1. Explain the "red-green-refactor" loop of test-driven development. 4 | 2. Identify the definitions of SyntaxError, ReferenceError, and TypeError 5 | 3. Create, modify, and get to pass a suite of Mocha tests 6 | 4. Use Chai to structure your tests using behavior-driven development principles. 7 | 5. Use the pre- and post-test hooks provided by Mocha 8 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/assertion-error/index.d.ts: -------------------------------------------------------------------------------- 1 | type AssertionError = Error & T & { 2 | showDiff: boolean; 3 | }; 4 | 5 | interface AssertionErrorConstructor { 6 | new(message: string, props?: T, ssf?: Function): AssertionError; 7 | } 8 | 9 | declare const AssertionError: AssertionErrorConstructor; 10 | 11 | export = AssertionError; 12 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/chai-spies/bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "chai-spies", 3 | "main": "chai-spies.js", 4 | "homepage": "https://github.com/chaijs/chai-spies", 5 | "authors": [ 6 | "Jake Luer " 7 | ], 8 | "description": "Spies for the Chai assertion library.", 9 | "license": "MIT", 10 | "ignore": [ 11 | "**/.*", 12 | "lib", 13 | "support", 14 | "test" 15 | ] 16 | } 17 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/chai-spies/component.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "chai-spies", 3 | "repo": "chaijs/chai-spies", 4 | "version": "1.0.0", 5 | "description": "Spies for the Chai assertion library.", 6 | "license": "MIT", 7 | "keywords": [ 8 | "test", 9 | "spy", 10 | "chai" 11 | ], 12 | "dependencies": { 13 | "chaijs/chai": "*" 14 | }, 15 | "scripts": ["lib/spy.js"], 16 | "main": "lib/spy.js" 17 | } 18 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/chai-spies/index.js: -------------------------------------------------------------------------------- 1 | module.exports = require('./lib/spy'); 2 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/chai/CODEOWNERS: -------------------------------------------------------------------------------- 1 | * @chaijs/chai 2 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/chai/index.js: -------------------------------------------------------------------------------- 1 | module.exports = require('./lib/chai'); 2 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/chai/register-assert.js: -------------------------------------------------------------------------------- 1 | global.assert = require('./').assert; 2 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/chai/register-expect.js: -------------------------------------------------------------------------------- 1 | global.expect = require('./').expect; 2 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/chai/register-should.js: -------------------------------------------------------------------------------- 1 | global.should = require('./').should(); 2 | -------------------------------------------------------------------------------- /W6D4/dogs/node_modules/pathval/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | 2 | 0.1.1 / 2013-12-30 3 | ================== 4 | 5 | * expose parse 6 | * rename lib to index 7 | 8 | 0.1.0 / 2013-12-28 9 | ================== 10 | 11 | * API BREAKING! `get` has been changed, see the README for migration path 12 | * Add `set` method 13 | * Start using simple-assert (closes #2) 14 | 15 | 0.0.1 / 2013-11-24 16 | ================== 17 | 18 | * Initial implementation 19 | -------------------------------------------------------------------------------- /W6D4/dogs/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "y", 3 | "version": "1.0.0", 4 | "description": "We want to write a dog class which will do the following:", 5 | "main": "index.js", 6 | "directories": { 7 | "test": "test" 8 | }, 9 | "scripts": { 10 | "test": "echo \"Error: no test specified\" && exit 1" 11 | }, 12 | "author": "", 13 | "license": "ISC", 14 | "dependencies": { 15 | "chai": "^4.2.0", 16 | "chai-spies": "^1.0.0" 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /W6D4/dogs/problems/dog.js: -------------------------------------------------------------------------------- 1 | class Dog { 2 | constructor(name){ 3 | this.name = name; 4 | } 5 | 6 | chainChaseTail(n){ 7 | for(let i=0; i < n; i++){ 8 | this.chaseTail(); 9 | } 10 | } 11 | 12 | chaseTail(){ 13 | console.log("Chaising my tail"); 14 | } 15 | } 16 | 17 | module.exports = Dog; -------------------------------------------------------------------------------- /W7D1/search.js: -------------------------------------------------------------------------------- 1 | function search(array, term) { 2 | for (let i = 0; i < array.length; i++) { 3 | if (array[i] == term) { 4 | return i; 5 | } 6 | } 7 | return -1; 8 | } 9 | 10 | // The search function below has a linear time complexity O(n) 11 | // When the term is not present, 12 | // the search function compares it with all the elements of array one by one. 13 | // This is the worst case -------------------------------------------------------------------------------- /W7D2/LOs.md: -------------------------------------------------------------------------------- 1 | # Learning Objectives 2 | 3 | ## Big-O, Memoization, & Tabulation 4 | 5 | 1. Order the common complexity classes according to their growth rate 6 | 2. Identify the complexity classes of common sort methods 7 | 3. Identify complexity classes of code 8 | 4. Apply memoization to recursive problems to make them less than polynomial time. 9 | 5. Apply tabulation to iterative problems to make them less than polynomial time. -------------------------------------------------------------------------------- /W7D3/binarysearch.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/binarysearch.gif -------------------------------------------------------------------------------- /W7D3/bubblesort.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/bubblesort.gif -------------------------------------------------------------------------------- /W7D3/bubblesort2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/bubblesort2.gif -------------------------------------------------------------------------------- /W7D3/insertionsort.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/insertionsort.gif -------------------------------------------------------------------------------- /W7D3/insertionsort.js: -------------------------------------------------------------------------------- 1 | function insertionSort(arr) { 2 | for (let i = 1; i < arr.length; i++) { 3 | let currElement = arr[i]; 4 | for (var j = i - 1; j >= 0 && currElement < arr[j]; j--) { 5 | arr[j + 1] = arr[j]; 6 | } 7 | arr[j + 1] = currElement; 8 | } 9 | return arr; 10 | } 11 | 12 | // O(n^2) time complexity 13 | // O(n) time complexity best case if almost already sorted 14 | // O(1) space complexity (no new memory allocation) -------------------------------------------------------------------------------- /W7D3/insertionsort2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/insertionsort2.gif -------------------------------------------------------------------------------- /W7D3/mergesort.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/mergesort.gif -------------------------------------------------------------------------------- /W7D3/mergesort2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/mergesort2.gif -------------------------------------------------------------------------------- /W7D3/quicksort.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/quicksort.gif -------------------------------------------------------------------------------- /W7D3/quicksort2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/quicksort2.gif -------------------------------------------------------------------------------- /W7D3/selectionsort.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/selectionsort.gif -------------------------------------------------------------------------------- /W7D3/selectionsort.js: -------------------------------------------------------------------------------- 1 | function selectionSort(arr) { 2 | for (let i = 0; i < arr.length; i++) { 3 | let minIndex = i; 4 | 5 | for (let j = i + 1; j < arr.length; j++) { 6 | if (arr[minIndex] > arr[j]) { 7 | minIndex = j; 8 | } 9 | } 10 | 11 | swap(arr, i, minIndex); 12 | } 13 | return arr; 14 | } 15 | 16 | // O(n^2) polynomial/quadratic time complexity 17 | // O(1) constant space complexity 18 | 19 | // quadratic means n^2 20 | // polynomial means n^m where m > 1 -------------------------------------------------------------------------------- /W7D3/selectionsort2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W7D3/selectionsort2.gif -------------------------------------------------------------------------------- /W8D1/doubly-linked-list-removeFromTail.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D1/doubly-linked-list-removeFromTail.png -------------------------------------------------------------------------------- /W8D2/binaryTreeTraversal.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D2/binaryTreeTraversal.pdf -------------------------------------------------------------------------------- /W8D2/binaryTrees.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D2/binaryTrees.pdf -------------------------------------------------------------------------------- /W8D2/graphs.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D2/graphs.pdf -------------------------------------------------------------------------------- /W8D2/tree_order_project_solution/lib/tree_node.js: -------------------------------------------------------------------------------- 1 | class TreeNode { 2 | constructor(val) { 3 | this.val = val; 4 | this.left = null; 5 | this.right = null; 6 | } 7 | } 8 | 9 | 10 | 11 | module.exports = { 12 | TreeNode 13 | }; -------------------------------------------------------------------------------- /W8D2/tree_order_project_solution/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "tree_order_project_solution", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "directories": { 7 | "lib": "lib", 8 | "test": "test" 9 | }, 10 | "scripts": { 11 | "test": "echo \"Error: no test specified\" && exit 1" 12 | }, 13 | "author": "", 14 | "license": "ISC", 15 | "dependencies": { 16 | "chai": "^4.2.0", 17 | "mocha": "^8.0.1" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /W8D3/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D3/README.md -------------------------------------------------------------------------------- /W8D3/eod/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "graph_project_solution", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "directories": { 7 | "lib": "lib", 8 | "test": "test" 9 | }, 10 | "scripts": { 11 | "test": "mocha" 12 | }, 13 | "author": "", 14 | "license": "ISC", 15 | "dependencies": { 16 | "chai": "^4.2.0", 17 | "chai-spies": "^1.0.0", 18 | "mocha": "^7.1.1" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /W8D3/graph.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D3/graph.pdf -------------------------------------------------------------------------------- /W8D4/binary-hexidecimal.md: -------------------------------------------------------------------------------- 1 | ## Binary and Hexidecimal Notation 2 | 3 | ### Convert Binary to Decimal: 4 | 5 | ![Convert Binary to Decimal] 6 | 7 | ## Convert Hexidecimal to Decimal: 8 | 9 | ![Convert Hexidecimal to Decimal] 10 | 11 | [Convert Binary to Decimal]: ./convert-binary.png 12 | [Convert Hexidecimal to Decimal]: ./convert-hexidecimal.png -------------------------------------------------------------------------------- /W8D4/convert-binary.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D4/convert-binary.png -------------------------------------------------------------------------------- /W8D4/convert-hexidecimal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D4/convert-hexidecimal.png -------------------------------------------------------------------------------- /W8D5/README.md: -------------------------------------------------------------------------------- 1 | # Week 8 2 | 3 | - Binary Trees 4 | - Graphs 5 | - Networks 6 | 7 | [Empty Learning Objectives] 8 | 9 | [Filled In Learning Objectives] 10 | 11 | [Empty Learning Objectives]: ./W8-empty-LOs.md 12 | [Filled In Learning Objectives]: ./W8-filled-in-LOs.md -------------------------------------------------------------------------------- /W8D5/binary-search-tree.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D5/binary-search-tree.png -------------------------------------------------------------------------------- /W8D5/min-max-nodes-balanced.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D5/min-max-nodes-balanced.png -------------------------------------------------------------------------------- /W8D5/min-max-nodes-ll.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D5/min-max-nodes-ll.png -------------------------------------------------------------------------------- /W8D5/number-tree.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W8D5/number-tree.png -------------------------------------------------------------------------------- /W9D1/styles/world.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W9D1/styles/world.css -------------------------------------------------------------------------------- /W9D2/ajax-project-solution/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ajax", 3 | "version": "1.0.0", 4 | "description": "Learn how to update web pages with AJAX", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "nodemon index.js" 8 | }, 9 | "author": "", 10 | "license": "ISC", 11 | "dependencies": { 12 | "express": "^4.17.1", 13 | "morgan": "^1.10.0", 14 | "node-fetch": "^2.6.0" 15 | }, 16 | "devDependencies": { 17 | "nodemon": "^2.0.2" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /W9D2/ajax.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W9D2/ajax.png -------------------------------------------------------------------------------- /W9D2/example-project/README.md: -------------------------------------------------------------------------------- 1 | To start this example project, open `index.html` in the browser. -------------------------------------------------------------------------------- /W9D2/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "W9D2", 3 | "version": "1.0.0", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "node-fetch": { 8 | "version": "2.6.0", 9 | "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz", 10 | "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==" 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /W9D2/pre-ajax.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W9D2/pre-ajax.png -------------------------------------------------------------------------------- /W9D3/Project Solutions/flexbox-project-solution/trello-logo-white.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W9D3/Project Solutions/flexbox-project-solution/trello-logo-white.png -------------------------------------------------------------------------------- /W9D3/css/sticky.css: -------------------------------------------------------------------------------- 1 | header { 2 | /* position: sticky; */ 3 | top: 0px; 4 | background-color: white; 5 | /* z-index: 1; */ 6 | } -------------------------------------------------------------------------------- /W9D5/README.md: -------------------------------------------------------------------------------- 1 | # W9D5 2 | 3 | ## [Filled in Learning Objectives] 4 | 5 | ## [Windows Postgres Installation] 6 | 7 | ## [MacOS Postgres Installation] 8 | 9 | [Filled in Learning Objectives]: ./W9_filled_in_LOs.md 10 | [MacOS Postgres Installation]: ./MacOS-Postgres-Installation.md 11 | [Windows Postgres Installation]: ./Windows-Postgres-Installation.md -------------------------------------------------------------------------------- /W9D5/box-sizing-comparison.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W9D5/box-sizing-comparison.png -------------------------------------------------------------------------------- /W9D5/css_practice_assessment/starter/your-code.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/W9D5/css_practice_assessment/starter/your-code.css -------------------------------------------------------------------------------- /W9D5/index.css: -------------------------------------------------------------------------------- 1 | .hello { 2 | background-color: red; 3 | } 4 | 5 | div:hover { 6 | background-color: green; 7 | } -------------------------------------------------------------------------------- /W9D5/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
    11 | 12 |
    13 | 14 | -------------------------------------------------------------------------------- /assessment2Prep.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/assessment2Prep.zip -------------------------------------------------------------------------------- /assessment2Prep/add_folder.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ssoonmi/05-20-Lecture-Notes/bc860a68c66b807a223efc125d544330e4386eaf/assessment2Prep/add_folder.png --------------------------------------------------------------------------------