El conocimiento es el nuevo dinero.
Aprender es la nueva manera en la que inviertes
Acceso Cursos

Cree aplicaciones full-stack modernas en AWS

Qué es SST SST es un marco que facilita la creación de aplicaciones modernas de pila completa en AWS. permite Implementar una aplicación sin servidor Next.js, Svelte, Remix, Astro o Solid en su cuenta de AWS y añádale cualquier característica de backend.

· 1 min de lectura
Cree aplicaciones full-stack modernas en AWS

Frontend


Comienza por definir, en código, el frontend que está utilizando. SST admite los siguientes.

Next.js

new NextjsSite(stack, "site", {
  customDomain: "my-next-app.com",
});

Svelte


También existe SvelteKitSite para Svelte.

new SvelteKitSite(stack, "site", {
  customDomain: "my-svelte-app.com",
});

Remix


O el RemixSite para Remix.

new RemixSite(stack, "site", {
  customDomain: "my-remix-app.com",
});

Astro


O el AstroSite para Astro.

new AstroSite(stack, "site", {
  customDomain: "my-astro-app.com",
});

Solid


Y el SolidStartSite para Solid.

new SolidStartSite(stack, "site", {
  customDomain: "my-solid-app.com",
});

Sitios estáticos
También existe el StaticSite para cualquier constructor de sitios estáticos.

new StaticSite(stack, "site", {
  path: "web",
  buildOutput: "dist",
  buildCommand: "npm run build",
  customDomain: "my-static-site.com",
});

Basta con especificar el comando de compilación y señalar dónde se genera la salida.

Infraestructura


Los fragmentos anteriores son una forma de definir las características de tu aplicación en código. Puedes definir cualquier característica de tu aplicación, no sólo el frontend.

Puedes añadir características de backend como APIs, bases de datos, cron jobs y más. Todo ello sin necesidad de utilizar la consola de AWS.

Constructos


Estos fragmentos se llaman Constructs. Son clases TypeScript o JavaScript, donde cada clase corresponde a una característica y puede ser configurada a través de sus props.

const site = new NextjsSite(stack, "site", {
  /** props **/
});

Recomendamos el uso de TypeScript porque permite una seguridad de tipos completa mientras se configura la aplicación.

Stacks


Los constructos se agrupan en Stacks. Te permiten organizar la infraestructura de tu aplicación.

stacks/Web.ts
export function Web({ stack }: StackContext) {
  const site = new NextjsSite(stack, "site");
}

Aplicación


Por último, añade todos tus Stacks a tu app en el archivo sst.config.ts.

sst.config.ts
export default {
  config() {
    return {
      name: "my-sst-app",
      region: "us-east-1",
    };
  },
  stacks(app) {
    app.stack(Database).stack(Api).stack(Web);
  },
} satisfies SSTConfig;

En el próximo post estaremos viendo cómo se puede añadir el backend para su aplicación con estas construcciones con sst

Fuente