Markdown-Seite

Was ist Markdown?

Markdown ist eine schlanke Auszeichnungssprache, mit der du reine Textdokumente formatieren kannst.
Erstelle Dokumente für deine GitHub-Projekte, bearbeite dein GitHub-Profil, die README-Datei usw. Hier findest du alles dazu.

Lassen Sie uns loslegen. ⤵️

Inhaltsverzeichnis

  1. Absatz
  2. Überschriften
  3. Hervorhebung
  4. Blockzitat
  5. Bilder
  6. Links
  7. Code
  8. Listen
  9. Tabelle
  10. Aufgabenliste
  11. Fußnote
  12. Sprung zum Abschnitt
  13. Horizontale Linie
  14. HTML

Absatz

Wenn Sie normalen Text schreiben, verfassen Sie im Grunde einen Absatz.

Dies ist ein Absatz.

Dies ist ein Absatz.


Überschriften

Es gibt 6 Arten von Überschriften. Die Anzahl der „#“-Symbole, gefolgt von Text, gibt die Wichtigkeit der Überschrift an.

# Überschrift 1
## Überschrift 2
### Überschrift 3
#### Überschrift 4
##### Überschrift 5
###### Überschrift 6

Überschrift 1

Überschrift 2

Überschrift 3

Überschrift 4

Überschrift 5
Überschrift 6

Hervorhebungen

Das Bearbeiten von Text ist ganz einfach und übersichtlich. Du kannst deinen Text fett, kursiv oder durchgestrichen formatieren.

Mit zwei Sternchen **ist dieser Text fett**.
Zwei Unterstriche __funktionieren ebenfalls__.
Machen wir ihn jetzt *kursiv*.
Du hast es erraten: _ein Unterstrich reicht auch_.
Können wir **_beides_** kombinieren? Auf jeden Fall.
Was ist, wenn ich ~~durchstreichen~~ möchte?

Mit zwei Sternchen ist dieser Text fett.
Zwei Unterstriche funktionieren ebenfalls.
Machen wir ihn jetzt kursiv.
Du hast es erraten: Ein Unterstrich reicht ebenfalls aus.
Können wir beides kombinieren? Auf jeden Fall.
Was ist, wenn ich den Text durchstreichen möchte?


Blockzitat

Möchtest du die Wichtigkeit des Textes hervorheben? Mehr musst du nicht sagen.

> Dies ist ein Blockzitat.
> Möchtest du in einer neuen Zeile mit Abstand dazwischen schreiben?
>
> > Und verschachtelt? Kein Problem.
> >
> > > PS: Du kannst deinen Text **gestalten**, _wie du willst_.

Dies ist ein Blockzitat. Möchtest du in einer neuen Zeile mit Abstand dazwischen schreiben?

Und verschachtelt? Überhaupt kein Problem.

PS: Du kannst deinen Text nach Belieben gestalten. :


Bilder

Am besten ziehst du das Bild einfach direkt von deinem Computer per Drag & Drop hinein. Du kannst auch einen Verweis auf das Bild erstellen und es auf diese Weise zuweisen.
Hier ist die Syntax.

![Text, falls das Bild nicht geladen werden kann](automatisch-generierter-Pfad-zur-Datei-beim-Hochladen-des-Bildes "Text, der beim Darüberfahren mit der Maus angezeigt wird")

[Logo]: automatisch-generierter-Pfad-zur-Datei-beim-Hochladen-des-Bildes "Fahre mit der Maus darüber"
![Fehlertext][Logo]

Text, falls das Bild nicht geladen werden kann

Fehlertext


Ähnlich wie Bilder können auch Links direkt oder durch Erstellen eines Verweises eingefügt werden. Sie können sowohl Inline- als auch Block-Links erstellen.

[Markdown-Spickzettel]: https://github.com/im-luka/markdown-cheatsheet
[Dokumentation]: https://github.com/adam-p/markdown-here

