Creación de una aplicación iOSCreate an iOS app

Información generalOverview

En este tutorial se muestra cómo agregar Azure App Service Mobile Apps, un servicio back-end basado en la nube, a una aplicación de iOS.This tutorial shows how to add Azure App Service Mobile Apps, a cloud backend service, to an iOS app. El primer paso es crear un nuevo back-end para dispositivos móviles en Azure.The first step is to create a new mobile backend on Azure. Después, es preciso descargar una sencilla aplicación iOS de lista de tareas de ejemplo que almacena datos en Azure.Then, download a simple Todo list iOS sample app that stores data in Azure.

Para completar este tutorial, es preciso tener un Mac y una cuenta de AzureTo complete this tutorial, you need a Mac and an Azure account

Paso lo hago?: Creación de un nuevo back-end de Aplicaciones móviles de AzureStep I: Create a new Azure mobile app backend

  1. Inicie sesión en el Azure Portal.Sign in to the Azure portal.

  2. Haga clic en Crear un recurso.Click Create a resource.

  3. En el cuadro de búsqueda, escriba Mobile Apps.In the search box, type Mobile Apps.

    Azure Portal con inicio rápido de Mobile Apps resaltadoAzure portal with Mobile Apps Quickstart highlighted

  4. En la lista de resultados, seleccione Inicio rápido de Mobile Apps y, después, seleccione Crear.In the results list, select Mobile Apps Quickstart, and then select Create.

  5. Elija un nombre de aplicación único.Choose a unique App name. También formará parte del nombre de dominio de la instancia de App Service.This will also be part of the domain name for your App Service.

  6. En Grupo de recursos, seleccione un grupo de recursos existente o cree uno nuevo (con el mismo nombre que su aplicación).Under Resource Group, select an existing resource group or create a new one (using the same name as your app).

  7. Haga clic en Create(Crear).Click Create. Espere unos minutos para que se implemente el servicio correctamente antes de continuar.Wait a few minutes for the service to be deployed successfully before proceeding. Observe el icono de notificaciones (campana) en el encabezado del portal para las actualizaciones de estado.Watch the Notifications (bell) icon in the portal header for status updates.

Paso II: Configurar el proyecto de back-endStep II: Configure the backend project

  1. Haga clic en el botón App Services, seleccione sucesivamente el back-end de Mobile Apps, Inicio rápido y la plataforma de cliente (iOS, Android, Xamarin, Cordova).Click the App Services button, select your Mobile Apps back end, select Quickstart, and then select your client platform (iOS, Android, Xamarin, Cordova).

    Azure Portal con inicio rápido de Mobile Apps resaltado

  2. Si no hay configurada ninguna conexión de base de datos, cree una haciendo lo siguiente:If a database connection is not configured, create one by doing the following:

    Azure Portal con Mobile Apps: conexión a la base de datos

    a.a. Cree una nueva instancia y un nuevo servidor de SQL Database.Create a new SQL database and server. Puede que tenga que dejar el campo del nombre de la cadena de conexión en el valor predeterminado MS_TableConnectionString para completar el paso 3 siguiente.You may need to leave the connection string name field to the default value of MS_TableConnectionString in order to complete step 3 below.

    Azure Portal con Mobile Apps: creación de una nueva base de datos y un nuevo servidor

    b.b. Espere hasta que se haya creado correctamente la conexión de datos.Wait until the data connection is successfully created.

    Notificación de Azure Portal de la creación correcta de conexión de datos

    c.c. La conexión de datos debe haberse creado correctamente.Data connection must be successful.

    Notificación de Azure Portal: "Ya tiene una conexión de datos"

  3. En 2. Crear una API de tabla, seleccione Node.js para Lenguaje de back-end.Under 2. Create a table API, select Node.js for Backend language.

  4. Acepte la confirmación y seleccione Crear tabla TodoItem.Accept the acknowledgment, and then select Create TodoItem table. Esta acción crea una nueva tabla de elementos pendientes en la base de datos.This action creates a new to-do item table in your database.

    Importante

    El cambio de un back-end existente a Node.js sobrescribe todo el contenido.Switching an existing back end to Node.js overwrites all contents. Para crear un back-end de .NET en su lugar, consulte Trabajar con el SDK del servidor back-end de .NET para Mobile Apps.To create a .NET back end instead, see Work with the .NET back-end server SDK for Mobile Apps.

Paso III: Descargar y ejecutar la aplicación iOSStep III: Download and run the iOS app

  1. En el Mac, vaya a Azure Portal.On your Mac, visit the Azure portal. Haga clic en Todos los servicios > App Services > el back-end que acaba de crear.Click All Services > App Services > the backend that you just created. En la configuración de la aplicación móvil, elija su lenguaje preferido:In the mobile app settings, choose your preferred language:

    • Objective-C – Inicio rápido > iOS (Objective-C)Objective-C – Quickstart > iOS (Objective-C)

    • Swift – Inicio rápido > iOS (Swift)Swift – Quickstart > iOS (Swift)

      En 3. Configurar la aplicación cliente, haga clic en Descargar.Under 3. Configure your client application, click Download. Esto descarga un proyecto de Xcode completo configurado previamente para conectarse a su back-end.This downloads a complete Xcode project pre-configured to connect to your backend. Abra el proyecto con Xcode.Open the project using Xcode.

  2. Presione el botón Ejecutar para compilar el proyecto e iniciar la aplicación en el simulador de iOS.Press the Run button to build the project and start the app in the iOS simulator.

  3. En la aplicación, haga clic en el icono con el signo más (+), escriba texto que tenga sentido, como Completar el tutorial y, luego, haga clic en el botón para guardar.In the app, click the plus (+) icon, type meaningful text, such as Complete the tutorial, and then click the save button. Esto envía una solicitud POST al back-end de Azure implementado anteriormente.This sends a POST request to the Azure backend you deployed earlier. El back-end inserta los datos de la solicitud en la tabla SQL TodoItem y devuelve información acerca de los elementos recién almacenados a la aplicación móvil.The backend inserts data from the request into the TodoItem SQL table, and returns information about the newly stored items back to the mobile app. La aplicación móvil muestra estos datos en la lista.The mobile app displays this data in the list.

    Aplicación de inicio rápido que se ejecuta en iOS