How to Use ChatGPT as an Educational Chatbot in a Next.js Frontend

This page summarizes the projects mentioned and recommended in the original post on dev.to
Web Frameworks Miscellaneous Testing Frameworks API Runner

SurveyJS
Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
Our great sponsors

  • chatgpt-api

    Node.js client for the official ChatGPT API. 🔥

    • âš  DISCLAIMER : All code for interacting with ChatGPT in this tutorial is confirmed working as of December 19th, 2022 (‘chatgpt’=’3.3.1'). However, OpenAI’s ChatGPT, and the chatgpt library by Travis Fischer, are constantly changing, and breaking changes will be inevitable. Please check here if you find the code no longer works.

  • Express

    Fast, unopinionated, minimalist web framework for node.

    • We’re using Express for the API, dotenv for environment variables, and an unofficial ChatGPT API (until OpenAPI releases the official public API).

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo

  • dotenv

    Loads environment variables from .env for nodejs projects.

    • We’re using Express for the API, dotenv for environment variables, and an unofficial ChatGPT API (until OpenAPI releases the official public API).

  • wundergraph

    WunderGraph is a Backend for Frontend Framework to optimize frontend, fullstack and backend developer workflows through API Composition.

    • A backend-for-frontend (BFF) using WunderGraph, a free and open source dev tool that uses GraphQL at build time only, serving data via secure JSON-over-RPC. The WunderGraph server will be a service layer, or API gateway, whatever you wish to call it, that serves as the only ‘backend’ that your frontend can see.

  • puppeteer

    Node.js API for Chrome

    • OpenAPI has added CloudFlare protection to ChatGPT recently, making it harder to use the unofficial API. This library (optionally) uses puppeteer under the hood to automate bypassing these protections — all you have to do is provide your OpenAI email and password in an .env file.

  • chatgpt-raycast

    Discontinued ChatGPT raycast extension

    • However, we have reached a point where we can teach machines to learn, and generate text and images based on what they learn. Memorizing statistical patterns isn’t intelligence, of course, but with the advent of Large Language Models (LLMs) — like BERT, OpenAI’s GPT-3 and the new ChatGPT — that approach near-human levels of understanding of the concept of language, we can even use AI to aid human accessibility!

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts