Skip to content

Instantly share code, notes, and snippets.

@warderer
warderer / App.css
Last active July 7, 2025 00:16
[React Hook Form Class] Master in Frontend forms class base code, module 7 class 1 #devf #react
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@warderer
warderer / App.css
Last active August 27, 2025 08:39
[React Advanced Hooks Example Form] An example multistep form with useRef, useReducer and useCallback #devf #masterfrontend #introreact
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
background-color: #f0f2f5;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
@warderer
warderer / async-await.js
Last active June 13, 2025 00:31
[Promesas y Async Await en JS] Ejemplos para Clase #4 de Master en Frontend - Módulo JS Avanzado #masterfrontend #modulo5
// RESOLVER PROMESAS 1: THEN - CATCH
function getPokemonThen(name = 'ditto') {
return fetch(`https://pokeapi.co/api/v2/pokemon/${name}`)
.then(response => {
if (!response.ok) {
throw new Error(`Error HTTP ${response.status}`);
}
return response.json();
})
.then(pokemon => {
@warderer
warderer / divi-section
Last active August 11, 2024 05:08
[Wordpress Divi Section Video with Background Gradient Overlay] With a Divi Section with background video, is posible to add a gradient overlay, useful to combine with divi section dividers and match divider color. #wordpress #divi #video-background
# Tool for creating background code: https://cssgradient.io/
# Go to Advanced Tab → Custom CSS → Free Form CSS and add this code:
selector::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
@warderer
warderer / Signup.jsx
Created July 4, 2024 02:11
[Signup Form Base] Ejemplo de #form Signup con Bootstrap para curso de #react
import logo from '@/assets/react.svg'
import '@/styles/form.css'
const Signup = () => {
return (
<main className='form-signin w-100 m-auto'>
<form>
<img className='mb-4' src={logo} alt='' width='72' height='57' />
<h1 className='h3 mb-3 fw-normal'>Please sign up</h1>
@warderer
warderer / admin.sql
Created May 30, 2024 05:08
[Cambiar rol de usuario a Administrador en Wordpress] Desde la base de datos, cambiar el rol de usuario a Administrador #wordpress
-- Referencia: https://decodecms.com/crear-usuario-administrador-de-wordpress-desde-la-base-de-datos/
-- Cambiar valores
SET @prefix = 'wp_25i9wh_'; -- Prefix de la tabla de la instalación de WP
SET @id_user = 1; -- Usuario al que se hará administrador
-- Actualiza tabla de usermeta
SET @set_value_meta ='SET meta_value = ''a:1:{s:13:"administrator";b:1;}'' WHERE user_id =';
SET @usermeta = CONCAT("UPDATE ", @prefix, "usermeta ", @set_value_meta, @id_user,' AND meta_key = "', @prefix, 'capabilities";' );
@warderer
warderer / 01-users.js
Last active April 4, 2025 03:34
[Seeds Knex Homes y Users] Para ejemplo en clase de código de Knex con JS. #devf
/**
* @param { import("knex").Knex } knex
* @returns { Promise<void> }
* author: César Guerra
*/
exports.seed = async function (knex) {
// Deletes ALL existing entries
// Se necesita borrar las tablas en un orden específico para evitar errores de llave foránea. Y es necesario reiniciar la secuencia de las tablas para que los nuevos registros tengan un id consecutivo que empiece en 1 cada vez que se ejecuta el seed.
await knex.raw('TRUNCATE homes RESTART IDENTITY CASCADE')
await knex.raw('TRUNCATE users RESTART IDENTITY CASCADE')
@warderer
warderer / ReactHookForm.jsx
Last active June 25, 2024 02:08
[React Forms Base] Formularios base para el curso de React
import logo from '../assets/react.svg'
const ReactHookForm = () => {
return (
<div className='login'>
<div className='login-container'>
<img src={logo} alt='logo' />
<form
onSubmit={() => { }/* HANDLE SUBMIT */}
@warderer
warderer / style.css
Created July 23, 2023 17:23
[Animate Divi Section Dividers CSS Only] Animate Wordpress Divi Section Dividers #wordpress #divi #animation #css
/* Animate Wordpress Divi Top and Bottom Dividers */
/* HOW TO USE */
/* Add the following code to the Custom CSS box in Divi Theme Options */
/* Add the class "bg-animate-bottom" or "bg-animate-top" to the divi section divider */
.bg-animate-bottom .et_pb_bottom_inside_divider {
-webkit-animation: scroll 150s linear infinite;
-moz-animation: scroll 150s linear infinite;
-ms-animation: scroll 150s linear infinite;
-o-animation: scroll 150s linear infinite;
@warderer
warderer / terminal
Last active May 18, 2023 06:57
[Rename PhotosVideos with Date - Time] Using Windows Terminal to Mass Rename all Files in a Folder with Date and Time #windows #photos #videos
- Windows Terminal Command to Rename all files in a folder with Year day month format and time using the last writted time (modified date)
# Option #1
Get-ChildItem | Rename-Item -NewName {$_.LastWriteTime.ToString("yyyy-dd-MMM HH.mm.ss") + ($_.Extension)}
# Option #2
Get-ChildItem | Rename-Item -NewName {$_.LastWriteTime.ToString("yyyy-MM-dd HH.mm.ss") + ($_.Extension)}
- Windows Terminal Command to Rename all image files in a folder with Date of the taken time
$shell = New-Object -ComObject shell.application