Mi viaje de 4 semanas: De las mejoras de frontend a las dificultades con Docker y los avances

Actualización (2026): El frontend de WordPress y el despliegue con Docker descritos a continuación son historia antigua. El sitio ahora funciona con Next.js, y Sydney ha sido reconstruido desde cero con Supabase pgvector y Claude. Seguimos programando, seguimos aprendiendo.

Habla con Sydney →

---

La publicación original de marzo de 2024 se conserva a continuación para contexto.

No he publicado ninguna entrada durante las últimas 4 semanas. Puede que te estés preguntando qué pasó. ¿Me puse vago y dejé de aprender? Bueno, más o menos, sí fui de viaje con mi familia y otros amigos un fin de semana.

La publicación de hoy va a ser breve. Compartiré lo que he aprendido durante las últimas 4 semanas. Pero, ¿a quién le importa? Bueno, es cierto que a nadie le importará, así que esta publicación es principalmente para que yo lleve un registro de mi progreso y supongo que para una persona más (quienquiera que seas :D.)

TL;DR: El "aprendizaje justo a tiempo" es real y lo estoy viviendo.

Frontend mejorado

Si visitaste mi sitio hace unos meses, notarás que ahora se ve diferente, más moderno y más fácil de navegar (espero). Usé Github Copilot y ChatGPT4 para pedirle a la máquina que ayudara a mejorar el aspecto del sitio. El resultado fue más de 300 líneas de código CSS, la mayoría de las cuales no sé cómo escribir. Aquí hay un adelanto:

/* Defining CSS variables for common values */
:root \{
    --main-font: 'Poppins', sans-serif; /* Main font for the website */
    --primary-color: #003366; /* Primary color for text */
    --accent-color: #4da6ff; /* Accent color for links and buttons */
    --background-color: #FAFAFA; /* Background color for the body and some elements */
    --text-color: #333333; /* Main text color */
    --hover-color: #4da6ff; /* Color for hover effects */
\}

/* Applying the main font and color to various elements */
body, button, input, select, textarea, h1, h2, h3, h4, h5, h6, .nav-menu, .nav-menu a, .widget-title, .page-numbers.current,
#primary-menu .menu-item a, #primary-menu .sub-menu .menu-item a, .site-title a, .primary-navigation a, .widgettitle, .simpletoc-title \{
    font-family: var(--main-font);
    color: var(--text-color);
\}

Además, cuando visito la página del chatbot, el "aspecto" es similar al del resto del sitio. El "cuadro" para ingresar tu pregunta está justo arriba, por encima del pliegue, y el cuadro de conversación sigue expandiéndose a medida que la conversación se expande. No puedo creer que no lo hubiera terminado antes. Y lo siento mucho por todos los que visitaron esa página antes.

Sydney el chatbot tiene un nuevo vector store y una traducción de consultas mejorada

Todo el proceso de exportar el contenido publicado de WordPress a HTML, limpiar el HTML, hacer chunking, generar embeddings y almacenarlos en un vector store es sorprendentemente fácil y rápido una vez que lo has hecho unas cuantas veces.

Cambié por un nuevo vector store (seguía usando FAISS), con una metodología de chunking diferente (esta vez con un tamaño de chunk ligeramente mayor y superposición).

La consulta del usuario se transforma usando el retriever de múltiples consultas de LangChain. He encontrado que las respuestas del chatbot usando este retriever son más completas y matizadas que las del retriever anterior.

# Set up vector store and llm
embeddings = OpenAIEmbeddings()
vectorstore = FAISS.load_local("faiss_index", embeddings)
llm = ChatOpenAI(model_name="gpt-3.5-turbo-0125", temperature=0)

# Set up retriever
retriever_from_llm = MultiQueryRetriever.from_llm(
    retriever=vectorstore.as_retriever(), llm=llm
)

La dificultad con Docker Image y GCP Artifact resultó ser una bendición

Por alguna extraña razón, empecé a tener problemas con la subida de Docker Image a GCP Artifact hace aproximadamente 1 mes. Intenté muchas maneras de resolverlo pero no pude. Los meses hasta ese punto habían sido completamente normales.

Debido a eso, me vi obligado a pensar en otra forma de desplegar la aplicación, una que no implicara subir la imagen a Artifact. Así fue como me topé con el despliegue continuo en GCP Cloud Run usando el repositorio en Github.

De alguna manera, al mismo tiempo, vi un tutorial en línea y usaban poetry. No tenía idea de qué era, así que le pedí a chatGPT que me lo explicara. Resultó ser una gran herramienta para gestionar dependencias, así que ahora la estoy usando :). Gracias a esta exploración, también aprendí más sobre cómo configurar un entorno virtual para cada proyecto, y comencé a usarlo para cada proyecto.

Así que ahora, con la configuración de un nuevo entorno virtual, el uso de poetry para gestionar dependencias y el aprovechamiento del despliegue continuo desde GCP Cloud Run, mi flujo de trabajo es mucho más fluido. Desplegar una nueva actualización al chatbot también es mucho más fácil y rápido, una vez que lo pruebo exhaustivamente localmente.

¿En qué estoy trabajando ahora?

En este momento, estoy trabajando en construir y desplegar un asistente de investigación usando LangChain. El código open-source de LangChain y GPT-Researcher (¡gracias a ambos!) es suficientemente claro y puedo hacerlo funcionar localmente. Sin embargo, desplegarlo para que funcione en un entorno de producción resulta bastante difícil, especialmente la parte del scraping de contenido. Específicamente, el uso de CPU es demasiado alto cuando pruebo la aplicación en Docker Container localmente.

También tengo algunas ideas sobre cómo mejorar el enfoque del asistente de investigación compartido por GPT-researcher y LangChain, pero necesito trabajar en ellas para hacerlas realidad. Compartiré más cuando estén listas.

¿Qué piensas tú?

Cada línea de código, cada hora de resolución de problemas y cada avance han sido un peldaño. Y aunque este viaje es mío, espero que encienda ideas, ofrezca perspectivas, o simplemente entretenga. ¿Qué desafíos has enfrentado en tus proyectos tecnológicos? Deja tus historias o preguntas abajo — naveguemos estas aguas digitales juntos.

Un abrazo,

Chandler

P.D.: Si estás construyendo una aplicación RAG, encuentro la serie "RAG from scratch" de LangChain muy útil.