Guía de Archittect

Si tienes alguna pregunta, no dudes en contactarnos

Aprende a hacer tus templates de boilerplate dinámicas


Una vez que hayas identificado tu boilerplate, puedes comenzar a convertir los fragmentos que quieras, en variables. Esta acción permitirá que tu boilerplate se transforme en una plantilla dinámica.

Cada vez que la uses en un proyecto podrás agregarle un valor de acuerdo a la información del proyecto que estás creando, de esta forma tendrás listo tu código personalizado.


Antes de comenzar a crear tu boilerplate dinámico ten en mente que:

  • Tienes dos opciones: crear un snippet o un scaffold
  • Puedes crear un snippet cuando quieras crear fragmentos de código.
  • Puedes agrupar varios snippets en caso de que pertenezcan a una misma categoría o un solo snippet en caso de que no quieras agruparlos.
  • Usa scaffolds si quieres tener una estructura más grande, ya que con los scaffolds puedes crear: carpetas, archivos dentro de los cuales puedes incluir código y/o agregar snippets con variables que ya tengas guardados.

A continuación te mostramos cómo crear un snippet usando la extensión de VSCode:

  • Paso 1: Abre la extensión de Archittect en VSCode

  • Paso 2: Selecciona la pestaña de Snippets

  • Paso 3: Da clic al botón “Create new Snippet”

  • Paso 4: Agrega tu código en el editor de texto

  • Paso 5: Puedes agregar más de un snippet dando clic en el botón de más.

  • Paso 6: Busca en VSCode el archivo donde quieras agregar tu snippet, dirígete al apartado de tu código donde lo quieras agregar, haz clic derecho y selecciona la opción Insert Snippet. Más adelante te mostraremos cómo agregar un Snippet dentro de un Scaffold


A continuación te mostramos cómo crear un Scaffold:

  • Paso 1: Abre la extensión de Archittect en VSCode
  • Paso 2: Selecciona la pestaña de Scaffold
  • Paso 3: Da clic al botón “Create new scaffold”
  • Paso 4: Comienza a crear tu estructura a partir de nodos, un nodo puede ser una carpeta (En caso de que vayas a agregar un archivo dentro) o un archivo (en caso de que vayas a agregar contenido dentro)
  • Paso 5: Desde ya, puedes poner variables en el nombre de tus carpetas o archivos y agregarles un transformer.
  • Paso 6: En caso de que quieras agregar contenido a un archivo, debes seleccionar el nodo correspondiente, dirigirte al menú del nodo y dar clic al botón “Edit Content”, se te abrirá un editor de texto.
  • Paso 7: Agrega a tu archivo el código o snippets que hayas guardado anteriormente.

Recuerda que cada vez que realices un cambio debes guardarlo.


Para insertar un Snippet dentro de un Scaffold sigue los pasos:

  • Paso 1: Una vez que tengas creado el Snnipet ingresa en el nodo en el que deseas insertarlo.
  • Paso 2: En el menú de tu derecha podrás ver una lista de grupos de Snippets que tengas guardados.
  • Paso 3: Expande el grupo que desees y posiciona tú cursor en el lugar en el que desees insertar tu Snippet y dale clic.
  • Paso 4: Listo, ya tienes insertado tu snippet.

Existe otra forma en la que puedes crear Snippets y Scaffolds a partir de un proyecto creado, esta funcionalidad solamente puedes usarla si estás usando nuestra herramienta en VSCode.


A continuación te mostramos cómo crear un snippet desde tus archivos de código:

  • Paso 1: Entra a un archivo en el que tengas el contenido que quieres transformarle en snippet.
  • Paso 2: Selecciona el fragmento de código, da clic derecho y en el menú desplegable selecciona la opción: “Create snippet from selection”
  • Paso 3: Listo, ya tienes tu snippet para personalizarlo como desees y usarlo cuando quieras"

A continuación te mostramos cómo crear un scaffold desde una estructura de archivos en VSCode:

  • Paso 1: Dirígete a la carpeta o archivo que quieres transformar en un scaffold.
  • Paso 2: Da clic derecho sobre la carpeta o archivo y en el menú desplegable escoge la opción: “Create scaffold form files”
  • Paso 3: Verás creado tu Scaffold dentro de la pantalla de Archittect.