How jayagajjar/my_nextjs_app works
This is a small Next.js demo app whose active workflow is an emotion-styled ChatGPT prompt: a user submits a question, the home page sends it to an API route, and the returned answer is displayed. The API route makes the OpenAI request. Other components in the tree are demo or navigation examples; sampled code shows them commented out on the home page, so they are not presented as active workflow stages.
Main entry points: page.tsx Home page · route.tsx Chat API route · PromptForm.tsx Prompt form · layout.tsx Root layout
Components 6
Web interface
- Root layout
app/layout.tsx - Home page
app/page.tsx - Prompt form
app/components/PromptForm.tsx
AI request
- Chat API route
app/api/chat-gpt/route.tsx
Other components
- User
- OpenAI API
Connections 9
- User → Home page: opens
- Root layout → Home page: renders
- Home page → Prompt form: renders
- Prompt form → Home page: submits prompt
- Home page → Chat API route: POSTs prompt
- Chat API route → OpenAI API: requests completion
- OpenAI API → Chat API route: returns completion
- Chat API route → Home page: returns JSON
- Home page → User: displays answer