Pure HTML/JS implement of this tool

ChrisTorng commented 2 months ago

I convert this tool by the help of Claude 3.5 Sonnet, with only one prompt. From Python to pure html/css/js, for easy using.

Then I added auto focus, auto Format code/Process Changes after pasting, and auto clear. Fit whole page without scroll bar. Make the whole process even easier.

It's on ChrisTorng/LLMCoder. Just clone this repo, and open the index.html file from your browser, you don't need Python or any installation.

Or you can open my page online: LLM Coder. It runs purely on your browser, no data is sent to any server.

ChrisTorng commented 1 month ago

ChrisTorng\LLMCoder is now converted into Markdown based, this approach:

Saves tokens compared to JSON
Avoids escape character problems (e.g., forgetting to use \" in JSON)
Improves readability of diff output
Enhances manual correction capabilities

Additional

Utilize Claude Artifact
Multiple files (conversion not supported yet) with timestamp
Syntax highlighting

Read the markdown.instruction.en.md to understand the detail of Markdown diff.

Markdown diff sample

file1.css 2024-08-14 08:20:42

InsertBetween
From: 13. h1 {
To: 14. }
color: var(--primary-color);
font-size: 1.5rem;
Remove

From: 26. display: flex;

To: 26. display: flex;

file2.js 2024-08-15 18:04:05

Replace
From: 12. function old_function() {
To: 14. return value;
function new_function() {
  var result = 'New function'

  return result;

hannesrudolph commented 1 month ago

I’ve sent you a DM on Facebook to discuss privately.

hannesrudolph / llm-code-helper

Pure HTML/JS implement of this tool #2

Markdown diff sample

file1.css 2024-08-14 08:20:42

file2.js 2024-08-15 18:04:05