Fuente abierta CLIWooCommerce sin cabeza, cero caldera
Gire en una tienda Next.js con npx create-woonext-app
Un único comando recorre una aplicación de comercio Next.js totalmente configurada, cableada a tu punto final de WooGraphQL, tipo de extremo a extremo, y envío con carrito, auth y salida de la caja.
$npx crear-woonext-app
// Qué barcos en la caja
Una pila de grado de almacén, preconfigurado.
No más una tarde npm install encantamientos. Los andamios de CLI opinan que los mantenedores de WooGraphQL utilizan realmente en la producción.
N
Siguiente.js 16
App Router, Server Components, Server Actions y el último Next.js — instalar elige la versión con --next-version.
React 19 · Turbopack
◆
WooGraphQL client
graphql-request cableado con @woographql/session-utils para consultas conscientes del período de sesiones. Esquema tipo, no hay tiempo de ejecución de Apolo.
Consulta de grafito · usos de sesión
T
shadcn/ui + Tailwind
components.json inicializado con Tailwind v4, Sonner tostadas, Fuente Sans 3 + Playfair Mostrar fuentes. Añadir más via npx shadcn add.
shadcn/ui · Tailwind v4
{}
Generación tipo
@woographql/codegen se ejecuta en el inicio del dev, generando un SDK tipo grafql-request de su esquema de punto final.
@woographql/codegen
🔒
Sesión + austeridad
Custom SessionProvider en la parte superior de WooGraphQL JWT — elija las credenciales de almacenamiento de cookies o navegador a la instalación. Carros de invitados rozan en sesiones autenticadas.
@woographql/session-utils · JWT
↑
Páginas + acciones del servidor
Carrito, checkout multi-paso, confirmación del pedido y páginas de cuenta (ordenes, suscripciones, direcciones, métodos de pago) — más 25 rutas api.
Router de aplicaciones · Acciones del servidor
$
Checkout de rayas
Integración de elementos de rayas opcionales — @stripe/react-stripe-js, entradas de pago y rutas de clientes. Desactivado limpiamente cuando se opta por instalar.
@stripe/react-stripe-js · opcional
✓
Pruebas + Storybook
Biblioteca Jest + Testing para la unidad, Playwright para el final-a-final, Storybook con historias andadas para cada diseño y componente de características.
Jest · Playwright · Storybook
// Desde cero hasta el almacén
Tres órdenes. Una tienda de trabajo.
Un WooGraphQL La licencia Pro desbloquea el CLI y el privado @woographql/* paquetes en el registro de YeetSquad. Entonces te vas.
— 01 / and Scaffold
Corre el CLI
El impulso interactivo te lleva a través de plantilla, punta final y selección de características. Elige lo que necesites.
$ npx create-woonext-app
--template app-router
--endpoint \
https://shop.acme.com— 02 / Authenticate
Enlace de su licencia
El CLI escribe un proyecto-local .npmrc con su ficha de registro @woographql, y luego ejecuta woonext install a scaffold pages, layouts, rutas api y codegen.
$ cd my-store
$ npx woonext install
# ✓ Páginas, diseños, api
# rutas, codegen listo— 03 / barco
Iniciar el servidor dev
Codegen funciona, el esquema es introspectado, el servidor dev comienza en localhost:3000. Estás vivo.
$ npm run dev
# ▲ Next.js 16 · Turbopack
# ✓ Ready in 1.2s/ / @woographql paquetes
Paquetes privados, mantenido junto al esquema.
Los titulares de licencias tienen acceso a un conjunto curado de bibliotecas JavaScript en el registro YeetSquad. Están versionados con WooGraphQL en sí, cuando el esquema cambia, los tipos siguen.
@woographql/siguiente
Buscadores de servidor de Router, RSC-safe session + cart helpers
@woographql/reaccion-hooks
Ganchos de reacción lado cliente — useCart, useSession, useCheckout, useAuth
@woographql/sesiones-utilizados
WooCommerce sesión + gestión de token de carrito con adaptadores de almacenamiento enchufable
@woographql/codegen
Predeterminado del Generador de Códigos GraphQL para WooGraphQL — consultas escritas, ganchos, embragues del servidor
import { withMarketingSession } from '@woographql/next/server'
import { ProductCard } from '@/components/product-card'
import { GetFeaturedProductsDocument } from '@/graphql/generated'
export default withMarketingSession(async ({ client }) => {
const { data } = await client.query({
query: GetFeaturedProductsDocument,
variables: { first: 12 },
})
return (
{data.products?.nodes.map((product) => (
))}
)
})
// Sesión token roscada a través de la solicitud - se escribe en contra de su
// Esquema generado. No se requiere código de pegamento.
// Verlo correr
Una tienda completa, construido con la creación-woonext-app.
Carrito, checkout, cuenta, búsqueda, filtros, productos de suscripción. Cada capacidad actual de @woographql/next, desplegado en directo.
// Desbloquear el CLI
Los buques CLI con cada plan pagado.
Un WooGraphQL La licencia Pro le da acceso a create-woonext-app y el privado @woographql/* paquetes. Los suscriptores anuales los consiguen en cada nivel.
Fuente abierta
Gratis
plugin de núcleo, para siempre
$0
GPL-3 con licencia
✓
Core WooCommerce tipos " mutaciones
✓
Ajustes WPGraphQL & ajuste
✓
WooCommerce cart soporte
◯
Pro extensions (Bundles, Composite, Subs)
◯
create-woonext-app CLI
◯
@woographql JS paquetes
✓
Apoyo comunitario
Personal
Solo
Para 1 sitio web
99 dólares.99
por año
✓
1 activación del sitio web
✓
Actualizaciones ilimitadas
✓
Suscripciones, envases y productos compuestos apoyan
✓
Soporte de complementos de productos
✓
create-woonext-app CLI
✓
paquetes @woographql
✓
Llamada de consulta anual
Cuadro orgánico
Más populares
Organismo
Para hasta 5 sitios web
299.99
por año
✓
5 activaciones del sitio web
✓
Actualizaciones ilimitadas
✓
Suscripciones, envases y productos compuestos apoyan
✓
Soporte de complementos de productos
✓
create-woonext-app CLI
✓
paquetes @woographql
✓
Llamada de consulta anual
Negocios
Ilimitados
Sitios web ilimitados
449.99
por año
✓
Activaciones ilimitadas
✓
Actualizaciones ilimitadas
✓
Suscripciones, envases y productos compuestos apoyan
✓
Soporte de complementos de productos
✓
create-woonext-app CLI
✓
paquetes @woographql
✓
Llamada de consulta anual
Desde npx en directo en virtud de 5 minutos.
Comprar cualquier plan Pro anual para desbloquear los paquetes CLI y @woographql. El plugin gratuito sigue funcionando para siempre — actualizar sólo cuando estés listo para enviar.