Plantilla de blog para Next.js que renderiza publicaciones MDX con Tailwind CSS y TypeScript, lista para desplegar en Vercel.
notionnext-org/NotionNext
Convierte un espacio de trabajo de Notion en un sitio web público personalizable para blogs, portafolios, documentación y landing pages, con Next.js y la API de Notion.
Alternativa open source a:Notion Sites
Super.so
Potion
- Estrellas
- 11,871
- Forks
- 14,707
- Issues abiertos
- 24
- Último commit
- hace 20 horas
¿Qué es?
NotionNext es un sistema de sitios web de código abierto basado en Next.js y la API de Notion. Puedes seguir escribiendo y organizando publicaciones, categorías, etiquetas, menús y páginas en Notion; NotionNext las publica en un sitio web público con compatibilidad con SEO, sitemap, RSS y búsqueda.
El proyecto incluye 26 temas integrados para blogs, sitios de documentación, portafolios, landing pages de productos, galerías de fotos y sitios de navegación. Se puede desplegar en Vercel y Zeabur, y no requiere un servidor propio. También permite integrar sistemas de comentarios como Giscus, Twikoo, Gitalk, Cusdis y Utterances, además de analíticas y dominios personalizados.
Para configurarlo, hay que duplicar una plantilla de Notion, crear un fork del repositorio y conectarlo a Vercel indicando un ID de página de Notion en las variables de entorno. El desarrollo local requiere Node 22 y Yarn 1.
Funciones clave
- 01Publica páginas, entradas y menús de Notion como un sitio web público, sin necesidad de un servidor propio.
- 02Incluye 26 temas integrados para blogs, sitios de documentación, portafolios, landing pages y sitios de navegación.
- 03Es compatible con SEO, sitemap, RSS y búsqueda en el sitio.
- 04Integra sistemas de comentarios como Giscus, Twikoo, Gitalk, Cusdis y Utterances.
- 05Se despliega en Vercel o Zeabur, y admite dominios personalizados y analíticas.
Casos de uso
- Mantener un blog personal y escribir todo directamente en Notion.
- Crear un portafolio o sitio de marca personal para diseñadores o fotógrafos.
- Publicar una landing page de producto o la página principal de un SaaS y gestionarla desde Notion.
- Convertir una base de conocimientos de Notion o la documentación de un equipo en un sitio de documentación con búsqueda.
Inicio rápido
- 1
Clona o haz un fork del repositorio y ábrelo en local
- 2
Usa Node 22 (Node 20 no puede instalar las dependencias actuales)
nvm use || nvm install - 3
Instala Yarn 1 globalmente
npm i -g yarn - 4
Instala las dependencias
yarn - 5
Inicia el servidor de desarrollo local
yarn dev
Antes de usarlo
- Se requiere Node 22; Node 20 no puede instalar las dependencias actuales.
- El contenido debe mantenerse en Notion y, para ejecutar el sitio, hay que configurar el ID de una página de Notion.
Temas
Preguntas frecuentes
- ¿Qué es NotionNext?
- Convierte un espacio de trabajo de Notion en un sitio web público personalizable para blogs, portafolios, documentación y landing pages, con Next.js y la API de Notion. NotionNext es un sistema de sitios web de código abierto basado en Next.js y la API de Notion. Puedes seguir escribiendo y organizando publicaciones, categorías, etiquetas, menús y páginas en Notion; NotionNext las publica en un sitio web público con compatibilidad con SEO, sitemap, RSS y búsqueda.
- ¿NotionNext es gratuito? ¿Qué licencia tiene?
- NotionNext es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
- ¿NotionNext sigue mantenido?
- Mantenimiento activo. El último commit de NotionNext fue el 21 oct 2026.
- ¿Para qué puedo usar NotionNext?
- Mantener un blog personal y escribir todo directamente en Notion. Crear un portafolio o sitio de marca personal para diseñadores o fotógrafos. Publicar una landing page de producto o la página principal de un SaaS y gestionarla desde Notion. Convertir una base de conocimientos de Notion o la documentación de un equipo en un sitio de documentación con búsqueda.
- ¿Cómo se instala NotionNext?
- Clona o haz un fork del repositorio y ábrelo en local Usa Node 22 (Node 20 no puede instalar las dependencias actuales): nvm use || nvm install Instala Yarn 1 globalmente: npm i -g yarn Instala las dependencias: yarn Inicia el servidor de desarrollo local: yarn dev
- ¿Dónde consigo NotionNext?
- El código fuente y las instrucciones de instalación están en GitHub: https://github.com/notionnext-org/NotionNext
Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.
Proyectos relacionados
Una interfaz de gestión de contenido basada en Git para sitios estáticos, que permite a los editores modificar contenido en un repositorio Git desde un panel web en /admin.
Colección de paquetes de instrucciones instalables que aportan a los agentes de programación con IA conocimientos sobre Vercel y buenas prácticas de React/Next.js.
CMS headless de código abierto para editar contenido en Markdown, MDX, JSON y YAML almacenado en tu propio repositorio Git, con una API GraphQL.
Dashboard de bolsa de código abierto y autoalojable, con gráficos en tiempo real, alertas de precios, listas de seguimiento e información de empresas, creado con Next.js y TradingView.
Aplicación web de entrenamiento físico de código abierto para crear planes de ejercicio, seguir el progreso y consultar una base de datos de ejercicios.