👨🏼‍💻

khriztianmoreno's Blog

Inicio Etiquetas Acerca |

Posts with tag ai

WebContainers al máximo - Bolt.new combina IA y desarrollo full-stack en el navegador

2024-10-08
javascriptaiweb-development

¿Recuerdas los WebContainers? Es el "microsistema operativo" basado en WebAssembly que puede ejecutar las operaciones de Vite y todo el ecosistema Node.js en el navegador. El equipo de StackBlitz creó WebContainers para potenciar su IDE en el navegador, pero a menudo parecía que la tecnología todavía estaba buscando un caso de uso decisivo, hasta ahora.Esto se debe a que StackBlitz acaba de lanzar bolt.new , un sandbox de desarrollo impulsado por IA que Eric Simons describió durante ViteConf como "como si Claude o ChatGPT hubieran tenido un bebé con StackBlitz".Bolt.newIntentaré no imaginarlo demasiado vívidamente, pero en base a las críticas abrumadoramente positivas hasta el momento, supongo que está funcionando: docenas de desarrolladores lo describen como una combinación de v0, Claude, Cursor y Replit.En qué se diferencia Bolt: las herramientas de código de IA existentes a menudo pueden ejecutar algo de JavaScript/HTML/CSS básico en el navegador, pero para proyectos más complejos, es necesario copiar y pegar el código en un entorno local.Pero Bolt no. Al utilizar WebContainers, puede solicitar, ejecutar, editar e implementar aplicaciones web completas , todo desde el navegador.Así es como se ve:Puedes solicitarle a bolt.new que cree una aplicación de varias páginas lista para producción con un backend y una base de datos específicos, usando cualquier stack tecnológico que desees (por ejemplo: “Construye un blog personal usando Astro, Tailwind y shadcn”).A diferencia de otras herramientas, Bolt puede instalar y ejecutar paquetes y bibliotecas npm relevantes, interactuar con API de terceros y ejecutar servidores Node.Puede editar manualmente el código que genera a través de un editor en el navegador o hacer que Bolt resuelva los errores por usted . Esto es exclusivo de Bolt, porque integra IA en todos los niveles de WebContainers (no solo en el paso CodeGen).Puedes implementar en producción desde el chat a través de Netlify, sin necesidad de iniciar sesión.Hay mucho más que podríamos analizar aquí, pero la demostración de Eric es bastante salvaje.Para cerrar: desde fuera, no siempre estuvo claro si StackBlitz alguna vez obtendría un retorno significativo de la inversión durante los más de 5 años que han pasado desarrollando WebContainers. Pero, de repente, parece que podrían estar en una posición única para ayudar a los desarrolladores a aprovechar la IA para crear aplicaciones legítimas FullStack.<iframe width="560" height="315" src="https://www.youtube.com/embed/knLe8zzwNRA?si=7R7-1HxzwuyzL0EZ&amp;start=700" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>¡Espero que esto haya sido útil y/o te haya hecho aprender algo nuevo!Profile@khriztianmoreno �

Desbloquea tu creatividad con Google Gemini y JavaScript - Guía práctica

2024-06-12
javascriptaitutorial

Hola! Hoy les traigo una nueva herramienta que potenciará tu creatividad a otro nivel: Google Gemini. Esta API de inteligencia artificial te permite generar texto de alta calidad en español, desde simples frases hasta historias completas, con solo unas pocas líneas de código.¿Qué es Google Gemini?Google Gemini es un modelo de lenguaje de última generación desarrollado por Google AI. Se ha entrenado con un conjunto de datos masivo de texto y código, lo que le permite comprender y generar lenguaje natural con una precisión impresionante.¿Qué podemos hacer con Google Gemini y JavaScript?Las posibilidades son infinitas. Aquí te presento algunos ejemplos:Generar contenido creativo: Escribe poemas, historias, guiones, artículos de blog, o cualquier tipo de contenido textual que puedas imaginar.Traducir idiomas: Traduce textos de un idioma a otro de forma rápida y precisa. Responder preguntas: Obtén respuestas a tus preguntas de forma informativa y completa.Crear chatbots: Desarrolla chatbots conversacionales que interactúen con los usuarios de forma natural.Automatizar tareas: Automatiza la generación de informes, correos electrónicos, y otras tareas que requieren procesamiento de lenguaje natural.¿Cómo empezar?Para empezar a usar Google Gemini con JavaScript, solo necesitas:Una cuenta de Google Cloud Platform: https://cloud.google.com/Habilitar la API de Google Gemini: https://ai.google.dev/Ejemplo práctico:En este ejemplo, vamos a generar un poema usando Google Gemini y JavaScript.const { GoogleGenerativeAI } = require("@google/generative-ai"); // Access your API key as an environment variable (see "Set up your API key" above) const genAI = new GoogleGenerativeAI(process.env.API_KEY); async function run() { // For embeddings, use the embedding-001 model const model = genAI.getGenerativeModel({ model: "embedding-001" }); const text = "Escribe un poema sobre la naturaleza"; const result = await model.embedContent(text); const embedding = result.embedding; console.log(embedding.values); } run();Para la generación de texto usamos el método getGenerativeModel del objeto genAI.Ejemplo de poema generado:La tierra verde, el cielo azul, el sol brilla con luz de cristal. Las flores florecen en el jardín, los pájaros cantan con dulce trino. El viento susurra entre las hojas, las abejas zumban entre las flores. La naturaleza es un regalo divino, un lugar de paz y armonía.Conclusión:Google Gemini y JavaScript son una combinación poderosa que te permite desbloquear tu creatividad y desarrollar aplicaciones increíbles. Con esta guía práctica, ya estás listo para empezar a explorar las posibilidades infinitas de esta tecnología.Recursos adicionales:Documentación de Google Gemini: https://ai.google.dev/docsTutoriales de Google Gemini: https://m.youtube.com/watch?v=TXvbT8ORI50Ejemplos de código de Google Gemini: https://m.youtube.com/watch?v=jTdouaDuUOA¡Anímate a experimentar con Google Gemini y JavaScript! Comparte tus creaciones en los comentarios y déjame saber qué te parece esta herramienta.¡Espero que esto haya sido útil y/o te haya hecho aprender algo nuevo!Profile@khriztianmoreno �