gladchinda

const rainbow = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];
const rainbowClone = rainbow;

// Both rainbow and rainbowClone point to the same
// array reference in memory, hence it logs (true)
console.log(rainbow === rainbowClone); // true

// Keep only the first 3 items and discard the rest
rainbowClone.splice(3);

gladchinda

const rainbow = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];

// Cloning with Array.prototype.slice
const rainbowClone1 = rainbow.slice();

console.log(rainbow === rainbowClone1); // false
console.log(rainbowClone1); // ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet']

// Cloning with Array.prototype.concat
const rainbowClone2 = rainbow.concat();

gladchinda

const rainbow = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];

// Cloning with array destructuring and spread operator
const [...rainbowClone] = rainbow;

console.log(rainbow === rainbowClone); // false
console.log(rainbowClone); // ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet']

gladchinda

const person = {
    name: 'John Doe',
    age: 25,
    location: {
        country: 'Canada',
        city: 'Vancouver',
        coordinates: [49.2827, -123.1207]
    }
}

gladchinda

const student = {
    name: 'John Doe',
    age: 16,
    scores: {
        maths: 74,
        english: 63,
        science: 85
    }
};

gladchinda

function displaySummary({ name, scores: { maths = 0, english = 0, science = 0 } = {} } = {}) {
    console.log('Hello, ' + name);
    console.log('Your Maths score is ' + maths);
    console.log('Your English score is ' + english);
    console.log('Your Science score is ' + science);
}

// Calling without a student argument
displaySummary();

gladchinda

.app-nav {
  display: none;
}

.app-nav.mobile {
  display: block;
}

@media screen and (min-width: 992px) {
  

gladchinda

import React, { Component } from 'react';
import MediaQuery from 'react-responsive';

class Navigation extends Component {
  
  render() {
    return (
      <MediaQuery minWidth={992}>
        {matches => {
          return matches

gladchinda

# Create a new directory
mkdir realtime-chat-app

# cd into the new directory
cd realtime-chat-app

# Initiate a new package and install app dependencies
npm init -y

npm install react react-dom next pusher pusher-js sentiment

gladchinda

PUSHER_APP_ID=(YOUR_APP_ID)
PUSHER_APP_KEY=(YOUR_APP_KEY)
PUSHER_APP_SECRET=(YOUR_APP_SECRET)
PUSHER_APP_CLUSTER=(YOUR_APP_CLUSTER)