Giagnus64

const button = document.querySelector("#like-btn")

button.addEventListener('click', handleClick)

function handleClick(event){
  console.log("Button clicked!")
}

Giagnus64

// pass in event type, options
const clickEvent = new Event("click", {"bubbles":true, "cancelable":false});

//call event on element
button.dispatchEvent(clickEvent);

//=> "Button clicked!"

Giagnus64

// This event has different options
const kbEvent = new KeyboardEvent('keypress', {
  key:"e"
  shiftKey:"true"
 });
//see how the event is called on document
document.dispatchEvent(kbEvent);

Giagnus64

const colorBtnSim = document.querySelector(".simulate-color");
const divToChange = colorBtn.parentElement;

colorBtnSim.addEventListener('click', colorBtnSimClicked); 

function colorBtnSimClicked(event){
    const colors = ["skyblue", "green", "orange", "yellow"];
    event.target.parentElement.style.backgroundColor = colors[Math.floor(Math.random()*colors.length)];
}

Giagnus64

store.dispatch({type: 'WITHDRAW', amount: 10})

Giagnus64

const initialState = {
  balance: 0
}

function rootReducer(state = initialState, action) {
  switch (action.type) {
    case 'WITHDRAW':
      return{...state, balance: state.balance - action.amount}
    case 'DEPOSIT':
      return {...state, balance: state.balance + action.amount}

Giagnus64

import {createStore} from 'redux'
import rootReducer from './reducer.js'

const store = createStore(rootReducer)

Giagnus64

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import { Provider } from 'react-redux';
import { createStore } from 'redux';
import rootReducer from './reducer' 

const store = createStore(rootReducer)

Giagnus64

import React, { Component } from 'react';
import { connect } from 'react-redux';


class Counter extends Component{

    render(){
        return(
        <div>
            <button onClick={this.props.deposit}>Deposit $10</button>

Giagnus64

import React, { Component } from 'react';

class Counter extends Component{
    state={
    balance: 0
    }
    
    //const withdraw10 = () => {...}
    //const deposit10 = () => {...}
    render(){