Whitney Stevenson WhitneySt

## SignupForm.jsx
import React from 'react';
import { useFormik } from 'formik';

 const validate = values => {
   const errors = {};

   if (!values.firstName) {
     errors.firstName = 'Required';
   } else if (values.firstName.length > 15) {
     errors.firstName = 'Must be 15 characters or less';

## index.html
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Blog de Desarrollo Web - Artículos, Tutoriales y Más</title>
    <meta name="description" content="Bienvenido a mi blog de desarrollo web donde encontrarás artículos, tutoriales y noticias sobre HTML, CSS, JavaScript y más. Aprende a crear sitios web efectivos y optimizados.">
    <meta name="keywords" content="desarrollo web, HTML, CSS, JavaScript, tutoriales, artículos, SEO">
    <meta name="author" content="Nombre del Autor">
    <link rel="stylesheet" href="styles.css">

## canvas.html
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Canvas API Example</title>
    <style>
        canvas {
            border: 1px solid black;
        }

## script.js
//Ejemplo de alcance léxico
let a = "global";

function externa() {
  let b = "externa";
  function interna() {
    let c = "interna";
    //a = "cambio en interna"
    console.log(a, b, c);
  }

## script.js
//SCOPE LEXICOS vs ENTORNO LEXICO

let a = "global";

function externa() {
  let b = "local";
  function interna() {
    let c = "interna";
    //a = "Se cambió en el scope interno"
    console.log(a, b, c);

## script.js
//Ámbito lexico

let a = "global";

function externa() {
  let b = "externa";
  function interna() {
    let c = "interna";
    //a = "Cambio de a en interna";
    console.log(c, b, a);

## index.html
<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Sesión 3</title>
  </head>
  <body>
    <h1>Sesión 3: Tagged Templates</h1>
    <article id="ejemploTagged"></article>

## index.html
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sesión 3</title>
</head>
<body>
    <h1>Sesión 3: Tagged template</h1>
    <article id="ejemplo1"></article>

## dataImages.js
export const imagen1 =
  "https://www.tooltyp.com/wp-content/uploads/2014/10/1900x920-8-beneficios-de-usar-imagenes-en-nuestros-sitios-web.jpg";
export const imagen2 =
  "https://st.depositphotos.com/1016440/2534/i/450/depositphotos_25344733-stock-photo-sunrise-at-the-beach.jpg";
export const imagen3 =
  "https://ichef.bbci.co.uk/ace/ws/640/cpsprodpb/9db5/live/48fd9010-c1c1-11ee-9519-97453607d43e.jpg.webp";

## bash
# Para implementar vite como Bundler
$ npm create vite@latest my-module-app -- --template vanilla

# Si necesitan instalar una versión antigua de vite
$ npm install vite@2.9.10
	import React from 'react';
	import { useFormik } from 'formik';

	const validate = values => {
	const errors = {};

	if (!values.firstName) {
	errors.firstName = 'Required';
	} else if (values.firstName.length > 15) {
	errors.firstName = 'Must be 15 characters or less';
	<!DOCTYPE html>
	<html lang="es">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Blog de Desarrollo Web - Artículos, Tutoriales y Más</title>
	<meta name="description" content="Bienvenido a mi blog de desarrollo web donde encontrarás artículos, tutoriales y noticias sobre HTML, CSS, JavaScript y más. Aprende a crear sitios web efectivos y optimizados.">
	<meta name="keywords" content="desarrollo web, HTML, CSS, JavaScript, tutoriales, artículos, SEO">
	<meta name="author" content="Nombre del Autor">
	<link rel="stylesheet" href="styles.css">
	//Ejemplo de alcance léxico
	let a = "global";

	function externa() {
	let b = "externa";
	function interna() {
	let c = "interna";
	//a = "cambio en interna"
	console.log(a, b, c);
	}
	//SCOPE LEXICOS vs ENTORNO LEXICO

	let a = "global";

	function externa() {
	let b = "local";
	function interna() {
	let c = "interna";
	//a = "Se cambió en el scope interno"
	console.log(a, b, c);
	//Ámbito lexico

	let a = "global";

	function externa() {
	let b = "externa";
	function interna() {
	let c = "interna";
	//a = "Cambio de a en interna";
	console.log(c, b, a);
	export const imagen1 =
	"https://www.tooltyp.com/wp-content/uploads/2014/10/1900x920-8-beneficios-de-usar-imagenes-en-nuestros-sitios-web.jpg";
	export const imagen2 =
	"https://st.depositphotos.com/1016440/2534/i/450/depositphotos_25344733-stock-photo-sunrise-at-the-beach.jpg";
	export const imagen3 =
	"https://ichef.bbci.co.uk/ace/ws/640/cpsprodpb/9db5/live/48fd9010-c1c1-11ee-9519-97453607d43e.jpg.webp";
	# Para implementar vite como Bundler
	$ npm create vite@latest my-module-app -- --template vanilla

	# Si necesitan instalar una versión antigua de vite
	$ npm install vite@2.9.10