01Clarian

import React from 'react'

const Weather = ({description, city, country, error, temperature}) => {

    function matchValues () {
    if(description) {
        const weatherDescription = description.split(' ')
        const keyWords = ['cloudy','clouds', 'cloud', 'overcast']
        for(let i = 0; i < weatherDescription.length; i++) {
            if(keyWords.includes(weatherDescription[i])) {

01Clarian

// MEMOIZATION AND CACHING: THE CONSTRUCTION FUNCTION EXAMPLE

// In order to better our understanding of Memoization, we will write a function
// entitled 'Building' and apply various logged results to observe the behaviour
// of JavaScript. 

// ****Additional Notes****

// In this example, you are the boss of a construction company.
// The construction company will be a reference to your Application.

01Clarian

import React from 'react';

class ClickCounter extends React.Component {
        constructor() {
            super()
            this.state = {
                count: 0
            }
        }
    increment = () => {

01Clarian

import React from 'react';

class HoverCounter extends React.Component {
        constructor() {
                super()
                this.state = {
                    count: 0
                }
            }
        increment = () => {

01Clarian

import React from 'react';

class HoverCounter extends React.Component {
        constructor() {
                super()
                this.state = {
                    count: 0
                }
            }
        increment = () => {

01Clarian

import React from 'react'

const EnhanceComponent = (OrignComponent) => {    

    class ModComponent extends React.Component {
        constructor() {
            super()
            this.state = {
                count: 0
            }

01Clarian

import React from 'react'

const EnhanceComponent = (OrignComponent) => {    

    class ModComponent extends React.Component {
        constructor() {
            super()
            this.state = {
                count: 0
            }

01Clarian

import React from 'react';
import EnhanceComponent from './EnhanceComponent';

const ClickCounter = (props) => {

        return (
        <button onClick={props.increment}>
            {props.count}</button>
        );
}

01Clarian

import React from 'react';
import EnhanceComponent from './EnhanceComponent'

const HoverCounter = (props)  => {
        return (
            <h2 onMouseOver={props.increment}>
                {props.count}</h2>
        );
}
export default EnhanceComponent(HoverCounter);

01Clarian

import React,{createContext, useState} from 'react'

export const ProductsContext = createContext({
    test: ''
})

const ProductsProvider = ({children}) => {
    const [test] = useState('the products provider has been successfully connected :)')
    return (
        <ProductsContext.Provider value={{test}}>