---
# System prepended metadata

title: Ejercicio Mercado Libre Mobile iOS

---

# Ejercicio Mercado Libre Mobile iOS 

## Contenido de la App

La aplicación desarrollada consta de 3 pantallas precedidas por un Splash.

### Inicio de la App

Se trabajó un LaunchScreen simple con un logo para transicionar a un Splash con una animación Lottie que hace alusión al contenido de la app que es un buscador.

En los gif a continuación se muestra el comportamiento de esta parte de la applicación con un iPhone 11 Pro Max con orientación tanto vertical como horizontal a modo de ejemplo.

<div><img src="https://i.imgur.com/nhCqMni.gif" width="30%"/> <img src="https://i.imgur.com/UXtvIBG.gif" width="60%"/></div>

### Pantalla Principal

La pantalla principal contiene una imagen (logo), un textfield para que el usuario ingrese los términos de búsqueda y un botón buscar. 

El gif que muestra el funcionamiento de esta parte corresponde a la simulación en un iPhone SE y en allí se muestra algunas alertas en casos de error.

<div><img src="https://i.imgur.com/zSZjCpV.gif" width="30%"/></div>


### Resultados de Búsqueda

Los resultados de la búsqueda se muestran en un TableView con los datos más descriptivos para el usuario: Imagen, título y precio. En la tabla solo se están cargando los primeros 50 resultados.

<div><img src="https://i.imgur.com/l4Jby70.png" width="30%"/></div>

### Detalle de un Item

Por simplicidad y porque el servicio responde con el link a la web de mercado libre con el detalle del item, se utilizó un WKWebView para mostrar dicho detalle.

<div><img src="https://i.imgur.com/avUs9QT.png" width="30%"/></div>


## Sobre los aspectos evaluados y requerimientos

### Arquitectura

En general decidí implementar VIPER con un módulo por pantalla usando Storyboards.

Para la conexión a la API de búsqueda utilicé un Data Manager y si bien hice solo una llamada a API, generalmente manejo una capa de red genérica reutilizable que me permita crear un Data Manager por API que yo pueda reutilizar cuantas veces necesite.

En la última pantalla que es el detalle del ítem, por la simpleza de la pantalla que solo contiene un WKWebview y no implementa ningún tipo de lógica compleja, decidí no implementar las capas de VIPER porque solo aportarían complejidad a esa parte del código sin aportar los beneficios del uso de capas.

### Navegación

Desde la pantalla principal en adelante se utiliza navigation controller, en la pantalla anterior (Splash) se utiliza presentación mediante present individual. Se decidió de esta manera porque el usuario no debería poder volver al splash una vez desaparece esa pantalla, además el navigation controller nos otorga facilidad de navegación entre vistas.

### Casos de Error (Usuario)

Se dejaron mensajes de error a modo de alerta para comunicar al usuario que no se puede entregar respuesta en distintas partes de la aplicación:

* Busqueda vacía.
* Búsqueda que no arroja resultados. Ejemplo: Buscar el término "."
* Si la llamada a API falla.
* Si interrumpo la conexión una vez que ya tengo la tabla de resultados y no es posible mostrar la vista de detalle tambien se le informa al usuario y se hace un dismiss de la pantalla que no se puede cargar.

### Casos de Error (Developer)

NSLog aplicado en sobretodo en el proceso de conexión a API. Pero no usado en gran medida.

### Layout

Se diseñó la aplicación de forma que se pueda utilizar tanto de forma vertical como horizontal, en modo claro u obscuro, sin embargo el modo obscuro tal vez no resulte tan estéticamente atractivo porque en la vista de resultados las imágenes tienen fondo blanco.

### Permisos solicitados al usuario

La aplicación es bastante sencilla y solo utiliza la conexión a internet del usuario por tanto no necesita permisos especiales.

### Test Unitarios

No se aplicó test.