Skip to content

Instantly share code, notes, and snippets.

View Ricaidito's full-sized avatar
🔱

Ricardo Arturo Ricaidito

🔱
  • Foxbyte
  • Santo Domingo, Dominican Republic
View GitHub Profile
@Ricaidito
Ricaidito / useScreenSize.js
Created December 25, 2022 16:48
Custom React hook to detect if the screen width is within the specified bounds
import { useEffect, useState } from "react";
const defaultSize = 640;
export const useScreenSize = (sizeToCheck = defaultSize) => {
const [sizeOnBounds, setSizeOnBounds] = useState(
window.innerWidth <= sizeToCheck
);
const sizeChecker = () => {
@Ricaidito
Ricaidito / useStopwatch.js
Last active December 16, 2022 18:39
Custom React hook with stopwatch behavior
import { useState, useEffect } from "react";
export const useStopwatch = () => {
const [time, setTime] = useState(0);
const [isRunning, setIsRunning] = useState(false);
useEffect(() => {
let interval;
if (isRunning) {
interval = setInterval(() => {
@Ricaidito
Ricaidito / Dropdown.jsx
Last active December 15, 2022 23:42
React simple dropdown menu
import { useState } from "react";
import "./dropdown.css";
const Dropdown = ({ selected, setSelected }) => {
const [isActive, setIsActive] = useState(false);
const options = ["Option1", "Option2", "Option3"];
return (
<div className="dropdown">
<div className="dropdown-btn" onClick={() => setIsActive(!isActive)}>