[Gefällt es dir bisher? Folge mir auf GitHub](https://github.com/im-luka)
[Mein Markdown-Spickzettel – mit einem Stern markieren, wenn er dir gefällt][markdown-cheatsheet]
Tolle Dokumentationen findest du [hier][docs]

Gefällt es dir bisher? Folge mir auf GitHub
Mein Markdown-Spickzettel – mit einem Stern markieren, wenn er dir gefällt
Tolle Dokumentationen findest du [hier][docs]


Code

Du kannst sowohl Inline- als auch vollständige Block-Code-Schnipsel erstellen. Außerdem kannst du die in deinem Schnipsel verwendete Programmiersprache angeben. All das geschieht mithilfe von Backticks.

    Ich habe im Stammverzeichnis eine `.env`-Datei erstellt.
    Backticks innerhalb von Backticks? `` `Kein Problem.` ``

 ```
    {
 learning: "Markdown",
 showing: "Block-Code-Schnipsel"
    }
    ```

    ```js
    const x = "Block-Code-Schnipsel in JS";
    console.log(x);
    ```

Ich habe die Datei .env im Stammverzeichnis erstellt. Backticks innerhalb von Backticks? `Kein Problem.`

{
  learning: "Markdown",
  showing: "Block-Code-Schnipsel"
}
const x = 'Block-Code-Schnipsel in JS';
console.log(x);

Listen

Genau wie in HTML lassen sich in Markdown sowohl nummerierte als auch unnummerierte Listen erstellen.

Nummerierte Liste

1. HTML
2. CSS
3. JavaScript
4. React
7. Ich bin jetzt Frontend-Entwickler 👨🏼‍🎨
  1. HTML
  2. CSS
  3. JavaScript
  4. React
  5. Ich bin jetzt Frontend-Entwickler 👨🏼‍🎨

Ungeordnete Liste

- Node.js
+ Express
* Nest.js
- Backend lernen ⌛️
  • Node.js
  • Express
  • Nest.js
  • Backend lernen ⌛️

Gemischte Liste

Du kannst auch beide Listen mischen und Unterlisten erstellen.
PS. Versuche, keine Listen mit mehr als zwei Ebenen zu erstellen. Das ist die bewährte Vorgehensweise.

1. Grundlagen lernen
   1. HTML
   2. CSS
   7. JavaScript
2. Ein Framework lernen
   - React
 - Router
 - Redux
   * Vue
   + Svelte
  1. Grundlagen lernen
    1. HTML
    2. CSS
    3. JavaScript
  2. Ein Framework lernen
    • React
  • Router
  • Redux
    • Vue
    • Svelte

Tabelle

Eine hervorragende Möglichkeit, Daten übersichtlich darzustellen. Verwende das Symbol „|“ zum Trennen der Spalten und das Symbol „:“ zum Ausrichten des Zeileninhalts.

| Linksbündig (Standard) | Zentriert | Rechtsbündig |
| :------------------- | :----------: | ----------: |
| React.js | Node.js | MySQL |
| Next.js | Express | MongoDB     |
| Vue.js | Nest.js | Redis |
Linksbündig (Standard)ZentriertRechtsbündig
React.jsNode.jsMySQL
Next.jsExpressMongoDB
Vue.jsNest.jsRedis

Aufgabenliste

Den Überblick über erledigte und noch zu erledigende Aufgaben behalten.

- [x] Markdown lernen
- [ ] Frontend-Entwicklung lernen
- [ ] Full-Stack-Entwicklung lernen
  • Markdown lernen
  • Frontend-Entwicklung lernen
  • Full-Stack-Entwicklung lernen

Fußnote

Möchtest du am Ende der Datei etwas beschreiben? Verwende eine Fußnote!

#### Ich arbeite an einem neuen Projekt. [^1]
[^1]: Der Stack besteht aus: React, TypeScript, Tailwind CSS

Das Projekt dreht sich um Musik und Filme.

##### Ich hoffe, es gefällt euch. [^siehe]
[^siehe]: Wird geladen... ⌛️

Ich arbeite an einem neuen Projekt. 1

Das Projekt dreht sich um Musik und Filme.

Ich hoffe, es gefällt euch. 2

Zum Abschnitt springen

Astro (und die meisten Markdown-Parser) generieren automatisch IDs für deine Überschriften. Du musst in der Regel keine manuellen <a name="...">-Tags erstellen.


Horizontale Linie

Du kannst Sternchen, Bindestriche oder Unterstriche (*, -, _) verwenden, um eine horizontale Linie zu erstellen.
Die einzige Regel ist, dass du mindestens drei Zeichen des Symbols verwenden musst.

Erste horizontale Linie

***

Zweite

-----

Dritte

_________

Erste horizontale Linie


Zweite


Dritte



HTML

Sie können in Ihrer Markdown-Datei auch reines HTML verwenden. Meistens funktioniert das gut, aber manchmal können Unterschiede auftreten, die Sie von der Arbeit mit Standard-HTML nicht gewohnt sind. Die Verwendung von CSS funktioniert nicht.

<h1>Dies ist eine Überschrift</h1>
<p>Absatz...</p>

<hr />

<img src="automatisch-generierter-Pfad-zur-Datei-beim-Hochladen-des-Bildes" width="200">
<a href="https://github.com/im-luka">Folge mir auf GitHub</a>

<br />
<br />

<p>Schneller Hack für <strong><em>Bildzentrierung</em></strong>?</p>
<p align="center"><img src="automatisch-generierter-Pfad-zur-Datei-beim-Hochladen-des-Bildes" /></p>

<details>
  <summary>Noch ein schneller Hack? 🎭</summary>

  → Einfach
  → Und unkompliziert
</details>

Das ist eine Überschrift

Absatz...


Folge mir auf GitHub

Schneller Hack für Bildzentrierung?

Noch ein schneller Trick? 🎭

→ Einfach
→ Und unkompliziert


Mermaid-Diagramme

Mindmap

mindmap
  root((Test Intelligence Hub))
    Datenerfassung
 API-Integration
 Browser-Automatisierung
 RSS-Feeds
 Planung & Orchestrierung
    Datenverarbeitung
 Speicherung strukturierter Daten
 Verarbeitung unstrukturierter Daten
      LLM-Integration
 Abgleich & Bewertung
    Benutzeroberfläche
 Dashboard & Visualisierung
 Alarmmanagement
 Konfiguration & Einstellungen
    Infrastruktur
 Überwachung & Protokollierung
 Fehlerbehandlung
 Skalierbarkeit
 Kosteneffizienz

Flussdiagramm

flowchart LR
    A[Datenquellen] --> B[Erfassungsschicht]
    B --> C[Verarbeitungsschicht]
    C --> D[Speicherschicht]
    D --> E[Benutzeroberfläche]
    D --> F[LLM-Schnittstelle]
    G[Überwachungsschicht] -.-> B
    G -.-> C
    G -.-> D

Abschnitt mit einer ID

Footnotes

  1. Der Stack besteht aus: React, TypeScript, Tailwind CSS

  2. Wird geladen… ⌛️