Machen Sie einen Sinn für eine 10K+ Zeilen -Github -Repos, ohne den Code zu lesen

Bild von Autor | Leinwand

Das Navigieren und Verständnis großer Codebasen kann eine Herausforderung sein, insbesondere für neue Entwickler, die sich einem Projekt anschließen oder ältere Repositorys erneut besuchen. Traditionelle Methoden zum Verständnis von Codestrukturen beinhalten das Lesen zahlreicher Dateien und Dokumentationen, die zeitaufwändig und fehleranfällig sein können. Gitdiagram bietet eine Lösung, indem Github -Repositories in interaktive Diagramme umgewandelt werden und eine visuelle Darstellung der Codebasis -Architektur bereitgestellt werden. Dieses Device hilft beim Verständnis komplexer Systeme und zur Verbesserung der Zusammenarbeit zwischen Entwicklungsteams. In diesem Artikel werde ich Sie durch den Schritt-für-Schritt-Prozess der lokalen Verwendung von Gitdiagram führen. Additionally, ohne weiteres Warten, fangen wir an.

Schritt-für-Schritt-Anleitung zur Verwendung von Gitdiagram lokal

Schritt 1: Klonen Sie das Gitdiagram -Repository

git clone https://github.com/ahmedkhaleel2004/gitdiagram.git
cd gitdiagram

Schritt 2: Abhängigkeiten installieren

Dies holt und installiert Abhängigkeiten in node_modules.

Stellen Sie vor dem Ausführen von PNPM -Set up sicher, dass Sie über Node.js und PNPM international installiert sind.

• So laden Sie es von node.js ein, laden Sie es von herunter nodejs.org
• Führen Sie den folgenden Befehl aus, um PNPM zu installieren:

Schritt 3: Umgebungsvariablen einrichten

Bearbeiten die .Env -Datei Um Ihren OpenAI / Anthropic / OpenRouter -API -Schlüssel und non-compulsory Ihr GitHub Private Entry Token einzuschließen.

Schritt 4: Backend -Dienste starten

docker-compose up --build -d

Der Fastapi -Server ist bei verfügbar LOCALHOST: 8000. Sie sehen die folgende Nachricht auf der Serverseite.

{"message":"Howdy from GitDiagram API!"}

Schritt 5: Initialisieren Sie die Datenbank

Führen Sie die folgenden Befehle aus, um die Datenbank einzurichten:

chmod +x start-database.sh
./start-database.sh
pnpm db:push

Wenn Sie aufgefordert werden, ein zufälliges Passwort zu generieren, geben Sie Ja ein. Die Postgres -Datenbank beginnt in einem Container bei Localhost: 5432.
Notiz: Als ich versuchte, diesen Befehl auszuführen, bekam ich diesen Fehler:

sh: drizzle-kit: command not discovered
 ELIFECYCLE  Command failed.
 WARN   Native bundle.json exists, however node_modules lacking, did you imply to put in?

Es stellte sich heraus, dass ich Nrizzle-Equipment nicht installiert hatte. Wenn Sie dies additionally sehen, rennen Sie einfach:

Danach funktionierte PNPM DB: Push intestine und gab mir diese Ausgabe:

No config path offered, utilizing default 'drizzle.config.ts'
Studying config file '/Customers/kanwal/Desktop/gitdiagram/drizzle.config.ts'
Utilizing 'postgres' driver for database querying
(✓) Pulling schema from database...
(✓) Adjustments utilized

Schritt 6: Führen Sie den Frontend aus

Sie können jetzt auf die Web site zugreifen unter LOCALHOST: 3000 und bearbeiten Sie die in Backend/App/Router/generate.py definierten Ratenlimits im Erzeugungsfunktionsdekorator. Versuchen wir, das Github -Repo der Fastapi -Bibliothek zu visualisieren.

Frontend -Schnittstelle:

Ausgabe:

Schließe Gedanken

Dies ist eine großartige Idee und ein wirklich nützliches Repository. Ich persönlich hatte das Bedürfnis nach so etwas in meinen eigenen Projekten, daher schätze ich die Anstrengung und Imaginative and prescient dahinter.

Das heißt, ein unvoreingenommener Meinung zu bieten – es gibt definitiv Raum für Verbesserungen.

Ein wiederkehrendes Downside, auf das ich stieß, conflict:

Syntax error in textual content mermaid model 11.4.

Nach Angaben des Projektbesitzers Ahmedkhaleel2004Dieser Fehler bedeutet normalerweise, dass die LLM ungültige mermaid.js syntax erzeugt hat.

Ich habe versucht, dieses Downside auf zahlreiche Arten anzugehen, aber letztendlich finde ich, dass es keine zuverlässige Lösung gibt – es ist meistens eine Einschränkung der LLM. Wenn es eine Möglichkeit gäbe, mermaid.js -Code zu validieren, würde das helfen, aber ab sofort bin ich mir nicht sicher, wie.

Er stellte auch fest, dass die aktuelle Eingabeaufforderung (in `prompts.py`, insbesondere die dritte, die Meerjungfrau -Code generiert) bereits versucht, die korrekte Syntax durchzusetzen – aber es ist nicht narrensicher, und es treten immer noch neue Syntaxprobleme auf.

✅ Eine Lösung, die ich on-line gefunden habe, die funktioniert hat
Während ich die Github -Probleme durchgab, stieß ich auf eine von einem andere Benutzer geteilte Problemumgehung, die tatsächlich für mich funktioniert hat:

Fügen Sie dies dem Anpassungsdiagramm hinzu: Ignorieren Sie das Syntax -Downside aus der Meerjungfrauversion 11.4.1 und regenerieren Sie den Relaxation des Diagramms.

Die Verwendung dieser Zeile half dabei, den Fehler zu umgehen. Obwohl einige Komponenten noch fehlen, erzeugte es zumindest ein Teildiagramm-genug, um ein hohes Verständnis der Codebasis zu vermitteln.

Kanwal Mehreen Kanwal ist ein Ingenieur für maschinelles Lernen und technischer Schriftsteller mit einer tiefgreifenden Leidenschaft für die Datenwissenschaft und die Schnittstelle von KI mit Medizin. Sie hat das eBook „Produktivität mit Chatgpt maximieren“. Als Google -Era -Gelehrte 2022 für APAC setzt sie sich für Vielfalt und akademische Exzellenz ein. Sie wird auch als Teradata -Vielfalt in Tech Scholar, MITACS Globalink Analysis Scholar und Harvard Wecode Scholar anerkannt. Kanwal ist ein leidenschaftlicher Verfechter der Veränderung, nachdem er Femcodes gegründet hat, um Frauen in STEM -Bereichen zu stärken.