DennyScott

export function CatFacts({id}) {
  const [data, setData] = useState();
  const [urlOfData, setUrlOfData] = useState();
  const proxyUrl = "https://cors-anywhere.herokuapp.com/";
  const targetUrl = `https://cat-fact.herokuapp.com/facts/${id}`;

  if (!data || urlOfData !== id) {
    fetch(proxyUrl + targetUrl)
      .then(response => response.json())
      .then(facts => {

DennyScott

export function CatFacts() {
const [data, setData] = useState(null);
  const proxyUrl = "https://cors-anywhere.herokuapp.com/";
  const targetUrl = `https://cat-fact.herokuapp.com/facts/random`;
  
  if(!data) {
    fetch(proxyUrl + targetUrl)
    .then(response => response.json())
    .then(facts => {
      setData(facts.text);

DennyScott

export function CatFacts() {
  const [data, setData] = useState(null);
  const proxyUrl = "https://cors-anywhere.herokuapp.com/";
  const targetUrl = `https://cat-fact.herokuapp.com/facts/random`;
  fetch(proxyUrl + targetUrl)
    .then(response => response.json())
    .then(facts => {
       setData(facts.text);
    });
  return <div>{data}</div>;

DennyScott

export function CatFacts() {
  const proxyUrl = "https://cors-anywhere.herokuapp.com/";
  const targetUrl = `https://cat-fact.herokuapp.com/facts/random`;
  
  let data;
  function getData() {
    fetch(proxyUrl + targetUrl)
      .then(response => response.json())
      .then(facts => data = facts);
  }

DennyScott

useEffect(() => someCode())

DennyScott

function MyComponent({username}) {
  const [isOpen, setOpen] = useState(false);
  
  return (...)
}

DennyScott

function MyComponent({username}) {
  const [user, setUser] = useState(username);
  
  return (...)
}

DennyScott

function ComponentUsingHOC({ user, color, location }) {
  return (
    <div>
      <div>Color : {color}</div>
      User: {user.name}
      <Location 
		city={location.city} 
		country={location.country} 
	  />
    </div>

DennyScott

function ComponentWithHook() {
  const user = useSelector(state => state.user);
  const color = useSelector(state => state.color);
  const location = useSelector(state => state.user.location);

  return (
    <div>
      <div>Color : {color}</div>
      User: {user.name}
      <Location city={location.city} country={location.country} />

DennyScott

const newSelectedState = latestSelector.current(store.getState())

if (equalityFn(newSelectedState, latestSelectedState.current)) {
  return
}

forceRender({})