misss-popcorn

import React from "react";
import "../../App.css";

export class Class extends React.Component {
  constructor() {
    super();

    this.state = {
      name: ""
    };

misss-popcorn

import React, {useState} from "react";
import "../../App.css";

export default function Function() {
  const [name, setName] = useState("");

  const handleChange = (e) => {
    setName(e.target.value);
  };

misss-popcorn

import React from "react";

export default class UseEffectClass extends React.Component {
  constructor() {
    super();

    this.state = {
      name: "Romalia"
    };

misss-popcorn

import React, {useState, useEffect} from "react";

export function UseEffectFunc() {
  const [name,
    setName] = useState("Maria");

  useEffect(() => {
    document.title = name;
  });

misss-popcorn

import React, {useState, useEffect} from "react";

export function UseEffectFunc() {
  const [name,
    setName] = useState("");
  const [textColor,
    setTextColor] = useState("white");

  useEffect(() => {
    const ColorCode = "rgb(" + (Math.floor(Math.random() * 256)) + "," + (Math.floor(Math.random() * 256)) + "," + (Math.floor(Math.random() * 256)) + ")";

misss-popcorn

import React from "react";

export default class UseEffectClass extends React.Component {
  constructor() {
    super();
    this.interval = 0;
    this.state = {
      count: 0
    };

misss-popcorn

import React, {useState, useEffect} from "react";

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

  useEffect(() => {
    const interval = setInterval(() => {
      setCount(count => count + 1);
    }, 1000);
    return () => {

misss-popcorn

const [name, setName] = useState(“”);

misss-popcorn

componentDidUpdate(prevProps, prevState) { 
  if (this.state.name !== prevState.name) 
    this.setState({textColor: getRandomColor()}); 
}

misss-popcorn

useEffect(() => {
    document.title = name;
}, [name]);