Find up to date snippets for JavaScript & React use cases

Last updated Jan 23, 2020

import React, { useState } from "react";

function Counter() {
  const [count, setCount] = useState(0);

  function handleClick() {
    setCount(count + 1);
  }

  return (
    <>
      <h1>{count} times</h1>
      <button onClick={handleClick}>Add 1</button>
    </>
  );
}

Last updated Aug 24, 2018

<div id="box" class="active"></div>

const element = document.querySelector("#box");

element.classList.contains("active");

true

Last updated Nov 11, 2017

const name = "John";

console.log(`Welcome ${name}.
You have ${2 * 5} new notifications!`);

Welcome John.
You have 10 new notifications!

Last updated Nov 11, 2017

<div id="box"></div>

const element = document.querySelector("#box");

element.classList.add("class-name");

Last updated Nov 11, 2017

const text = "codetogo saved me tons of time";

text.replace(/ /g, "-");

codetogo-saved-me-tons-of-time

Last updated Nov 11, 2017

window.location.reload();

Last updated Nov 11, 2017

<div id="box"></div>

const element = document.querySelector("#box");

Last updated Nov 11, 2017

const people = ["Sam", "Alex", "Charlie"];

people.forEach(person => {
  console.log(person);
});

Sam
Alex
Charlie

Last updated Nov 11, 2017

<div id="box"></div>

const element = document.querySelector("#box");

element.addEventListener("click", event => {
  console.log("Element clicked");
});

Last updated Nov 11, 2017

const person = {
  key: "value",
  first_name: "John",
  last_name: "Doe"
};

Object.keys(person);

['key', 'first_name', 'last_name']

Last updated Nov 11, 2017

let counter = 0;
counter++;

1

Last updated Nov 11, 2017

const text = "Hello World";

text.toUpperCase();

HELLO WORLD