ai_gallery: an AI-assisted gallery of interactive demos
Some interesting AI-generated showcase pages
At a glance
- What is it?
- ai_gallery is a collection of interactive algorithm and game demonstrations, pathfinding visualisations, Gomoku, Tetris, 2048 and live charts, built with React and Next.js by a developer who describes themselves as having minimal front end knowledge and leaning on AI assistants. The judgement is that the interesting part is the honesty in the readme about where the models helped and where they did not, and that the licence is unknown, which is a real problem for reuse.
- Who is it for?
- ai_gallery fits a developer who wants working visualisations of classic algorithms and games to read, copy or extend, because each component is a self contained demonstration in a React and Next.js project with a live deployed version to try.
- Can I use it commercially?
- Not without permission. GitHub finds no licence file in the repository, and without a licence all rights are reserved by default: you may read the code but not reuse it. Check the README, or ask the authors, before using it.
- Is it still maintained?
- Yes. The repository last received commits 16 days ago.
- What is it written in?
- Mainly JavaScript, according to GitHub's language statistics.
Answers come from the project's GitHub data, last synced on October 23, 2026, and from our analysis. They are not legal advice.
Editorial analysis
A gallery of what one person built with assistants
ai_gallery is described in the repository description as some interesting AI-generated demo pages, and the readme opens by explaining the project from the author's point of view rather than the project's.
The framing is that this is an AI-assisted web development project by someone with minimal front end knowledge, a bit of HTML and CSS, who has managed to create the components with the help of Claude 3.5 and GPT-4, and who more recently added GPT-5.2 and GPT-5.3 to the daily workflow. The components have been integrated into a gallery site at gallery.selfboot.cn, and the repository carries a Chinese version of the readme as well as the English one.
What is in the gallery falls into three groups. The algorithms section holds interactive visualisations of classic algorithms, with BFS pathfinding, A* search, Dijkstra's algorithm and heap operations. The games section implements Gomoku, known as five in a row, Chinese chess, Tetris and 2048. The remaining section is a collection of other widgets, including dynamic charts for data visualisation.
The project is built with React and Next.js for static site generation and is deployed on Netlify, with automatic sitemap generation, Google Analytics integration and internationalisation support. The repository is a private package named ai_gallery_next at version 0.1.0, and the last push was on 2026-10-08, with no GitHub releases.
One fact should be stated up front because it affects everything else: the licence field records the licence as unknown.
One codebase, two deployment targets
The scripts in the package manifest show something that is easy to miss, which is that this project has two deployment targets and a generation step in front of both.
The dev script runs three generator scripts and then starts the development server. The build script runs the same three generators, then the Next.js build, and then deletes every source map from the .next directory. The three generators are generate-md-modules.js, generate-i18n-scopes.mjs and generate-sitemap-rss.mjs, and their names describe the job: the markdown modules are generated from the content, the internationalisation scopes are generated, and the sitemap and the RSS feed are generated.
So the content, the translation scopes and the search engine feeds are all derived files that are produced at build time rather than checked in and maintained by hand. The start script runs the built application, and the lint script uses the Next.js lint command.
Then there is the second target. Three scripts are named for the worker: build:worker, preview:worker and cf-deploy. They all call the OpenNext Cloudflare adapter, which builds the Next.js application for Cloudflare Workers, and the build script then populates a local cache for the preview. The cf-deploy script deploys it.
The repository carries the configuration for all of it: netlify.toml for the Netlify deployment, open-next.config.ts for the Cloudflare adapter, wrangler.jsonc for the worker, next.config.js for the framework, and tailwind.config.js and postcss.config.mjs for the styling.
The dependency list explains what the demos are drawn with
The dependencies in the package manifest are a catalogue of the techniques used in the gallery, and several of them are unusual choices.
The 3D stack is the React Three Fiber ecosystem, with @react-three/fiber and @react-three/drei, alongside @react-spring/web for animation, which is the combination that makes the pathfinding visualisations possible.
The charting is ECharts, with the React wrapper echarts-for-react, and there is a Cube.js dependency as well, which points to the data visualisation side of the gallery being more than a set of hand drawn widgets. Headless UI provides the accessible component primitives, and Font Awesome supplies the icon set.
Then there are the tools that show the project is a general purpose playground rather than a set of demos. exceljs for spreadsheets, docxtemplater for document templating, @pdfsmaller/pdf-encrypt-lite for PDF encryption, @imgly/background-removal for image background removal, the jsquash packages for AVIF and WebP encoding, and exifr for reading image metadata.
There are also a few that suggest the gallery is used as a scratchpad for utility work. dompurify for sanitising HTML, diff for comparing text, crypto for hashing, clsx for conditional class names, giscus for the comment widget, and cookies-next.
The styling is Tailwind, with the typography plugin, and the internationalisation is handled by a generated scope file rather than by a library, which suggests a lightweight custom solution.
Local development is five commands and a browser
The readme invites contributions and makes the pitch explicitly, telling contributors not to worry if they lack a front end technical background, because they can use AI to bring their ideas to life.
The prerequisites are Node.js 22 or newer and pnpm 9 or newer, which the package manifest confirms with the engines field, and the steps are five:
git clone [email protected]:selfboot/ai_gallery.git
cd ai_gallery
pnpm install
pnpm devThe development server then serves the site on port 3000. The readme's advice for anyone who hits a problem is to try using AI to solve it, which is a statement of the project's premise as much as a piece of advice.
The testing side is conventional. The test script runs Jest with coverage and the forceExit flag, and there is a watch variant, with a jest.config.js and a jest.setup.js in the repository. The coverage badge at the top of the readme points at a Codecov report for the project, so the coverage numbers are published rather than only run locally.
There is a .nvmrc file, which pins the Node version for anyone using a version manager, and a .cursor directory and an AGENTS.md file, which is the newer convention for giving an AI coding assistant the context of the repository.
The readme is unusually candid about the limits of the tools
The second half of the readme is a reflection on the use of AI in the project, and it is the most interesting part of the document.
The positive side is stated in the author's own terms. The project was a learning opportunity, because the assistance helped the author understand React, JavaScript and modern web development practice quickly, and the goal was practical front end knowledge rather than a finished product. The author also credits the models as virtual mentors and pair programming partners, saying they helped grasp React concepts, implement complex logic, create the interfaces and understand the underlying principles, and introduced best practices, design patterns and optimisation techniques.
Then the limitations, and they are specific. AI still has hallucinations and limitations in reasoning, sometimes the generated code contains bugs or does not fully meet the requirements, and sometimes the explanations are not clear enough. In those situations you have to debug and solve the problems yourself. The project section on problem solving says the same thing more compactly, that there were still issues requiring human intervention to resolve.
There is also a personal comparison of the two models, marked as opinion, with GPT-4 praised for detailed explanations and complex multi-step tasks when given detailed prompts, and Claude 3.5 praised for code generation and refactoring, where a simple requirement description often produces a good prototype quickly.
The current setup section lists the newer tools the author uses day to day: the newest GPT models for deeper reasoning and architecture discussions, the Codex command line tool for a terminal first workflow over repository edits and refactors, the Claude Code command line tool as a second coding partner for comparing implementations, and Cursor for interactive editing in the editor.
An unknown licence is the real limitation here
The licence field on the repository says the licence is unknown, and that is the fact that most affects anyone who finds this project useful.
Everything else in the readme is reproducible. The stack is documented, the build commands are given, the deployment targets are named, and the demonstrations are visible in a live site. But without a licence, the default position in most jurisdictions is that the author retains copyright and nobody else may copy, modify or redistribute the code. A visualisation you want to reuse in your own site, a chart helper you want to lift into another project, none of that is available in law, however open the repository appears on the hosting platform.
The readme does invite contributions, with the contributing steps and the local setup, and the repository carries a CODE_OF_CONDUCT-equivalent absence but does have an AGENTS.md file and a .cursor directory for assistant configuration. The invitation to contribute is clearly an invitation to contribute to the project, which is a different thing from a grant to reuse the code elsewhere.
The rest of the state is straightforward. The package is private, at version 0.1.0, with no published releases, and the project is deployed to Netlify with a Cloudflare worker path maintained alongside it. The gallery is described as something the author plans to keep extending with AI assistance, so the collection of components is a growing thing rather than a finished one.
Editorial conclusion
ai_gallery fits a developer who wants working visualisations of classic algorithms and games to read, copy or extend, because each component is a self contained demonstration in a React and Next.js project with a live deployed version to try. It is the wrong choice for anything you intend to ship, because the licence is listed as unknown, which means there is no grant to build on, and it is the wrong choice if you need a maintained library, since this is a gallery of demos rather than a package. Before you copy any of the code, settle the licensing question with the author, and if you want to contribute, follow the documented local setup of Node 22 and pnpm 9 and the five commands, because the generators that run before every build are what produce the markdown modules and the sitemap.
Frequently asked questions
What is ai_gallery?
It is a gallery of interactive components built with React and Next.js for static site generation, including visualisations of BFS pathfinding, A* search, Dijkstra's algorithm and heap operations, games such as Gomoku, Chinese chess, Tetris and 2048, and dynamic charts. A live version is deployed at gallery.selfboot.cn.
How do I run ai_gallery locally?
You need Node.js 22 or newer and pnpm 9 or newer. Then clone the repository, change into the directory, run pnpm install and pnpm dev, and open http://localhost:3000. The dev script also runs three generators first, for the markdown modules, the i18n scopes and the sitemap and RSS feed.
Which AI tools does the author use for this project?
The readme names Claude 3.5 and GPT-4 for the original work, GPT-5.2 and GPT-5.3 for deeper reasoning and architecture discussions, the Codex command line tool for terminal first editing, the Claude Code command line tool for comparing implementations, and Cursor for interactive editing in the editor.
Can I reuse the code in my own project?
Not without asking. The repository records the licence as unknown, and there is no grant in the readme that permits copying or redistribution, even though the project invites contributions. The author is explicit in the readme that the assistants sometimes produced code with bugs or short of the requirements, which is a further reason to read the code rather than assume it is correct.
Official sources
Add this badge to your README
If you maintain this project, the badge below links readers to this analysis and shows its maintenance status from the daily GitHub snapshot. Paste the markdown into your README; add ?metric=license or ?metric=stars to the image URL for a different field.
[](https://hysenlabs.com/projects/selfboot-ai-gallery)Was this useful?