🔥 ¡Nuevo video en Youtube! 🔥 OPENCODE + OLLAMA INTELIGENCIA ARTIFICIAL 100% LOCAL ✅ Uso de modelos locales con ollama ✅ Modelos cuantizados ✅ Usar Opencode con modelos locales ✅ Customizar modelos con Modelfile (estilo docker) 👇 Links
ManzDev
@manz.dev
@Twitch Partner | Web developer & Engineer | http://manz.dev Content creator at http://lenguajeJS.com | I❤️HTML/CSS/JS FullStack teacher at @eoi | «Odio quedarme a med
🔥 ¡Nuevo video! Tutorial de ComfyUI 🔥 ✅ ComfyUI: Herramienta para crear imágenes ✅ En local: GRATIS y sin suscripciones ✅ Conceptos y modelos para utilizar ✅ Explicaciones con workflows de ejemplo 👇 Link
¡Este domingo 1/MAR empieza la FASE 2 del BOOTCAMP GRATUITO de Desarrollo web moderno. ✅ Bases de HTML ✅ Etiquetas (desde `<div>` hasta `<template>`) ✅ Semántica, accesibilidad y rendimiento ✅ HTML-first y mejora progresiva ✅ Novedades (diálogos, popovers, invokers...) 👇
La clase del Bootcamp de ayer, creo que ha sido la mejor con diferencia. El feedback ha sido buenísimo. ¿Qué te pareció? ✅ Inteligencia Artificial y LLM ✅ Agentes: OpenCode ✅ Usamos Ollama como LLM local ✅ Usamos ComfyUI en local para generar imágenes 👇 ¡Tienes ya la clase en Youtube!
El próximo JUEVES 19, tendremos la cuarta clase del Bootcamp gratuito: Inteligencia Artificial. ✅ Inteligencia Artificial y LLM ✅ IA: Modalidad cloud vs local ✅ Instalación y uso de Ollama (LLM locales) ✅ Modelos LLM y agentes (OpenCode) ✅ IA Generativa: Workflows con ComfyUI 👇 Enlaces abajo
¡Este domingo 15, nueva clase del Bootcamp gratuito! ✅ Día 1: WSL y Terminal de Linux ✅ Día 2: Fundamentos de Javascript 📆 Día 3: Control de proyectos JS Vamos a aprender a crear y gestionar un proyecto Javascript usando herramientas como pnpm, node, oxc y usando git y GitHub. 👇 Enlaces abajo
¡Ya está disponible la segunda clase del Bootcamp! FUNDAMENTOS DE JAVASCRIPT ✨ Variables (const, let e using) ✨ Tipos de datos (String, Map... y hasta Symbol) ✨ Condicionales y bucles ✨ Funciones (Arrow functions incluidas) ✨ Clases 👇 Enlace al video abajo
¡Ya está publicada la clase del domingo 8 en Youtube! ✅ Clase 1: Instalación WSL + Terminal de Linux ✅ Clase 2: Fundamentos + Bases de Javascript 📆 Clase 3 (15/FEB): Bases de Git + PNPM + OXC 📆 Clase 4 (19/FEB): Inteligencia Artificial + IA local 👇 Enlaces abajo
¡Mañana, 8/FEB, seguimos con el Bootcamp gratuito! ✨ Recuerda: Bootcamp enfocado en ENTENDER. ✨ Todos los domingos, en Twitch y Youtube. ✨ En la web tienes más información. ✨ Si te perdiste la primera sesión, ¡video en la web! ✨ Mañana: Fundamentos de programación / Javascript. 👇 Links abajo
¡Ayer comenzamos el Bootcamp gratuito de Desarrollo web en Twitch/Youtube! ¡Más de 300 usuarios simultáneos entre ambas plataformas! ¡Un domingo! ¡Gracias a todos! 💖 👇 Tienes el contenido en la web del Bootcamp
⌛ ¡Sólo falta una semana y arrancamos! ✅ Bootcamp de fundamentos web ✅ Inicio: 1 de FEBRERO ✅ Twitch / Youtube ✅ Todos los domingos ✅ Gratuito 🚀 ¿Vienes a aprender conmigo?
💜 ¡Acabo de lanzar la nueva HTML Cheatsheet 2026! ✅ Separados por temática y subcategorías ✅ Etiquetas HTML/SVG y atributos modernos ✅ Modos de Scripting (módulos, maps, rules...) ✅ Capacidades multimedia de HTML ✅ Formato PDF lista para imprimir 👇
💜 ¡Comandos de terminal! ¡Nueva Cheatsheet 2026! ✅ Separados por temática y subcategorías ✅ Alternativas modernas a comandos clásicos ✅ Colores para indicar si son Rust/Go/Python ... ✅ Recetas para instalar ciertas herramientas ✅ Formato PDF lista para imprimir 👇
¡Tengo algo que anunciar! ¡El próximo 1/FEB comenzamos Bootcamp gratuito de Desarrollo web en Twitch/Youtube! ✅ Prioridad: entender los fundamentos ✅ Enfoque moderno ✅ Tienes el temario en la web ✅ Si tienes alguna duda, visita la FAQ 👇 ¡Comparte y sígueme en redes para no perdértelo!
🎨 ¡Modern CSS Cheatsheets 2026! ¡Acabo de lanzar las nuevas Cheatsheets CSS! Incluye: ✅ Descargable en PDF ✅ Color + Box Model + Corner Shape ✅ Fonts + Efectos + Masks + Shapes ✅ Animaciones + Flex + Grid + Anchor Position ✅ Matemáticas + Lógica CSS + Condicionales ⬇ ¡Y mucho más!
Una de las limitaciones de Flex y Grid era no poder colocar líneas divisorias a las celdas. Con la nueva propiedad CSS `rule` de Decoration Gaps podemos crear esas decoraciones a los gaps de nuestro diseño: ✅ Propiedades `column-rule-*` ✅ Atajos `rule` 👇 Te la explico abajo
📘 Principios de OOP 📘 ¿Existen también para CSS? Uno de los principales problemas de CSS es que los DESARROLLADORES ❌no se preocupan en aprender CSS correctamente. CSS no es OOP, sin embargo, sus principios se pueden aplicar de forma muy similar en CSS... 👇 ¡Observa!
📒 Curso gratuito de programación Frontend ¡Inscripciones recién abiertas! Buscamos alumnos interesados en entrar de forma profesional al mundo de la programación, aprendiendo fundamentos, usando la inteligencia artificial y herramientas modernas de forma adecuada. 👇 Link
🚀 ¡Las funciones CSS han llegado a CSS! 🚀 ✅ La regla `@function` permite crear funciones ✅ El nombre de la función se prefija con `--` ✅ Opcionalmente, puedes tipar los parámetros, dar un valor por defecto y tipar la devolución ✅ La propiedad `result` devuelve el valor 👇 Sigue
🥊 DESTRUYENDO MITOS 🥊 Una pregunta que me hacen mucho: ¿Qué es mejor, `getElementById()` o `querySelector()`? Analizamos: 1️⃣ Búsqueda de elementos 2️⃣ Ámbito de búsqueda 3️⃣ ¿Qué devuelve? 4️⃣ Rendimiento 5️⃣ Gestión de errores 6️⃣ Legibilidad de la API 👇
¡Subido video a Youtube! Debatimos muchas ideas sobre el tema «¿Puede una IA pensar y razonar?» - ¿Qué es realmente pensar y razonar? - La historia de ELIZA - ¿Cómo piensa realmente una IA (LLM)? - Los loros estocásticos - Vibe coding vs Vibe learning - Debate y opiniones del chat 👇 Link
¡Recuerda que en LenguajeCSS tienes una plataforma para ver de un solo vistazo el soporte en navegadores! ✅ Propiedades, funciones, reglas o selectores CSS ✅ Etiquetas y atributos HTML o SVG ✅ Tipos, APIs y métodos de Javascript ✅ Con posibilidad de filtrar ✅ Haciendo clic te da más información 👇
📚 Entendiendo el SHADOW DOM ❌ En programación es fácil escribir datos desorganizados y perder el foco ✅ La "encapsulación" consiste en organizar datos y métodos para simplificar y reutilizar ❌ Muchos datos sin organizar: desordenado y confuso ✅ Una clase OOP organiza, simplifica y reutiliza
![EVITAR:
const family = {
name: "Grandfather",
children: [
{
name: "Uncle",
children: []
},
{
name: "Parent",
children: [
{
name: "Child",
children: []
}
]
}
]
};
MEJOR:
export default class Person {
constructor(name) {
this.name = name;
this.children = [];
}
addChild(child) {
this.children.push(child);
}
}
import Person from "./Person.js";
const child = new Person("Child");
const uncle = new Person("Uncle");
const parent = new Person("Parent");
parent.addChild(child);
const family = {
name: "Grandfather",
children: [
uncle,
parent,
]
}](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:24tjmh3i2agyetlod5v457ho/bafkreiewkpsfd5ip4hzrps2igjs2kdpe7y2o5k3lbxzrgyi33ihhblkltm)
📒 Técnicas y consejos del DOM (2025) 📒 ✨ Busca hijos (descendientes) con .querySelector/All ✨ Busca padres (ancestros) con .closest() ⛔ Evita getElementById() u otros, menos flexibles ✨ Usa .classList y sus métodos para manipular clases ⛔ Evita el uso de .className Sigue 👇
🚀 Usa tu propio ChatGPT local con Ollama 🚀 🦙 Ollama es el programa (cliente). Puedes descargarlo desde su página oficial (Win/Mac/Linux). 🦙 Su última versión incorpora una interfaz similar a ChatGPT (Win/Mac), donde puedes elegir el modelo a usar y tener historiales con las conversaciones.
A raíz de un tweet de Maximiliano Firtman ( x.com/maxifirtman/... ) decidí crear un breve artículo sobre el tema con mi opinión: 👇 «¿Pueden las inteligencias artificiales (LLM) pensar y razonar?» lenguajejs.com/aprender-a-p...
🚀 ROADMAP FRONT-END 2025 🚀 ✅ Orden para aprender conceptos y tecnologías ✅ Empieza por pilares: Diseño, desarrollo o terminal ❌ No empieces por frameworks. Aprende la base. ✅ Cuanto más a la derecha, más específico. ✅ Ojo con la IA: Pide explicaciones, no soluciones. 👇
💜 Container Media Queries 💜 ¡Cómo las @media queries, pero mejores! ✅ Media Queries ▶ Tamaño total del navegador ✅ Container Queries ▶ Tamaño del contenedor padre ✅ Se adapta al contenedor donde está ubicado ✅ Ideal para componentes 👇
📚 ¿Sabes usar los nuevos Media Queries? 💥 No más `screen` o los molestos mínimos y máximos ✅ Expresiones de rangos flexibles y potentes ✅ ¡Puedes incluso anidar `@media` en el CSS! ✅ Los `media features` detectan otras características, no sólo la pantalla del dispositivo ¿A que son más cómodos? 👇
🚀 ¡Deja de usar <div> para todo! ¡HTML semántico! ✅ Usa `<picture>` sobre `<img>` (soporte moderno) ✅ Usa bien los encabezados: <h1>, <h2>... ✅ Usa `<hgroup>` en titulares con info adicional ✅ Usa `rel` en los enlaces para dotar semántica Y sobre todo, recuerda... ❌ ¡No uses `<div>` siempre!
