Markdown
Panoramica sull'utilizzo di Markdown e delle sue integrazioni in Pixi'VN, con esempi per React, Vue, Svelte e Angular.
Markdown è un linguaggio di markup leggero per creare testo formattato utilizzando un editor di testo normale. John Gruber ha creato Markdown nel 2004, in collaborazione con Aaron Swartz, come linguaggio di markup concepito per essere facile da leggere nella sua forma di codice sorgente. Markdown è ampiamente utilizzato per i blog e la messaggistica istantanea, ma anche in forum online, software collaborativi, pagine di documentazione e file readme.
Pixi'VN non è vincolato ad alcun markup e offre allo sviluppatore la possibilità di scegliere il markup che preferisci. Tuttavia, si consiglia di utilizzare Markdown.
Ecco alcuni esempi di implementazioni di Markdown nell'ecosistema JavaScript:
// I use the react-markdown library to convert the Markdown to HTML
// read more about it here: https://www.npmjs.com/package/react-markdown
import Markdown from "react-markdown";
import rehypeRaw from "rehype-raw";
import remarkGfm from "remark-gfm";
export default function MarkdownComponent({ text }: {
text: string;
}) {
return (
<Markdown
remarkPlugins={[remarkGfm]}
rehypePlugins={[rehypeRaw]}
>
{text}
</Markdown>
)
};
React Markdown Typewriter
React Markdown Typewriter è una libreria che combina Markdown e Typewriter. Questa libreria è stata creata da me per la mia necessità di aggiungere un effetto Typewriter al componente Markdown per i miei template React.
Se utilizzi React, ti consiglio di usarlo:
import { MarkdownTypewriter } from "react-markdown-typewriter";
import rehypeRaw from "rehype-raw";
import remarkGfm from "remark-gfm";
export default function MarkdownComponent({ text }: {
text: string;
}) {
return (
<MarkdownTypewriter
remarkPlugins={[remarkGfm]}
rehypePlugins={[rehypeRaw]}
>
{text}
</MarkdownTypewriter>
)
};