scwebd

*==== @channel Resources and a Video Walkthrough from Today's Class: ====================*

*Understanding the basics of Node.js* (concepts, pros, cons): https://medium.com/prod-io/understanding-the-basics-of-node-js-99e01c5d844f

*process.env: What it is and why/when/how to use it effectively:* https://codeburst.io/process-env-what-it-is-and-why-when-how-to-use-it-effectively-505d0b2831e7

*Understanding module.exports and exports in Node.js:* https://www.sitepoint.com/understanding-module-exports-exports-node-js/

*JavaScript Modules: A Beginner's Guide:* https://medium.freecodecamp.org/javascript-modules-a-beginner-s-guide-783f7d7a5fcc

scwebd

*==== @channel Resources and Video Walkthroughs from Today’s Class: ===============*

*Local Storage vs Session Storage vs Cookies:* https://scotch.io/@PratyushB/local-storage-vs-session-storage-vs-cookie

*Browser Cookies: What Are They & Why Should You Care?* https://www.whoishostingthis.com/resources/cookies-guide/

*The Complete Guide to Using localStorage in JavaScript Apps:* https://blog.logrocket.com/the-complete-guide-to-using-localstorage-in-javascript-apps-ba44edb53a36/

*Array `.splice()`* (not to be confused with `.slice()`, this allows you to either add or remove items from specific indexes in an array): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

scwebd

Your cohort has been selected to participate in a coding challenge pilot.

Our program is working to develop a set of coding challenges we can give to students prior to graduation to help make improvements to our curriculum. In order to build the perfect set of challenges, we must test it with students to understand if they are too hard or too easy.

This is a first draft of the challenges, and you will be some of the first students to take it. We are appreciative of your participation and we want to make sure that it is an equally beneficial experience for you.

Therefore, we will be sharing your results with you. You will also have the opportunity to register for a review session with your cohort so you can continue to work on any areas you have yet to master.

This challenge will be given to you on the CodeSignals platform. You will have up to 75 minutes to complete it. It’s 6 multiple choice questions, one algorithm question and one React question and will review some of the core concepts you have learned

scwebd

*@channel Resources for Areas of Weakness:*

*========== HTML/CSS: ==========*
*Unit 1 Video Guide* (HTML basics, CSS floats and positioning): https://du.bootcampcontent.com/denver-coding-bootcamp/DU-DEN-FSF-FT-08-2019-U-C/blob/master/Video-Guides/Unit-1.md

*Unit 2 Video Guide* (Bootstrap layouts and media queries): https://du.bootcampcontent.com/denver-coding-bootcamp/DU-DEN-FSF-FT-08-2019-U-C/blob/master/Video-Guides/Unit-2.md

*Media Query Tutorial:* https://www.tutorialrepublic.com/css-tutorial/css3-media-queries.php

*The CSS Box Model Explained by Living in a Boring Suburban Neighborhood:* https://www.freecodecamp.org/news/css-box-model-explained-by-living-in-a-boring-suburban-neighborhood-9a9e692773c1/

scwebd

*==== Useful VSCode Shortcuts: ===================*

*PC Shortcuts:* https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf

*MAC Shortcuts:* https://code.visualstudio.com/shortcuts/keyboard-shortcuts-macos.pdf

scwebd

*==== @channel Related Resources/Video Walkthroughs for Today's Activities: ===================*

*What is the DOM (Document Object Model):* https://css-tricks.com/dom/

*What is the difference between undefined and not defined in JavaScript?:* https://www.quora.com/What-is-the-difference-between-undefined-and-not-defined-in-JavaScript

*Preventing cross-site scripting attacks when using innerHTML in vanilla JavaScript:* https://gomakethings.com/preventing-cross-site-scripting-attacks-when-using-innerhtml-in-vanilla-javascript/

*Securing jQuery against unintended XSS:* https://blog.box.com/blog/securing-jquery-against-unintended-xss
_(re: the two previous articles, maybe bookmark em for later... know for now that there are some security risks in using JavaScript's .innerHTML and jQuery methods like .html, .append, etc)_

scwebd

*==== @channel React and ES6 Resources: ==========================*
_(based on how far we got in last night's review session)_

*Our Goal Wireframe:* https://wireframe.cc/qXKuwB

*Babel Repl* (paste in ES6+ code and see how it's converted into ES5 syntax): https://babeljs.io/repl/#

*How to Comment in React JSX:* https://wesbos.com/react-jsx-comments/

*Reactstrap Installation:* https://reactstrap.github.io/

scwebd

*==== @channel Big O Notation + JavaScript Data Structures: =======================*

*Beginner's Guide to Big O Notation:* https://medium.freecodecamp.org/my-first-foray-into-technology-c5b6e83fe8f1

*What does the time complexity O(log n) actually mean?:* https://hackernoon.com/what-does-the-time-complexity-o-log-n-actually-mean-45f94bb5bfbf

*Big O Notation Video Walkthrough:* https://www.youtube.com/watch?v=kDGPJlufPRE

*Data Structures in JS: Stacks and Queues:* https://code.tutsplus.com/articles/data-structures-with-javascript-stack-and-queue--cms-23348

scwebd

_

scwebd

Hey @channel, I would instead recommend using this method if you need to pass props into a component triggered via React Router, as it avoids creating a brand new component which then mounts/remounts every render. The syntax is clunky, but it performs better and doesn't lag down our app. 

`<Route exact path="/signup" render={(props) => <Auth {...props} action="signup" />} />`

*Hint:* It's also recommended that we pass on the `{...props}` you see above so you don't lose access to the existing props for that component, for example this.props.match from React Router.

https://tylermcginnis.com/react-router-pass-props-to-components/