Si no la has visto, ALTO. No considero spoiler lo que pongo aquí (sólo detalles de la pantalla), pero quizás prefieras no saber nada de nada hasta que hayas visto la serie (temporada 4, capítulo 6).
🧵🔽
La serie está ambientada en 1986. En una pantalla de una Amiga (1985) nos encontramos la siguiente interfaz. Parece una interfaz del estilo Workbench, pero en un monitor de fósforo verde.
Arriba aparece versión 1.0, aunque a la derecha podemos ver Workbench 1.3.
Aparece una pantalla con código (oh-oh), veamos de que se trata. A simple vista, parece Java (1995), C# (2000) o similar, con referencias a un cliente de SQL (1974) o a ¿LINQ de C#? (2007)
Más abajo, referencias entre otras cosas, a TeX ¿LaTeX? (1984) y Turbo C++ (1990).
Un poco más abajo, hay una referencia a Modula-2 (1978), quizás es solo casualidad, pero ksh ¿será Korn Shell? (1983) y a... ¡CoffeeScript! (2009)
A partir de aquí, empieza a mostrar código HTML (1993), como podemos ver con un iframe a un script de donación en PHP (1995).
El `iframe` (tiene un referer) que parece que procede de una URL del dominio crawl.org, con una estructura de una web de archive.org ( archive.org/web/XXXXXX/URL ), donde veremos más adelante que parece que se han basado para modificarlo ligeramente.
Un poco más adelante, vemos que aparece código HTML (1993) y CSS (1996) donde parece que ya estaban usando Flexbox (y nosotros esperando en 2009 a que los navegadores empezaran a soportarlo).
Hay código comentado en estilos CSS en linea y referencias a ficheros BMP (1986).
En algunas partes veremos que hacen referencia a una web weylanbaccess.yutani1980.nu/mahtnez, mientras que en otras pone "webaccess" (¿typo?).
También tenemos un poco de código Javascript (1995) para manejar el foco y seleccionar texto en los campos de un formulario.
Un poco más adelante se pueden leer textos como "See a list of every capture for this URL" o "Timespan for captures of this URL", así como clases como
Al final (clásico estereotipo) se termina localizando una IP, y para ello se ejecuta un fichero .bat.
No estoy seguro de este, pero diría que los ficheros BATCH son de 1988 (aprox), ya que MSDOS 4.0 es el primero que empieza a incorporarlos.
En el impreso:
1️⃣ Fichero ejecutable MirkETW.exe
2️⃣ Accede a https://some.mirk:3200/falcor/_doc/
3️⃣ ID de un proceso. Siempre queda bien
4️⃣ El usuario no especificado. Otro clásico
5️⃣ Referencia a DotNET (2016?)
Seguro que se me escaparon cosas... ¿Alguna que hayas visto?
• • •
Missing some Tweet in this thread? You can try to
force a refresh
1️⃣ No agrupes selectores en la misma línea, separa.
2️⃣ Aunque tengas canal alfa, usa RGB() y no RGBA(). Incluso ya puedes usar hexadecimal con canal alfa.
3️⃣ Si tienes propiedades con valores múltiples, separa en múltiples líneas.
4️⃣ Usa variables CSS. Se colocan al inicio, separados por una línea en blanco del resto de props. ¡Y tienen ámbitos locales!
5️⃣ Se pueden guardar todo tipo de datos: medidas, gradientes, colores, funciones css, keywords, etc...
6️⃣ Con `var()` puedes usarlas y añadir un fallback.
En Javascript, cualquier array tiene una serie de métodos que hace muy fácil trabajar con ellos. Además, forma parte de las bases de la programación funcional.
¡Te explico cuales son y como funcionan!
🧵🔽
📒Antes de empezar, imaginemos que tenemos una estructura de datos basada en un array. Cada elemento es un objeto con sus propiedades.
Para simplificar, en los siguientes ejemplos cada objeto (ítem) se representa con un Sticker de ManzDev, Batmanz y San @goncy incluidos.
📚Las "array functions" son métodos que se ejecutan sobre un array, y a los que les pasamos una función que se ejecuta por cada uno de sus elementos.
Si aún no sabes usar las arrow functions, echa un ojo:
➡
Una ventana modal es aquella que al aparecer, impide al usuario hacer otra cosa hasta que la atiendas.
Te explico (en un par de tweets) como hacer una ventana modal de forma nativa con HTML (y un poquito de Javascript).
🧵🔽
1️⃣ En HTML existe la etiqueta <dialog>, no muy conocida, que nos permite crear ventanas de diálogo con el contenido que queramos (texto, imágenes, video, botones, etc...).
La etiqueta por defecto está cerrada, pero con el atributo `open`, o llamando a `.show()`, se muestra.
2️⃣ Al igual que podemos mostrar la ventana de diálogo con `dialog.show()`, podemos cerrarla con `dialog.close()`, por lo que podemos establecer un evento en el botón del interior de la ventana.
A continuación, una ruta cronológica de tecnologías Javascript para aprender Frontend, saber en que lugar estás y en que podrías seguir enfocándote en aprender.
⚠ Disclaimer:
Cuida tus soft skills. Es una ruta subjetiva.
¡Vamos allá!
🧵🔽
1️⃣ En primer lugar, aprende bases y fundamentos de diseño web.
Para ser más productivo, se usan frameworks CSS como Bootstrap o Tailwind.
2️⃣ El siguiente paso sería aprender fundamentos de programación (es una carrera de fondo) para luego empezar con Javascript ( lenguajejs.com ) y la terminal ( terminaldelinux.com ). Es muy importante.
VSCode es el editor más usado. Aprende git (control de versiones)
Hay ciertos conceptos denominados «FUOC», «FUOT» o «FOIT» relacionados con los estilos CSS de una página y la forma de cargarlos.
¡Te explico en un par de tweets de que se trata!
🧵🔽
1️⃣ El concepto «FUOC» son las siglas de «Flash of unstyled content», o lo que es lo mismo, ese momento al cargar la página que, durante unos instantes, muestra contenido de una forma extraña y particular, y de repente se "coloca" todo correctamente.
Esto ocurre porque al navegador no le ha dado tiempo de descargar y aplicar los estilos en el navegador, y lo que estás viendo es el contenido de la página sin CSS (o sin parte de ellos).
En algunos casos puede ocurra sólo en el primer acceso, porque el navegador cachea el CSS.