This is a submission for the Nylas Challenge: AI Expedition.
What I Built and Why
I built a simplified email inbox which uses OpenAI's GPT-4o mini model to generate email drafts and determine whether or not a reply should be sent.
The email draft generation takes an email thread from Nylas, and converts into a series of messages before submitting it to OpenAI's chat completion endpoint. The chat completion then returns a draft email body.
For no-reply classification, the latest, inbound email is retrieved from the thread. The email is then submitted to the OpenAI chat completions endpoint for classification. The endpoint returns a JSON response with a boolean indicating whether or not a reply should be sent, and an explanation as to why the user may not want to send a reply.
I built this app because email draft generation seemed like a very straightforward way to combine generative AI with the Nylas APIs. Additionally, the ability to detect no-reply emails seemed useful as it could help prevent emails being sent by mistake.
Demo
Code
h93xV2
/
email-buddy
Intelligent email assistant web app.
This is a Next.js project bootstrapped with
create-next-app.
It was built for the Nylas AI and Communications Challenge. The app offers a simplified email inbox with some LLM powered features. You can read about the app in the submission post.
Getting Started
Environment Variables
First, create a .env file with the following environment variables:
NYLAS_CLIENT_IDNYLAS_API_KEYNYLAS_API_URINYLAS_TEST_GRANTNYLAS_REDIRECT_URIOPENAI_API_KEY
Starting the App
Next, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
Open http://localhost:3000 with your browser to see the result.
Learn More
This app was built with NextJS, Bulma, TanStack Query, Nylas, and OpenAI. To learn more about these technologies, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
- OpenAI developer platform
- Nylas developers
- Bulma CSS framework
- TanStack Query docs
Your Journey
For this app, I mostly used the Nylas Email APIs, but I also used the Authentication API to exchange a token for a grant. The token exchange is used to simulate a login/logout flow.
From the Email APIs, I made use of:
- Thread retrieval.
- Folder retrieval.
- Message retrieval.
- Message sending.
- Updating threads.
- Draft creation.
From this project, I learned a few things:
- Nylas makes working with emails really simple.
- Integrating Nylas with OpenAI was also really simple.
- Defining an MVP for an app is easy, but building it might not be. Designing and building a UI can often be the most time consuming part of a project.
As far as the third bullet point goes, I am a backend software engineer for my day job. The hardest part of this project, for me, was developing all the frontend components. For example, I had to bring in TanStack Query to share state across components. Before this project, I had no experience with TanStack Query. So picking this up on the fly did add a layer of stress, but was ultimately worthwhile. For future contests/hackathons, I think I will have to spend more time simplifying an idea before iterating on it.
What I'm most proud of is just getting this project to a stopping point 😅. While working on it, I found that email inboxes can be a real rabbit hole where the complexity can quickly get out of control for one person.