DLightHouse

Introduction Why Structured Output? Notes & Code Walkthrough Conclusion Introduction When building applications that interact with Large Language Models (LLMs), you often need more than just a plain text response. Structured outputs, such as JSON, make it much easier to integrate your AI-powered app with external systems or display specific data on the frontend. In this post, we'll explore how to achieve that using LangChain. We'll also walk through some personal notes on how we've set up our React components, and finally we'll dive into our code to see it all in action. Why Structured Output? If you've ever tried to build an API around an LLM, you may have run into a significant challenge: the LL...

This post shows how to create a simple React application that communicates with an LLM using LangChain. It includes steps for installing dependencies, building a prompt, integrating with OpenAI’s GPT-3.5-turbo, and extracting country, state, and ZIP code information. Project Setup Dependencies llm.js AddressInformationExtractor.jsx App.jsx Running the App Project Setup Unix-like Shells pnpm create vite my-llm-app --template react Mac pnpm create vite my-llm-app --template react Windows Command Prompt (cmd) ...

If you want to use pnpm instead of npm on your AEM application for better performance or additional features, here's a comprehensive guide on how to make the switch. In this post, you will learn how to: Create AEM App Modify root's pom.xml Select pnpm's Version Modify ui.frontend's pom.xml Build the project Hi there, I'm Manuel Gutierrez from dlighthouse.co, and in this quick tips series, I will share snackable videos focusing on just one feature or problem. Let's start by creating a new app using Adobe's archetype. Make sure you define the appTitle, appId, and groupId: Unix-like Shells mv...

If you want to use Yarn instead of npm on your AEM application for better performance or additional features, here I will guide you through the process. On this post you will: Create AEM App Modify root's pom.xml Select Yarn's Version Modify ui.frontend's pom.xml Build the project Generate the yarn.lock file First, let’s create a new app if you don't have one already using Adobe's archetype. Make sure you define the appTitle, appId, and groupId: Unix-like Shells mvn -B org.apache.maven.plugins:maven-archetype-plugin:3.2.1:generate \ -D archetypeGroupId=com.adobe.aem \ -D archetypeArtifactId=aem-project-archetype \ -D ar...

Sometimes you may want to initialize an object by setting the property names dynamically using strings defined somewhere else. You can use the ES6’s Computed property names for this, in this quick tips episode, you will learn how. Above is the vid and below you will find some useful notes. 1. Pre-reqs Have a browser like Chrome, Edge or Firefox installed 2. Using Computed Property Names in Javascript Initialize and Object with a computed property name ...

blog-static-generator-new If you want to integrate your javascript or non-reactjs application with a reactjs app and be able to access reactjs components and call their methods to execute actions or get information out of them, in this quick tips episode, you will learn how. Above is the vid and below you will find some useful notes. 1. Pre-reqs Have node.js installed 2. Exposing React JS to Javascript or non-reactjs applications ...