Para los amantes de Markdown: escribe como en GitHub
¿Qué es Markdown?
Es una forma de escribir con formato usando caracteres especiales. Por ejemplo: **negrita** se convierte en negrita, # Título se convierte en un título grande.
💡 Es el formato preferido por programadores y escritores técnicos.
¿Cuándo usar MarkdownEditor?
Cuando tu equipo prefiere Markdown: documentación técnica, READMEs, posts de blog técnico, contenido para desarrolladores.
📍 Archivo: app/Filament/Resources/DocumentacionResource.php
📝 ESTE ES EL CÓDIGO QUE VAMOS A APRENDER:
📍 Archivo: app/Filament/Resources/DocumentacionResource.php
MarkdownEditor::make('documentacion')
->label('Documentación técnica'),
🔍 Vamos a entender línea por línea (como si fuera la primera vez):
MarkdownEditor::make('documentacion')→ Creamos un editor de Markdown. El usuario escribe con sintaxis Markdown y ve una previsualización al lado.
->label('Documentación técnica')→ La etiqueta indica que este campo es para documentación, donde Markdown brilla.
📊 RichEditor vs MarkdownEditor:
| Característica | RichEditor | MarkdownEditor |
|---|---|---|
| Formato | HTML | Markdown |
| Interfaz | Botones tipo Word | Editor + previsualización |
| Usuario ideal | No técnicos | Desarrolladores, técnicos |
| Guardado | HTML en BD | Markdown en BD |
👆 Usa MarkdownEditor para contenido técnico.
Sintaxis Markdown básica
# Título principal
## Subtítulo
Este texto está en **negrita** y este en *cursiva*.
- Lista con viñetas
- Otro elemento
1. Lista numerada
2. Segundo elemento
[Enlace](https://ejemplo.com)
`código en línea`
💡 El editor muestra el código Markdown y una previsualización lado a lado.
📁 ¿Quieres ver el código completo del archivo? (opcional)
Esto es solo para que veas dónde va tu código. No necesitas memorizar todo esto:
// app/Filament/Resources/DocumentacionResource.php
public static function form(Form $form): Form
{
return $form
->schema([
TextInput::make('titulo')
->required(),
MarkdownEditor::make('documentacion')
->label('Documentación técnica')
->required(),
]);
}
🎉 ¿Qué aprendimos hoy?
MarkdownEditor::make()crea un editor de Markdown- El usuario escribe con sintaxis Markdown (**negrita**, # título…)
- Muestra editor y previsualización lado a lado
- Ideal para documentación técnica y contenido para desarrolladores
¡Ahora tienes opciones para todos los gustos: visual o técnico! En la siguiente lección veremos toolbarButtons para MarkdownEditor.