Introducción a Experience Modernization Agent getting-started

Conozca los primeros pasos para aumentar rápidamente la productividad con Experience Modernization Agent mediante Experience Modernization Console.

NOTE
Si está interesado en utilizar la consola de modernización de experiencias, puede solicitar acceso para garantizar una experiencia de incorporación sin problemas.

Preparación de un repositorio de GitHub de Edge Delivery prepare-repo

NOTE
¿Utiliza un proyecto de AEM Sites y Universal Editor? Siga los pasos de configuración de Introducción a AEM Sites/Editor universal.
  1. Seleccione un repositorio Edge Delivery Services para utilizarlo con la consola de modernización de experiencias.

  2. Asegúrese de que el Conector de código AEM esté instalado en el repositorio.

    • Esto permite que la consola inspeccione el código.
  3. Asegúrese de que la aplicación GitHub de sincronización de código de AEM esté instalada en el repositorio.

    • Esto permite a Edge Delivery Services sincronizar su código.
    • Si el repositorio se basa en el tutorial, este paso ya está completo.

Abra la consola de modernización de Experience open-console

  1. Ir a aemcoder.adobe.io.
  2. Inicie sesión con su Adobe ID.

Conectar el repositorio de GitHub connect-repo

La consola le solicitará un repositorio la primera vez que inicie sesión.

Primera pantalla de inicio de sesión de la consola

  1. Haga clic en Conectar repositorio.
  2. Se abrirá la aplicación Conector de código de AEM en una nueva pestaña del explorador. Haga clic en Autorizar conector de código AEM.
  3. En la consola, seleccione Propietario, Repositorio y Selección de rama y haga clic en Finalizar compra en el espacio de trabajo.
    Conectando con el proyecto de GitHub
  4. Cuando se le pida Reemplazar el área de trabajo existente, haga clic en Reemplazar área de trabajo.
    Reemplazar área de trabajo existente

El proyecto de GitHub ahora está conectado a la consola y usted se encuentra en la pantalla de inicio.

Inicio de la consola

Iniciar petición de datos start-prompting

Ahora que la consola puede acceder al código, está listo para empezar a preguntar.

  1. Para empezar, puede importar el contenido de un sitio:

    • "Migrar la página https://wknd-trendsetters.site."
  2. Esto importa el contenido del sitio.

    • La consola observa la separación de preocupaciones y gestiona el contenido y la presentación por separado.
    • La importación inicial del contenido de un sitio puede tardar varios minutos.
    • La consola le presenta comentarios continuos cuando comienza su trabajo, incluida una descripción general de los pasos planificados.
      Importación de contenido
  3. Una vez importado el sitio, el panel Workspace muestra las páginas. Seleccione una página para previsualizarla en el panel derecho.
    Contenido importado

  4. Ahora que tiene contenido, puede pedir que se importen los estilos desde el mismo origen.

    • "Importar los estilos generales de https://wknd-trendsetters.site."
  5. Al igual que con la importación de contenido inicial, la importación puede tardar varios minutos y la consola proporciona comentarios a medida que procesa la solicitud e importa los estilos. Una vez finalizada la tarea, haga clic en Actualizar vista previa en el panel derecho para ver el contenido con estilo.
    Estilos importados

Ahora tiene el contenido y los estilos importados en la consola.

TIP
Consulte la guía de mensajes para obtener más ideas sobre cómo preguntar al agente y lo que pueden hacer sus habilidades.

Cargar contenido upload-content

TIP
Si está trabajando en un proyecto de AEM Sites y Universal Editor, la carga de contenido en AEM funciona de un modo ligeramente distinto. Consulte Introducción al agente de modernización de experiencias para proyectos de AEM Sites/editor universal para obtener instrucciones específicas sobre la carga.

Para cargar el contenido en Document Authoring:

  1. Asegúrese de que está en la vista Contenido y luego haga clic en el botón Cargar contenido en la parte superior derecha.

    • De manera predeterminada, se encuentra en la vista Contenido al entrar a la consola.
    • La vista se indica mediante el icono resaltado en la barra lateral a lo largo del lado izquierdo de la consola.
  2. El cuadro de diálogo Cargar contenido se abre con la organización de destino y el repositorio prerrellenados desde su fstab.yaml.

    • Si un(a) fstab.yaml no está presente en el repositorio conectado, deberá ingresar manualmente sus organizaciones y repositorios.
    • Si utilizó la repetidor, se proporciona un fstab.yaml.
  3. Seleccione los archivos que desee cargar y haga clic en Cargar.
    Cuadro de diálogo Cargar contenido

  4. La consola indica el proceso de carga al atenuar el botón Cargar.
    Cargando

  5. Una vez finalizada, aparece una notificación en la parte inferior de la consola.
    Ver en AEM

Para tener acceso al contenido cargado en Document Authoring, si lo desea, haga clic en Ver en AEM en la notificación cuando finalice la carga o vaya a https://da.live/#/{organization}/{repository}.

Contenido en la creación de documentos

El contenido importado ahora se encuentra en Document Authoring.

Cambios en el código push push-code-changes

Una vez que esté satisfecho con los cambios realizados en el código, puede insertarlos en el repositorio de GitHub.

  1. Cambie a la vista Código (icono </> en la barra lateral izquierda) y, a continuación, a la pestaña Cambios de Git (icono de rama en la parte superior derecha).
    Vista de código
  2. En la lista de archivos modificados, si algunos archivos aparecen como sin seguimiento, haga clic en su botón + para almacenarlos en zona intermedia.
  3. Haga clic en el botón Acciones de GitHub en la parte superior derecha y, a continuación, seleccione Insertar en la lista desplegable.
  4. En el cuadro de diálogo Insertar cambios, elija insertar los cambios en una nueva PR (predeterminada) o en la rama actual y haga clic en Confirmar para insertarlos.
    • En caso de duda, puede insertar la rama actual para que las cosas sean sencillas.
  5. Una vez finalizada, aparece una notificación en la parte inferior de la consola.
    Ver PR

Si desea acceder directamente a los cambios insertados en GitHub, haga clic en Ver PR en la notificación cuando finalice la inserción.

Código en GitHub

Su código se encuentra ahora en GitHub.

Previsualizar sitio preview-site

Para ver los cambios en el entorno de vista previa:

  1. Vuelva a Creación de documentos.

    • Aún puede estar abierto en una pestaña del navegador que abriste después de hacer clic en Ver en AEM después de cargar el contenido.
    • O vaya a https://da.live/#/{organization}/{repository}
  2. Abra una de las páginas que cargó anteriormente en AEM.

  3. Haga clic en el icono del avión de papel (parte superior derecha) y seleccione Vista previa.
    Publicar en vista previa

¡Enhorabuena! El contenido y los estilos migrados ya están activos en el entorno de vista previa de AEM.

Contenido de vista previa publicado

Si insertó el código en una rama que no sea main, la vista previa abierta desde Document Authoring no mostrará los estilos. Cambie a la rama actualizando la URL de la vista previa y podrá ver sus estilos.

Recursos adicionales additional-resources

Los siguientes documentos pueden resultar útiles a medida que continúa explorando Experience Modernization Agent y su consola.

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab