Hacker News Agent with Render and Inngest

Render docs  ·  Inngest Agent Kit docs

Learn how to build and deploy a Hacker News agent with Inngest, Render, and Next.js.

What the agent does

This Hacker News Agent periodically generates a summary of popular articles on Hacker News, and emails you a report.

To use it, you:

• Specify questions you want answered about specific topics.

  For example, you can specify "Next.js" as a topic, and ask "What are the latest open source libraries?"

• Specify the frequency at which you want summaries for each question. (E.g. every hour, once a day, once a week)

The Agent will do the rest.

Table of contents

• Project structure
• Prerequisites
• Deploy this project on Render
• Modify or run the project locally

Project structure

• packages/indexer: A cron job that indexes Hacker News content into a vector database.

  This job is deployed using a Render Cron Job, and the vector database is a Render PostgreSQL database that has the pgvector extension enabled.

• packages/app: A web app that includes the UI to configure topics and questions for the Hacker News agent, and the backend logic for the agents.

  This app is written in Next.js and hosted as a web service on Render. The app uses Inngest's AgentKit to create and orchestrate agents. To use Inngest's terminology, we'll refer to the combination of routing logic, agents, and tools as the AgentKit Network.

Prerequisites

Accounts

To run this project, you need the following accounts:

• Render account: host and scale web applications
• Inngest account: workflow and agent orchestration
• OpenAI account: API for LLM
• Resend account: API to send email

Github code

Before you get started, git clone this repo to your local machine.

Deploy this project on Render

1. Set up the PostgreSQL vector database

What it's for

The PostgreSQL database is used to store Hacker News stories. It serves as the vector database for the AgentKit Network.

Steps

To set up this database, you'll create a new PostgreSQL database on Render, enable the pgvector extension on the database, and initialize it with our project's schema.

Follow these steps:

1. Create a Project on Render. Name it "Hacker News Agent".

2. Create a new PostgreSQL database on Render.

   • For the "Project", specify the project you created in Step 1.
   • For the "Instance Type", you may use the Free plan.

3. Enable the pgvector extension and initialize the database with the project's schema.

   • 3.1. Locate the schema.sql file in this repo. (This file contains the commands to enable the pgvector extension and set up this project's schema.)

   • 3.2. Copy your database's external database URL from the Render dashboard.

   • 3.3. Run the following command in your terminal from the root of the project, but replace the dummy PostgreSQL URL with your URL from Step 3.2:

     psql -Atx postgresql://<redacted>@<redacted>.render.com/<redacted> -f packages/indexer/schema.sql

2. Set up the Indexer service Cron Job

What it's for

The Indexer service is used to fetch Hacker News stories and to store them in the PostgreSQL vector database.

Steps

The packages/indexer directory contains a indexer.ts file that will index Hacker News content into the PostgreSQL vector database.

To set up the Indexer service Cron Job, you need to create a new Cron Job on Render using a Docker image set up with playwright and its chromium binary.

The docker.io/wittydeveloper/inngest-render-indexer:0.4 image is available publicly on Docker Hub for this project:

1. Create a new Cron Job on Render using the "Existing image" option by pasting the image URL docker.io/wittydeveloper/inngest-render-indexer:0.4 in the "Image URL " field.
2. Configure the Schedule to run on a daily basis: 0 0 \* \* \*.
3. Configure the following environment variables:
   • DATABASE_URL: The URL of your PostgreSQL vector database (from the Connect button on the PostgreSQL database dashboard).
   • OPENAI_API_KEY: Your OpenAI API Key.

You are good to go!

3. Set up the Next.js app and AgentKit Network

What it's for

The Next.js app and AgentKit Network is used to serve as the frontend to configure the Hacker News agent and as backend to run the AgentKit Network.

Steps

The packages/app directory contains a Next.js application that will serve as the frontend for the Hacker News agent.

To set up the Next.js app and AgentKit Network, you need to create a new Web Service on Render and configure it to run the Next.js application.

1. Create a new Web Service on Render using the "Public Github repository" option by pasting the repository URL https://github.com/wittydeveloper/inngest-render-hacker-news-agent in the "Repository URL" field.

2. Configure the Root Directory to packages/app/.

3. Configure the Build Command to pnpm install; pnpm build.

4. Configure the following environment variables:

   • DATABASE_URL: The URL of your PostgreSQL vector database (from the Connect button on the PostgreSQL database dashboard).
   • INNGEST_EVENT_KEY: The Event Key of your Inngest project.
   • INNGEST_SIGNING_KEY: The Signing Key of your Inngest project.
   • OPENAI_API_KEY: Your OpenAI API Key.
   • RESEND_API_KEY: Your Resend API Key.
   • APP_PASSWORD: The password to access the app.

You are good to go!

4. Try it out!

To try it out, go to your Render Web Service dashboard and copy the URL of your web service (ex: https://agenkit-render-tutorial.onrender.com).

The following page should be displayed:

Modify or run the project locally

Install dependencies by running the following command from the root of the project:

pnpm install

Indexer (packages/indexer)

Run the indexer locally

Note: You'll need to set up the .env.local file.

pnpm build

pnpm start

Push a new Docker image version

Example:

docker build -t docker.io/wittydeveloper/inngest-render-indexer:0.5 .
docker push docker.io/wittydeveloper/inngest-render-indexer:0.5

Next.js app (packages/app)

Note: You'll need to set up the .env.local file. Don't forget to set the APP_PASSWORD password

Run the Next.js app locally

pnpm dev

Start the Inngest Dev Server

npx inngest-cli@latest dev