Construyendo un blog utilizando el patrón de diseño "Islas". Un backend basado en la base de datos SQLite que genera un sitio web moderno estático.
Los scripts bucearon a través de la base de datos creando documentos HTML totalmente renderizados y fragmentos DOM para cada página del sitio. Nginx lee las solicitudes y servirá una u otra en función de la existencia del encabezado hx-request
. hx-boost
se emplea para izar automáticamente todas las etiquetas de anclaje a las solicitudes de AJAX, lo que hace que la magia suceda. Los documentos de respuesta contienen <title>
etiquetas que HTMX reconoce y se aplica a la página para obtener mejores UX & SEO.
Todos los comandos de compilación se ejecutan usando BUN.
bun install
despojará todas las dependencias requeridas.bun edit
ejecuta el servidor de backend para la administración de la base de datos Wysiwyg.bun run init
construye la estructura dist
de la carpeta y mueve los archivos en su lugar para el sitio renderizado.bun htmx
ejecutará el mecanografiado para generar los activos HTML del sitio.bun css
ejecuta los scripts PostCSS para generar y optimizar el estilo del sitio usando TailWindSCSS.bun start
ejecuta Init, HTMX y CSS.El contenido del sitio se genera a partir de una base de datos SQLite de 4 tabla que contiene: publicaciones, categorías, etiquetas y una tabla de metadatos relacionales que los correlaciona. La lógica de la base de datos existe en: SRC/modelos.
Las plantillas html/bigote viven en: src/vistas
La hoja de estilo principal está aquí: src/ui/thema.css. Sé que estoy usando viento de cola "incorrecto", salga de aquí.
Hay 2 archivos que definen los dominios globales utilizados. Una es para el editor de backend el otro en sí mismo. Defieren //localhost
para el soporte de respaldo HTTP.
Se puede acceder al editor WYSIWYG basado en la web ejecutando bun edit
. El editor admite agregar, editar y eliminar publicaciones y sus meta datos, así como las categorías y etiquetas en sí. El puerto predeterminado y el nombre de host (localhost: 8999) se pueden cambiar en: src/server.ts.
Las configuraciones de muestra NGINX están disponibles en el directorio NGINX. La única "magia" real es una agrega al directorio raíz sobre la existencia del encabezado HX-Request en el ejemplo disponible de los sitios.
¡V1.0 de este proyecto está completo! Ahora está alimentando mi blog en https://blog.xe.ro
(Estaba pensando en llamar a este proyecto tnthumbs b/c se construye usando: typescript nginx tailwindcss htmx unix bigote bun sqlite)
¡Todos los archivos en este repositorio, incluido el contenido de mi blog, se lanzan CC0 / Kopimi! ¡En el espíritu de la libertad de información , te animo a bifurcar, modificar, cambiar, compartir o hacer lo que quieras con este proyecto! ^c^v