Kcko

import { useLocalStorage } from "./useLocalStorage"

function App() {
  const [firstName, setFirstName] = useLocalStorage("FIRST_NAME", "")

  const [lastName, setLastName] = useLocalStorage("LAST_NAME", () => {
    return "Default"
  })

  const [hobbies, setHobbies] = useLocalStorage("HOBBIES", [

Kcko

import { useState, useCallback } from "react"

export function useArray(initialValue) {
  const [array, setArray] = useState(initialValue)

  const push = useCallback(element => {
    setArray(a => [...a, element])
  }, [])

  const replace = useCallback((index, newElement) => {

Kcko

_

Kcko

import { useEffect, useState } from "react";
import BlogList from "./BlogList";
import useFetch from "./useFetch";

const Home = () => {
  const { error, isPending, data: blogs } = useFetch('http://localhost:8000/blogs')

  return (
    <div className="home">
      { error && <div>{ error }</div> }

Kcko

import { useState } from "react";

function Cart() {
  const [cart, setCart] = useState({
    items: [],
    total: 0,
    discount: null,
    isLoading: false,
  });

Kcko

https://jsbin.com/qiyeriziyi/edit?html,css,output
https://jsbin.com/jewegaseyo/edit?html,css,output

Kcko

https://jsbin.com/cawipexoma/edit?html,css,output

Kcko

.toast {
  --base-toast-color: hsl(226, 87%, 56%);

  color: oklch(from var(--toast-color) 25% c h);
  border: 2px solid var(--toast-color);
  background: oklch(from var(--toast-color) 90% calc(c / 2) h);
  box-shadow: 0 12px 12px -8px oklch(from var(--toast-color) l c h / 0.325);
}
.oklch {
  [data-toast="info"] {

Kcko

/*
https://jsbin.com/setohiqiwe/edit?html,css,output
*/

:root {
	--color: red;
}

.a, .b, .c {
	margin: 1rem;

Kcko

<?php

$regex1 = '/(\d+) \1/';     // Backreference
$regex2 = '/(\d+) (?1)/';   // Subroutine

100 100 // ✅ only backreference
100 200 // ✅ both!


// https://github.com/Hamz-a/php-regex-best-practices/blob/master/07%20Writing%20modular%20regexes.md