tailnext

Tailnext

TailNext es una plantilla gratuita y de código abierto para hacer su sitio web con CSS NextJS + Tailwind . Listo para comenzar un nuevo proyecto y diseñó tener en cuenta las mejores prácticas.

Características

• ✅ Integración con el modo CSS de soporte de viento de cola que soporta el modo oscuro .
• ✅ Puntores listos para la producción en informes de Lighthouse y PageSpeed Insights.
• ✅ Optimización de imágenes y optimización de fuentes .
• Blog Fast and SEO Friendly Blog .
• ✅ Generación de mapa del sitio de proyectos y robots.txt basado en sus rutas.

Tabla de contenido

• Manifestación
• Empezando
  • Estructura de proyectos
  • Comandos
  • Configuración
  • Desplegar
• Hoja de ruta
• Que contribuye
• Expresiones de gratitud
• Licencia

Manifestación

? https://tailnext.vercel.app/

Empezando

• Clone: git clone https://github.com/onwidget/tailnext.git
• Ingrese en el directorio: cd tailnext
• Dependencias de instalación: npm install
• Iniciar el servidor de desarrollo: npm run dev
• Ver proyecto en el entorno local: localhost:3000

Estructura de proyectos

Plantilla interna de TailNext , verá las siguientes carpetas y archivos:

 /
├── .storybook/
├── app/
│   ├── (blog)
│   │   ├── [slug]
|   |   |   └── page.js
|   |   └── blog
|   |       └── page.js
│   ├── head.js
│   ├── layout.js
│   └── page.js
├── public/
│   └── favicon.svg
├── src/
│   ├── assets/
│   │   ├── images/
|   |   └── styles/
|   |       └── base.css
│   ├── components/
│   │   ├── atoms/
|   |   └── widgets/
|   |       ├── Header.astro
|   |       ├── Footer.astro
|   |       └── ...
│   │── content/
│   |   └── blog/
│   |       ├── demo-post-1.md
│   |       └── ...
│   ├── stories/
│   ├── utils/
│   └── config.mjs
├── package.json
└── ...

Experto a continuación. ¿Experto? Eliminar este archivo. Actualizar config.mjs y contenido. ¡Divertirse!

Comandos

Todos los comandos se ejecutan desde la raíz del proyecto, desde un terminal:

Dominio	Acción
npm install	Instalar dependencias
npm run dev	Inicia el servidor de desarrollo local en localhost:3000
npm run build	Construya su sitio de producción a ./dist/
npm run preview	Vista previa de su compilación localmente, antes de implementar
npm run storybook	Abra el libro de cuentos para ver historias de widgets
npm run format	Códigos de formato con más bonitos
npm run lint:eslint	Ejecutar Eslint

Configuración

Muy pronto ..

Desplegar

Desplegar a la producción (manual)

Puede crear una construcción de producción optimizada con:

npm run build

Ahora, su sitio web está listo para ser implementado. Todos los archivos generados se encuentran en la carpeta dist , que puede implementar la carpeta en cualquier servicio de alojamiento que prefiera.

Implementar para netlify

Clonar este repositorio en la cuenta de GitHub e implementar para netlify:

Desplegar en VERCEL

Clone este repositorio en la cuenta de GitHub e implementa en VERCEL:

Hoja de ruta

Muy pronto ..

Que contribuye

Si tiene alguna idea, sugerencia o encuentra algún error, no dude en abrir una discusión, un problema o crear una solicitud de extracción. Eso sería muy útil para todos nosotros y estaríamos encantados de escuchar y tomar medidas.

Expresiones de gratitud

Inicialmente creado por OnWidget y mantenido por una comunidad de contribuyentes.

Licencia

TailNext tiene licencia bajo la licencia MIT; consulte el archivo de licencia para obtener más detalles.