This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev

Open http://localhost:3000 with your browser to see the result.

ChatGPT completions endpoint

Generate a cover letter from job description and resume

The goal is reach OpenAI chat completion endpoint to generate a cover letter
based on a job description(random, copy/paste) and a text-only version of a resume

For that it's required an API key and will be saved as env var at .env.local file at root

at env.local:

OPENAI_API_KEY=api-key-from-openai
OPENAI_ORGANIZATION_ID=openai-org-id

We're using Next.js App Router, so the starting point '/' segment only shows some icons to current
and future utilities.

Cover letter: at cover-letter segment we have;

1. A server component that only sets metadata(title)
2. Render a client component that takes text for
   fields resume,jobdescription,prompt; have as utility a defaults for resume and prompt.
   custom hooks for keeping those text inputs at localstorage
3. When clicks the Generate your cover letter button, the triggerCompletions function is invocated
4. and the async function triggerCompletions from custom hook useChatGPTCompletions is invoked
5. Route handler at src/app/api/chatgpt-completions/route.ts is called and passed the prompt text as POST body
6. This route handler is configured as Edge Function () see: Edge Runtime it's great because
   it starts with almost zero cold start and is capable to response with streams
   at the client the "streams chunks" are added to component state and it visualy looks like chatgpt text response.

Cover Letter Page diagram

Screencast

video: screencast