Create a component that you can reuse 10 times. This component should be able to receive props for: * Background Color * Title * Subtitle * Information This component should be styled and built out well. Manually pass in props for each component from a parent component.

You will come up with a business that interests you and create a homepage. Your home page will need: 1. A nav bar 2. An info section 3. A list of products or services 4. Images 5. A footer App should render the , a

and the

You should use multiple array methods to solve these problems. Don't use for loops! Using the provided peopleArray (bottom of this article), write a function that: 1. Returns a list of everyone older than 18, which is 2. sorted alphabetically by last name, and where 3. each name and age

Use the built-in array method .filter() to solve all of these problems Feel free to copy and paste the function and tests in this assignment. 1) Given an array of numbers, return a new array that has only the numbers that are 5 or greater. function fiveAndGreaterOnly(arr) { // your code

Use the built-in .sort() method on arrays to solve all of these problems Feel free to copy and paste the function and tests in this assignment. 1) Sort an array from smallest number to largest function leastToGreatest(arr) { // your code here } console.log(leastToGreatest([1, 3, 5, 2, 90, 20]

Atom is a simple, approachable, yet customizable text editor. It comes pretty basic, but has awesome tools we can add to it. We will go over how to install those tools, and some of the basic ones you will want for VSchool. Install packages. Either: click on the Atom dropdown

Flexbox is a modern and robust system for positioning elements in CSS. It is built into modern browsers, so there is nothing to install. you only need to have display: flex on your parent element to start using it. div { display: flex; } Flexbox is all about parent-child relationships. It is

Controlled Components We want the value of our input boxes to always be current with state. We do that with adding the event handler "onChange" to our inputs and then handling that change by updating state. class NameForm extends React.Component { //here is a pretty standard constructor constructor(props) { super(

Tables In your Mongoose Schemas, you will have objects that have specified properties. These properties can reference other objects in other Schemas. This tutorial will explore some of the methods to doing this. One user has multiple todos If you are a user with todos, your todo schema will look

Prerequisites: 1. Full stack application that is connected to repo on git. 2. A Domain name bought through namecheap or someone other service that allows custom DNS Modifying your app to server your react code 1. Open your index.js for your server 2. Import path at the top of

For this post, you should have an understanding of events in JavaScript. You should also be somewhat familiar with Chrome Developer Tools. We will be using it to explore the event object. We will be going over the event object, and the sometimes subtle differences different events have. Event Handler

We will use the given array helpers to transform the given for loops away from being for loops. Here is some data you can use, feel free to add more car objects to it: const cars = [ { make: "ford", model: "E150", year: 2000 }, { make: "chevy", model: "malibu", year: 2017 }, { make: "chevy"

This article will go over 7 array methods. * .forEach() * .map() * .filter() * .find() * .some() * .every() * .reduce() These methods work in much the same way. Once you learn one, the rest will become much easier to learn. They are all used to prevent us from using for loops. .forEach Given the array:

Given a string including parentheses, write a function that returns true if every opening parentheses has a closing parentheses. Example function balanceParentheses(str){ // Your code here } balanceParentheses("()()") // Output: true balanceParentheses("(())") // Output: true balanceParentheses("()))") // Output: false Also, every closing parentheses needs an opening partner before it. balanceParentheses(")()(") // Output: false balanceParentheses("())(") // Output:

Buy your domain name and Sign up for Digital Ocean Buy your domain name. namecheap.com or hover.com have been our favorites. Namecheap is typically cheaper, Hover has better customer support. Pick a domain name that is your name. If you need to, throw in a middle initial or

write a function that takes an array of coins as it’s first argument, and a string representing a coin as it’s second argument. Options for the strings in the array, and the the string representing a coin are restricted to the strings: “penny", “nickel", “dime", “quarter", "half dollar"