szaranger

import React, { useState} from "react";

function App() {
  const [count, setCount] = useState(0);
  
  function handleClick(){
    return (setTimeout(() => {
      alert("You clicked on: " + count);
    }, 3000));
  }

szaranger

function App() {
  const [count, setCount] = useState(0);
  const latestValue = useRef(count);
  
  const handleClick = () => {
    setTimeout(() => {
      alert(`count is: ${latestValue.current}`);
    }, 3000);
  };
  

szaranger

test('Clicking on + increments the number', () => {
  // using enzyme
  const wrapper = mount(<Count />);
                        
  expect(wrapper.state('count')).toBe(0);
  wrapper.instance().incrementCount();
  expect(wrapper.state('count')).toBe(1);
});

szaranger

test('Clicking on + increments the number', () => {
  // using React Testing Library
  render(<Count  />);
         
  expect(screen.getByText('Total')).toBeInTheDocument();
  userEvent.click(screen.getByText('Click'));
	expect(screen.queryByText('1')).toBeInTheDocument();
});

szaranger

import React from 'react';
import { renderToString } from 'react-dom/server';

function App() {
  const html = renderToString(<>Hey there!</>);
  
  return <div dangerouslySetInnerHTML={{__html: html}}></div>;
};

export default App;

szaranger

import React from 'react';
import ReactDOMServer from 'react-dom/server';
import express from 'express';

const app = express();

app.use('/static', express.static('public'));

const App = (props) => {
    return <div>Hello {props.name}</div>;

szaranger

@Freeze
class Person {}

function Freeze(constructor: Function) {
  Object.freeze(constructor);
  Object.freeze(constructor.prototype);
}

console.log(Object.isFrozen(Person)); // true

szaranger

export class Person {
  @Emoji()
  name = 'Sean';
}

// Property Decorator
function Emoji() {
  return function(target: Object, key: string | symbol) {
    let val = target[key];
    

szaranger

export class Person {
  names = [];
  
  @Confirmable('Are you sure?')
  @Confirmable('Are you super, super sure? There is no going back!')
  addName(name) {
    this.names.push(name);
  }
}

szaranger

enum WeekDay { 
  MONDAY = 0, 
  TUESDAY = 1, 
  WEDNESDAY = 2,
  THURSDAY = 3,
  FRIDAY = 4,
  SATURDAY = 5,
  SUNDAY = 6
}