Asesor OR: Ing. Fernando Manzano Pacheco
65
UNIVERSIDAD POLITÉCNICA DE SINALOA PROGRAM A ACADÉMICO DE INGENIERÍA EN INFORMÁTICA Tesina “Generador de Trafico Orgánico para múltiples dominios” Para obtener la acreditación de las estadías profesionales y contar con los créditos para el grado de Ingeniero en Informática Autor: Cristofer Antonio Gómez Lizárraga Asesor: Ing. Julio Andrés Salas Castro Asesor OR: Ing. Fernando Manzano Pacheco Mazatlán, Sinaloa 14 de octubre de 2016.
Transcript of Asesor OR: Ing. Fernando Manzano Pacheco
UNIVERSIDAD POLITÉCNICA DE SINALOA
PROGRAMA ACADÉMICO DE INGENIERÍA EN INFORMÁTICA
Tesina
“Generador de Trafico Orgánico para múltiples dominios”
Para obtener la acreditación de las estadías profesionales y contar con los créditos para el grado de Ingeniero en
Informática
Autor: Cristofer Antonio Gómez
Lizárraga
Asesor: Ing. Julio Andrés Salas Castro
Asesor OR: Ing. Fernando Manzano Pacheco
Mazatlán, Sinaloa 14 de octubre de 2016.
1
2
3
4
5
Agradecimientos
Quiero agradecer primeramente a mis padres porque sin su cariño y apoyo,
tanto sentimental como económico, jamás hubiera conseguido todo lo que he
logrado y estoy consciente de que han realizado un sin fin de sacrificios con tal de
poder apoyarme por lo que les estoy infinitamente agradecido.
Además, agradezco a todos mis compañeros y maestros que a lo largo de
la carrera me han brindado su amistad y apoyo, comprensión y tolerancia, respeto
a cada uno de ellos y siempre les estaré agradecidos por estar durante esta etapa
de mi vida.
Respecto a esta tesina quiero agradecer al Ing. Julio Andrés Salas Castro
por su retroalimentación y sugerencias para la realización de la tesina.
Finalmente agradecer a la empresa VanillaSys por otorgarme la
oportunidad de participar en proyectos como practicante
6
Índice temático
Capítulo 1 Antecedentes y Planteamiento del Problema......................................13
1.1- Antecedentes ............................................................................................................... 14
1.2- Localización .................................................................................................................. 15
1.3-Objetivos y Prioridades de la Empresa............................................................................. 16
1.4- Organigrama................................................................................................................. 17
1.5- Visión ........................................................................................................................... 17
1.6- Misión .......................................................................................................................... 17
1.7- Planteamiento del Problema ......................................................................................... 18
1.8- Propuesta de Investigación ............................................................................................ 18
1.9- Objetivos ...................................................................................................................... 19
1.10- Preguntas de Investigación .......................................................................................... 19
1.11- Hipótesis .................................................................................................................... 20
1.12- Limitaciones y Supuestos ............................................................................................. 20
1.13- Relevancia .................................................................................................................. 20
Capítulo 2 Estado del Arte. ...........................................................................................21
2.1- Generador de Tráfico Orgánico ...................................................................................... 22
2.2- Motor de Búsqueda ...................................................................................................... 23
2.3- Posicionamiento ........................................................................................................... 24
2.4- SEO .............................................................................................................................. 24
2.5- Sitemap ........................................................................................................................ 25
2.6- Api ............................................................................................................................... 25
2.6- Metodología Ágil........................................................................................................... 26
2.7- Scrum........................................................................................................................... 26
2.8- Plataformas de desarrollo.............................................................................................. 29
2.9- Lenguajes de programación ........................................................................................... 29
2.9.1- FrontEnd ................................................................................................................ 29
2.9.2- HTML ..................................................................................................................... 29
2.9.3- CSS ........................................................................................................................ 30
2.9.4- Javascript ............................................................................................................... 31
2.9.5- BackEnd ................................................................................................................. 31
2.9.6- Php ........................................................................................................................ 31
7
2.10-Base de datos .............................................................................................................. 32
2.11- MySql ......................................................................................................................... 32
2.12- Frameworks ................................................................................................................ 33
2.12.1- Laravel ................................................................................................................. 33
2.12.2- Vuejs.................................................................................................................... 34
2.13- Herramientas .............................................................................................................. 35
2.13.1- Jira ....................................................................................................................... 35
2.13.2- Git ....................................................................................................................... 36
2.13.3- Bitbucket.............................................................................................................. 37
2.13.4- SublimeText 3 ....................................................................................................... 38
2.13.5- Slack .................................................................................................................... 39
2.13.6- Google Hangout.................................................................................................... 40
2.13.7- Sqlyog .................................................................................................................. 41
2.13.8- Postman ............................................................................................................... 41
2.14- Ambiente de desarrollo ............................................................................................... 42
2.14.1- Homestead........................................................................................................... 42
Capítulo 3 Diseño y Desarrollo. ...................................................................................43
3.1 Diseño ........................................................................................................................... 44
3.1.1 Metodología ............................................................................................................ 44
3.1.2 Diagrama de Colaboración........................................................................................ 44
3.1.3 Interfaz gráfica ........................................................................................................ 46
3.2- Desarrollo..................................................................................................................... 48
3.2.1- Jira......................................................................................................................... 48
3.2.2- Ambiente de desarrollo........................................................................................... 50
3.2.3- Laravel ................................................................................................................... 50
3.2.4- Control de versión .................................................................................................. 56
3.2.5- Testing ................................................................................................................... 56
3.2.6- PHP Unit ................................................................................................................ 56
3.2.7- Postman................................................................................................................. 57
3.2.8 Slack ....................................................................................................................... 58
Conclusiones ....................................................................................................................... 59
Bibliografía .......................................................................................................................... 60
Glosario .............................................................................................................................. 63
8
Índice de Figuras
Figura 1.- Vista en Google maps.......................................................................................... 15
Figura 2.- Vista frontal de la oficina...................................................................................... 15
Figura 3.- Organigrama de Vanillasys.................................................................................. 17
Figura 4.- Logo de Google.................................................................................................... 23
Figura 5.- Logo de Bing. ....................................................................................................... 23
Figura 6.- Logo de Yahoo. .................................................................................................... 23
Figura 7.-Diagrama de SEO. ................................................................................................ 24
Figura 8.-Representación de la funcionalidad de un sitemap. ............................................ 25
Figura 9.-Diagrama de API................................................................................................... 25
Figura 10.-Flujo de trabajo usando scrum. .......................................................................... 26
Figura 11.-Roles de scrum. .................................................................................................. 27
Figura 12.-Reuniones de Scrum. ......................................................................................... 28
Figura 13.-Logo de HTML5. ................................................................................................. 29
Figura 14.-Logo de CSS. ...................................................................................................... 30
Figura 15.-Logo de Javascript. ............................................................................................. 31
Figura 16.-Logo de PHP. ...................................................................................................... 32
Figura 17.-Logo de MySql. ................................................................................................... 33
Figura 18.-Logo de Laravel. ................................................................................................. 34
Figura 19.-Logo de Vue.js. ................................................................................................... 34
Figura 20.-Logo de Jira. ....................................................................................................... 35
Figura 21.- Almacenamiento de datos como imágenes del proyecto. ................................ 36
Figura 22.- Logo de git. ........................................................................................................ 36
Figura 23.- Logo de Bitbucket. ............................................................................................. 37
Figura 24.- Logo de Sublime. ............................................................................................... 38
Figura 25.- Logo de Slack. ................................................................................................... 39
Figura 26.- Logo de Google Hangout................................................................................... 40
Figura 27.- Logo de Sqlyog. ................................................................................................. 41
Figura 28.- Logo de Postman. .............................................................................................. 41
Figura 29.- Logo de Vagrant y Laravel, representación de Laravel Homestead. ............... 42
Figura 30.- Diagrama de colaboración. ................................................................................ 45
Figura 31.- Vista del inicio de sesión. .................................................................................. 46
Figura 32. Vista principal del administrador. ........................................................................ 46
9
Figura 33.- Vista del modulo productos. .............................................................................. 47
Figura 34.- Vista para crear productos................................................................................. 47
Figura 35.- Vista de un producto. ......................................................................................... 47
Figura 36.- Vista para editar un producto. ........................................................................... 48
Figura 37.- Backlog en Jira................................................................................................... 49
Figura 38.- Flujo de las tareas en Jira.................................................................................. 49
Figura 39.- Iniciando homestead con vagrant...................................................................... 50
Figura 40.- Modelo Products en Laravel. ............................................................................. 51
Figura 41.- Vista de Products en Laravel............................................................................. 52
Figura 42.- Controlador de Products en Laravel.................................................................. 52
Figura 43.- Rutas de la api en Laravel. ................................................................................ 53
Figura 44.- Listado de rutas definidas. ................................................................................. 53
Figura 45.- Migración en Laravel.......................................................................................... 54
Figura 46.- Dependencias instalables con npm................................................................... 54
Figura 47.- Dependencias instalables con composer.......................................................... 55
Figura 48.- Interfaz de SourceTree. ..................................................................................... 56
Figura 49.- Comando phpunit............................................................................................... 57
Figura 50.- Pruebas en Postman. ........................................................................................ 57
Figura 51.- Conversación en Slack. ..................................................................................... 58
10
Resumen
En este documento se presenta el desarrollo de un generador de tráfico
orgánico para múltiples dominios como una API (Interfaz de programación de
aplicaciones) que tiene como objetivo proporcionar contenido para aumentar el
tráfico que accede a los dominios que lo utilicen, además define el concepto de
tráfico orgánico y por qué es importante.
El desarrollo del generador se llevó a cabo siguiendo metodologías agiles
de desarrollo e implementando diversas herramientas para agilizar el desarrollo,
así como también siguiendo convenciones de escritura de código para hacer un
código legible.
Palabras clave: Generador de tráfico orgánico, API
11
Abstract
This document details the development of an organic traffic generator for
multiple domains as an API (Application Programming Interface) which its objective
is to give content to increase the organic traffic that reach the domain that is using
the API, also defines the concept of organic traffic and why it is important.
The development of the generator was carried out by following agile
software development methodology and implementing numerous tools to speed up
the development, as well as following code writing conventions to write a more
legible code.
Keywords: Organic traffic generator, API
12
Introducción
El internet es una plataforma extremadamente poderosa y que hoy en día
se utiliza cotidianamente para realizar una gran cantidad de actividades y en todo
momento pues es accesible mediante por computadora como por teléfono celular.
En la inmensidad del internet están las páginas web a las cuales puedes
acceder mediante navegadores, al flujo de acceso se le denomina tráfico web y
significa que tantas visitas adquiere una página web. Las páginas se benefician
del tráfico permitiendo que adquieran popularidad entre los usuarios y de esa
manera ir creciendo.
Una página que requiere mayor tráfico puede utilizar un generador de
tráfico el cual tiene funcionalidades como aumentar el posicionamiento en
buscadores o generar contenido basado en contenido popular para aumentar el
tráfico.
En esta tesina se detalla el desarrollo de un generador de tráfico como
proyecto por parte de la empresa Webforcehq en colaboración con la empresa
VanillaSys se hace mención de la metodología que se utilizó, herramientas,
ambiente de desarrollo, lenguajes de programación y se explica la importancia de
un generador.
13
Capítulo 1
Antecedentes y Planteamiento del
Problema.
14
1.1- Antecedentes
VanillaSys se creó el 14 de Agosto del 2012 gracias a la cooperación entre
Fernando Manzano y Carlos García, en la ciudad de Guadalajara con el propósito
de desarrollar software para facilitar el manejo de las herramientas tecnológicas y
con el fin de aumentar la productividad de las empresas aprovechándose de las
tecnologías emergentes e incluyendo asesoramiento y contrataciones del personal
altamente capacitado.
VanillaSys es una empresa líder en Software y Desarrollo de sistemas, sus
consultores ofrecen servicios para una amplia gama de clientes en todo México y
América del Norte. La empresa se dirige a corporaciones entre pequeña y
medianas empresas (pymes). VanillaSys ofrece una cartera de servicios,
especializada en la conceptualización, la construcción y la entrega de soluciones
que requieren una perspectiva obtenido al trabajar en la reducción de los
productos / servicios de avanzada para los mercados emergentes de rápido
crecimiento [1].
15
1.2- Localización
Atlas F.C
Avenida Patria no. 45136 col. Jardines universidad
Zapopan, Jalisco, México
Figura 2.- Vista frontal de la oficina
Figura 2.- Vista frontal de la oficina
Figura 1.- Vista en Google maps
Figura 1.- Vista en Google maps
16
1.3-Objetivos y Prioridades de la Empresa
La empresa desarrolla soluciones con un sentido estricto de calidad y busca
siempre la mejora continua por medio de la filosofía que comparte la empresa con
la sociedad, para poder permear en las personas un sentido de responsabilidad,
lealtad, honestidad y servicio, logrando con ello una convivencia que nos lleve de
la mano hacia un mejor futuro [2].
Generación de Productos de Software
Basado en las necesidades encontradas en el mercado actual, la empresa
genera soluciones tecnológicas que resuelven problemas reales en la sociedad.
Tales soluciones son generadas mediante un análisis exhaustivo por parte de un
grupo multidisciplinario de profesionales en cada uno de los diferentes problemas
detectados [2].
Creación de Software a la Medida
La empresa se enfoca en cubrir las necesidades tecnológicas que el cliente
requiere para incrementar y agilizar sus procesos; es por esto que siempre se
busca la comunicación y el trato personalizado con el cliente para así alcanzar el
entendimiento total de lo que realmente necesita. De esta manera se logra
obtener una solución de software completamente personalizada e integral [2].
Servicios de Atracción de Talento
Con un personal altamente capacitado en el ramo de las tecnologías, la
empresa logra proveer servicios en todas las etapas del ciclo de vida del proceso
de reclutamiento, HR outsourcing, compensación y beneficios, siempre
cumpliendo con los lineamientos legales [2].
17
1.4- Organigrama
1.5- Visión
Ofrecer servicios de vanguardia en el móvil, aplicaciones web, y televisores
inteligentes, automatización de procesos manuales para ahorrar costes a las
empresas. Con una constante capacitación de su personal, la gestión de un
equipo de profesionales capaces de satisfacer y superar las expectativas de
nuestros clientes, al mismo tiempo que tienen un punto geográficamente
estratégico, los servicios se proporcionan a las empresas nacionales e
internacionales con el mejor costo y la calidad de la mercado [1].
1.6- Misión
Proveer consultoría y análisis para la selección de infraestructura
tecnológica [1].
Figura 3.- Organigrama de Vanillasys
Figura 3.- Organigrama de Vanillasys
18
1.7- Planteamiento del Problema
Actualmente, el mundo se basa en gran medida en la interacción de las
personas a través de la herramienta de comunicación más poderosa de la
actualidad, el internet. Existe una enorme cantidad de páginas web las cuales
puedes encontrar utilizando motores de búsqueda tales como Google, Bing,
Yahoo, entre otros. Un buen posicionamiento en estos motores de búsqueda
permite que páginas sean más fácilmente reconocidas y hace más sencillo el
hacer llegar el contenido de dichas páginas a los usuarios que navegan por el
internet, generando más utilidades y aumentando el tráfico de usuarios en las
mismas.
Para lograr que una página obtenga un buen posicionamiento en dichos
buscadores se requiere seguir ciertas técnicas y lineamientos por lo que la
empresa Webforcehq, empresa socia de Vanillasys situada en Austin Texas,
busca desarrollar un sitio capaz de proveer un servicio que facilite la
implementación de estas técnicas y lineamientos a diferentes dominios que
busquen mejorar su posicionamiento así como el tráfico de visitas registradas a
sus páginas.
1.8- Propuesta de Investigación
Desarrollar un sitio capaz de proporcionar una interfaz de programación de
aplicaciones (API) la cual se encargue de generar tráfico orgánico a las
aplicaciones que la implementen al mismo tiempo que mejorar el posicionamiento
de la misma, obteniendo información de distintas fuentes como lo son videos de
Youtube los cuales pueden ser seleccionados bajo filtros como popularidad o
novedad.
Se emplearán herramientas como los Sitemaps para mejorar el
posicionamiento en motores de búsqueda como Google, y se analizará la
efectividad realizando búsquedas uti lizando palabras clave.
19
1.9- Objetivos
Los siguientes puntos describen el objetivo general y los particulares del
proyecto.
General
Generar trafico orgánico y mejorar el posicionamiento de los dominios web
a las cuales se les está brindando servicio.
Particulares
Configurar el ambiente de trabajo.
Utilizar la version 5.3 del framework de php Laravel.
Utilizar el framework de javascript Vue.
Utilizar SourceTree como interfaz gráfica para Git.
Utilizar Jira como herramienta para la administración del proyecto.
Completar las tareas establecidas en Jira en el marco de tiempo
establecido.
1.10- Preguntas de Investigación
¿Es efectivo el generador de tráfico de acuerdo al posicionamiento?
¿Cuántas palabras clave se pudieron utilizar para poder ver el
posicionamiento de las páginas?
¿La estructura de la página web influye mucho en el posicionamiento?
¿En qué medida influye el uso de Sitemaps en el posicionamiento en
motores de búsqueda?
20
1.11- Hipótesis
El generador de tráfico proporcionará a los dominios que maneja un mayor
flujo de tráfico de red, uti lizando diferentes técnicas como lo es SEO (Search
Engine Optimization) y proporcionando contenido relevante para los usuarios de
manera automática.
1.12- Limitaciones y Supuestos
Se encuentra limitado por las reglas de posicionamiento de Google.
El método que utiliza para mejorar el posicionamiento no garantiza una
mejora inmediata del posicionamiento del dominio.
1.13- Relevancia
En la actualidad, la mayoría de la población utiliza internet por lo que el ser
reconocido fácilmente en esta plataforma tan grande se vuelve indispensable para
empresas o personas que buscan darse a conocer, por lo que el uso del
generador de tráfico orgánico es de gran importancia pues mejora el
posicionamiento en los motores de búsqueda lo cual conlleva a un aumento en el
flujo de personas que accede al dominio que lo implementa.
21
Capítulo 2
Estado del Arte.
22
2.1- Generador de Tráfico Orgánico
El tráfico orgánico es el cual llega a tu página web desde las fuentes o
búsquedas gratuitas como las realizadas en motores de búsqueda como Bing,
Google y Yahoo. Representa un gran rol en el éxito de los negocios por lo tanto su
importancia no puede menospreciarse, de acuerdo a estudios el tráfico orgánico
representa 60% del tráfico total en los sitios web [3].
Existen una gran cantidad de generadores de tráfico en el Internet, los
cuales varían desde generadores de baja calidad que uti lizan bots y proxies para
simular que vienen de alrededor del mundo, hasta sofisticados sistemas de
intercambio de trafico impulsados por gente real y anuncios reales.
Entre los mejores generadores de tráfico actualmente en el mercado se
encuentran los siguientes.
1. FFANET
2. Pro Builder Plus
3. MonsterTraffic
4. TrafficWave
5. One Million Clicks
Es necesario saber la diferencia entre tráfico de alta calidad, red de
intercambio de tráfico y tráfico de bots.
El tráfico de alta calidad consiste en humanos reales interesados en tu
oferta que visitan tu sitio en busca de aprender más, la red de intercambio de
tráfico corresponde a tráfico de relativamente menor calidad aunque consisten de
humanos reales no generan tanta ganancia como el tráfico de alta calidad,
aunque, es mucho mas económico y rápido encontrar este tipo de tráfico que
invertir en SEO(Search Engine Optimization) y mercadotecnia de contenido.
Por último el tráfico de bots es el de peor calidad y del cual no produces
ganancias a menos que vendas publicidad basada en visitas al sitio [4].
23
2.2- Motor de Búsqueda
Los motores de búsqueda son programas que buscan en documentos
palabras claves específicas y regresa una lista con todos los documentos que
muestran coincidencias. El término se uti liza mas comúnmente para describir
sistemas como Google, Bing y Yahoo los cuales permiten al usuario buscar por
documentos en Internet.
El funcionamiento típico de los motores de búsqueda es enviando un
"spider" (programa que busca páginas web) para recopilar tantos documentos
como sea posible, seguido leen los documentos y crean un índice basado en las
palabras que contienen [5].
Figura 4.- Logo de Google.
Figura 4.- Logo de Google.
Figura 5.- Logo de Bing.
Figura 5.- Logo de Bing.
Figura 6.- Logo de Yahoo.
Figura 6.- Logo de Yahoo.
24
2.3- Posicionamiento
Frecuentemente los motores de búsqueda basados que uti lizan "spiders"
encuentran miles o incluso millones de páginas que muestran coincidencias y de
esos resultados solo los 10 más relevantes son mostrados en la primera página.
El objetivo de todo dueño de sitios web es estar dentro de los primeros 10
resultados puesto que la mayoría de los usuarios encuentran lo que buscan dentro
de estos resultados por lo que estar en una posición inferior implica que una gran
cantidad de usuarios utilizando motores de búsqueda no visiten el sitio [6].
2.4- SEO
La Optimización en motor de búsqueda se refiere al proceso de incluir en el
sitio los ingredientes o lineamientos necesarios que los motores de búsqueda
necesitan para sus algoritmos, de esta manera el buscador puede determinar que
dicha página es relevante y por consiguiente elevar su posicionamiento [7].
Figura 7.-Diagrama de SEO.
Figura 7.-Diagrama de SEO.
25
2.5- Sitemap
Los sitemap son documentos que ayudan a los motores de búsqueda a
entender los sitios web mientras lo están recorriendo. Están compuestos por
elementos XML los cuales informan las url disponibles para ser recorridas en el
sitio, de esta manera permites al buscador conocer la estructura del sitio y así
evitar que no encuentre alguna página y no la incluya en el índice [8].
2.6- Api
Las interfaces de programación de aplicaciones son un conjunto de
comandos, funciones, protocolos y objetos que los programadores pueden utilizar
para interactuar con un sistema externo. En sitios web, por ejemplo, se uti lizan
para acceder a contenido de un sitio externo.
Figura 8.-Representación de la
funcionalidad de un sitemap.
Figura 8.-Representación de la funcionalidad de un
sitemap.
Figura 9.-Diagrama de API
Figura 9.-Diagrama de API
26
2.6- Metodología Ágil
Las metodologías ágiles son una serie de técnicas para la gestión de
proyectos que han surgido como contraposición a los métodos clásicos de gestión.
Usando las metodologías ágiles se pretende minimizar costos aumentando la
eficiencia de los involucrados en el proyecto [10].
2.7- Scrum
Scrum es un marco de trabajo para aprender sobre el trabajo y los procesos
que se usan para hacerlo, introduce ciclos de retroalimentación permitiendo
inspeccionar y adaptar el producto a realizar y los procesos utilizados.
Scrum emplea las etapas de las metodologías tradicionales dentro de
iteraciones de longitud establecida llamadas sprint. Cada sprint contiene una
combinación de análisis, diseño, codificación, integración, pruebas y en algunos
casos lanzamiento.
El equipo de trabajo busca desde el inicio crear un producto funcional
aunque resulte ser pequeño, de esta manera, al final de cada sprint se realiza la
retroalimentación con el cliente para así mejorar el desarrollo del producto pues el
cliente requiere ver el producto y así determinar si es lo que realmente requiere.
Figura 10.-Flujo de trabajo usando scrum.
Figura 10.-Flujo de trabajo usando scrum.
27
La estructura de scrum se divide en roles, artefactos y reuniones. Existen
tres roles para los involucrados en el proyecto.
Dueño del producto (Product Owner): Es quien se encarga de tomar
decisiones se enfoca mas en el qué en lugar de en el cómo.
Equipo de desarrollo Scrum (Scrum Dev Team): Es un grupo
pequeño de personas (entre 4 a 9 personas) con distintas
habilidades y especialidades trabajando en equipo. Se enfocan en el
cómo.
Maestro Scrum (ScrumMaster): No tiene autoridad sobre el equipo
de desarrollo. Es un facilitador, facilita los procesos y enseña al
equipo a usar scrum.
Los artefactos son la lista de objetivos y la lista de objetivos del sprint.
Lista de objetivos (Product Backlog): Es la lista de todo lo que se va
a realizar ordenado por prioridades establecidas por el dueño del
producto.
Lista de objetivos del sprint (Sprint Backlog): Representa los
objetivos que se requieren realizar durante el sprint y como se van a
realizar.
Figura 11.-Roles de scrum.
Figura 11.-Roles de scrum.
28
Finalmente existen 4 diferentes reuniones definidas por scrum.
Reunión de planeación del sprint (Sprint Planning Meeting): En esta
reunión el dueño del producto y el equipo de desarrollo definen
cuales objetivos del backlog serán seleccionados para realizar en el
sprint.
Reunión diaria (Daily Scrum): Se reporta el progreso realizado, las
tareas en progreso o incluso problemas en el desarrollo, entre los
miembros del equipo de trabajo, no hacia los jefes sino hacia los
compañeros.
Reunión de retroalimentación del Sprint (Sprint Review Meeting): Se
presenta una versión funcional del producto al dueño de producto y a
los interesados, el dueño decide cuales objetivos están completos y
cuáles no.
Reunión retrospectiva del sprint (Sprint Retrospective Meeting): Se
habla sobre los procesos del equipo de desarrollo, sobre el trabajo
en equipo, comúnmente se habla sobre que fue bien y que se puede
mejorar [11].
Figura 12.-Reuniones de Scrum.
Figura 12.-Reuniones de Scrum.
29
2.8- Plataformas de desarrollo
El desarrollo del generador de tráfico se realizara utilizando un conjunto de
lenguajes de programación, herramientas y frameworks.
2.9- Lenguajes de programación
Los lenguajes de programación a utilizar se pueden clasificar en 2 enfoques
Front-End para el lado del cliente y Back-End para el lado del servidor.
2.9.1- FrontEnd
Corresponde al conjunto de tecnologías que están involucradas en el
producto que es mostrado a los clientes, algunos lenguajes que se utilizan en el
desarrollo de Front-End son HTML, CSS y Javascript. Se le conoce como diseño
web [12].
2.9.2- HTML
HTML (Hyper Text Markup Language) es un lenguaje enfocado a la
creación de sitios web para posteriormente poder ser vistos por los usuarios a
través del internet. Es relativamente sencillo de aprender y bastante poderoso en
cuestión de lo que permite crear. HTML se compone por varios términos que a
continuación serán explicados.
El Hipertexto (Hyper Text) es el método por el cual los usuarios se mueven
a través de la red y se refiere al texto especial que puedes presionar y te traslada
a cualquier lado de la red a través de links.
Marca (Markup) es lo que las etiquetas HTML hacen al texto dentro de
ellas, lo marcan como un especifico tipo de texto.
Se le define como lenguaje pues contiene palabras reservadas y sintaxis
especifica como cualquier otro lenguaje [13].
Figura 13.-Logo de HTML5.
Figura 13.-Logo de HTML5.
30
2.9.3- CSS
CSS (Cascade Style Sheet) al español significa hojas de estilo en cascada
y se utiliza para darle la presentación a las páginas web, en otras palabras, se
encarga de hacer atractivo visualmente el contenido de la página para los usuarios
que la visitan.
Se puede separar el esti lo creado con css en un archivo diferente al del
contenido de la página web por lo que ofrece mayor control y segmentación de
estilos.
Al externalizar los estilos y segmentarlos es posible faci litar el
mantenimiento y los posibles cambios a realizar en un futuro pues es más sencillo
solo modificar un archivo que modificar posibles miles de archivos html.
Ofrece además una disminución en el consumo de ancho de banda pues
los estilos se almacenan en cache desde la primera petición a la página,
permitiendo que no tengan que ser cargados cada vez que se acceda a la página
desde el inicio. Incluso al separar el estilo del contenido permite al dueño de la
página reutilizar el contenido para diferentes propósitos. [14].
Figura 14.-Logo de CSS.
Figura 14.-Logo de CSS.
31
2.9.4- Javascript
Es un lenguaje de programación uti lizado para la creación de páginas web
interactivas, describe el comportamiento de dichas páginas, se ejecuta en el
equipo del usuario más específicamente en el navegador.
Al igual que CSS es posible separar los scripts de javascript en archivos
diferentes al del contenido html, permitiendo así la reuti lización de código y mayor
facilidad al mantener el sitio. Los archivos separados de javascript tienen una
terminación .js y se vinculan al html utilizando una etiqueta llamada <script>, de
esta manera se puede incrustar en muchos distintos archivos [15].
2.9.5- BackEnd
El Back-End son las tecnologías y lenguajes que se ejecutan del lado del
servidor y al cual el usuario no tiene acceso, comprende lenguajes como php e
interacciona con el sistema gestor de base de datos.
2.9.6- Php
Preprocesador de Hipertexto (HyperText Preprocessor) es un lenguaje web
que puede incrustarse en lenguaje HTML. Cuando se accede a una página php el
código es leído o traducido por el servidor en el cual la página se encuentra
almacenada.
Las funciones de php por lo general regresan código html y puesto que el
código php se ejecuta antes de que la página sea cargada y es convertido a html
los usuarios no son capaces de visualizar el código php.
Figura 15.-Logo de Javascript.
Figura 15.-Logo de Javascript.
32
Php se basa mucho en de otros lenguajes tales como C, Python y Perl. Sin
embargo, php incluye diversas funciones y características únicas con el objetivo
de permitir a los desarrolladores web crear páginas dinámicamente fácil y
rápidamente [16].
.
2.10-Base de datos
Las bases de datos son colecciones de datos y existen diversos sistemas
gestores de base por ejemplo Mysql el cual es un sistema gestor de base de datos
relacional (RDBMS).
2.11- MySql
MySql es compatible en básicamente cualquier plataforma, desde Linux,
Unix hasta Windows, y aunque puede ser uti lizado en un sin fin de aplicaciones,
se asocia más frecuentemente con aplicaciones basadas en web y es una parte
esencial del conjunto de sistemas mayormente utilizados en desarrollo web LAMP
[17].
Cabe destacar que MySql es de carácter gratuito por lo que utilizarlo resulta
considerablemente económico.
Figura 16.-Logo de PHP.
Figura 16.-Logo de PHP.
33
2.12- Frameworks
Los frameworks son esquemas o patrones a seguir con diferentes lenguajes
de programación para el desarrollo de software y los hay tanto para lenguajes
como php y javascript algunos ejemplos son Laravel para php y Vue para
javascript.
2.12.1- Laravel
Laravel es uno de los mejores frameworks de desarrollo de aplicaciones en
php, emplea el patrón de diseño modelo vista controlador y está ampliamente
documentado, incluso existen video cursos gratuitos para aprendizaje de este
framework.
Los principales elementos de Laravel son el Router, relaciones Eloquent
para los modelos con la base de datos, swiftmailer para el envío de correos, blade
files que facilitan la incrustación de código php dentro de html y permite hacer
templates de manera muy senci lla, además un sistema para crear migraciones a la
base de datos mediante código php.
Laravel provee de muchas herramientas muy útiles desde su instalación
incluso si requieres plugins es compatible con composer para facilitar la instalación
[18].
Figura 17.-Logo de MySql.
Figura 17.-Logo de MySql.
34
2.12.2- Vuejs
Vue.js es una librería de javascript que ayuda a construir aplicaciones web
utilizando el patrón de arquitectura modelo vista vista-modelo y que a simple vista
parece ser similar a Angularjs, sin embargo tiene la característica que es mucho
más sencillo y fácil de aprender [19].
Vue.js ofrece muchas de las funciones que ofrece Angular y de manera más
sencilla, cuenta con una característica de gran utilidad llamada two-way binding el
cual te permite modificar el elemento seleccionado y estos cambios se ven
reflejados en tiempo real, algo bastante útil.
En general Vue.js se utiliza para proyectos más ligeros, para proyectos más
robustos que requieran más potencia es recomendable utilizar angularjs.
Figura 18.-Logo de Laravel.
Figura 18.-Logo de Laravel.
Figura 19.-Logo de Vue.js.
Figura 19.-Logo de Vue.js.
35
2.13- Herramientas
Existen diversas herramientas para facilitar el trabajo del equipo de
desarrollo, como lo son Jira, Git, Bitbucket, SublimeText 3, Slack y Google
Hangout.
2.13.1- Jira
Es un producto desarrollado por atlassian que provee seguimiento de bugs,
seguimiento de issues y funciones de gestión de proyectos, se puede configurar
para adoptar la metodología scrum, de forma que se gestiona el proyecto en
backlogs, sprints y tasks.
Los componentes básicos de jira son los siguientes:
Issues: Cualquier task, bug, peticiones, básicamente cualquier
elemento a ser creado se le considera issue.
Project: Colección de issues.
Workflow: Son los pasos a seguir para el cumplimiento de las issues
desde el inicio hasta la completa creación del proyecto.
Figura 20.-Logo de Jira.
Figura 20.-Logo de Jira.
36
2.13.2- Git
Git es un sistema de control de versiones que se caracteriza por el uso de
snapshots (imagen instantánea) que es la manera en que trata los datos.
Conceptualmente la mayoría de los sistemas de control de versiones utilizan una
lista de archivos basada en cambios.
Git piensa en los datos como un conjunto de snapshots de un sistema de
archivos miniatura. Cada vez que se realiza un commit o se guarda el estado del
proyecto en git, lo que hace es básicamente agarrar la imagen de como lucen los
archivos en ese momento y almacena una referencia a esa imagen. Para mayor
eficiencia si los archivos no han cambiado git no almacena ese archivo de nuevo,
lo que hace es vincular con un link a la imagen anterior idéntica del archivo que ya
ha sido almacenada anteriormente. Básicamente git piensa sobre sus datos como
un flujo de imágenes.
Figura 21.- Almacenamiento de datos
como imágenes del proyecto.
Figura 21.- Almacenamiento de datos como imágenes del proyecto.
Figura 22.- Logo de git.
Figura 22.- Logo de git.
37
2.13.3- Bitbucket
Bitbucket es un sistema para almacenamiento en la web de los repositorios
de versión de control propiedad de Atlassian y es el competidor de github.
Puede utilizar Mercurial o Git como el sistema de control de versiones,
ofrece servicios tanto gratuitos como de paga. Gratuitamente ofrece cuentas con
repositorios privados infinitos con posibilidad de invitar hasta a 5 usuarios a dichos
repositorios, está escrito en Python utilizando el framework web Django.
La principal ventaja que tiene Bitbucket por sobre Github es la posibilidad
de tener repositorios privados de manera gratuita, si bien hay ocasiones en las
que se quiere mostrar al mundo tu proyecto hay proyectos que necesitan ser
guardados de manera privada [22].
Figura 23.- Logo de Bitbucket.
Figura 23.- Logo de Bitbucket.
38
2.13.4- SublimeText 3
SublimeText 3 es un sofisticado editor de texto para código, marcas y
prosas, cuenta con una interfaz extremadamente adaptable además de increíbles
características y un funcionamiento impresionante.
Es completamente personalizable, puedes cambiar el estilo de la interfaz,
añadir atajos, plugins, paquetes, y muchas cosas más.
Un ejemplo de atajo es poder cambiar entre archivos de proyectos
utilizando el atajo CTRL+P en Windows.
Lo mejor de todo es que es multiplataforma pues se encuentra disponible
tanto para Windows, OS X y distribuciones de Linux como Ubuntu.
Figura 24.- Logo de Sublime.
Figura 24.- Logo de Sublime.
39
2.13.5- Slack
Slack es un sistema de mensajería instantánea para equipos de trabajo y
promueve la comunicación entre ellos.
Algunas funcionalidades básicas de slack son los canales, canales
privados, mensajes directos, preferencias, compartimiento de archivos y media,
notificaciones, búsquedas entre otras más.
Slack es gratuito para pequeñas empresas o equipos de trabajo, aunque
también ofrece una solución de paga más completa para aprovecharlo por
completo.
Lo que distingue a slack de los demás sistemas de mensajería instantánea
es la posibilidad de integración de diferentes plataformas como Twitter, Github,
Google Drive, etc. O incluso crear tus propias integraciones con bots
personalizados que responden a conversaciones dentro de canales donde el bot
esté incluido [23].
Figura 25.- Logo de Slack.
Figura 25.- Logo de Slack.
40
2.13.6- Google Hangout
Google Hangout es un servicio gratuito de video chat de Google que
permite tanto conversaciones uno a uno como conversaciones grupales con hasta
10 personas en un mismo chat.
Aunque un tanto similar a Skype, FaceTime o Facebook Video Chat,
Google Hangout se enfoca más en interacción grupal cara a cara a cara en lugar
de conversaciones uno a uno y utiliza sofisticada tecnología para cambiar
automáticamente el enfoque hacia la persona que se encuentra conversando en el
momento.
Puede utilizar tanto en computadoras o laptops como en dispositivos
móviles que empleen el sistema operativo Android o iOS, puedes compartir
archivos, imágenes, videos de YouTube. Incluso ofrece una opción para transmitir
en vivo una conferencia grupal a todos los usuarios de la red llamada "Hangouts
on Air" [24].
Figura 26.- Logo de Google Hangout.
Figura 26.- Logo de Google Hangout.
41
2.13.7- Sqlyog
Sqlyog es la interfaz gráfica más popular para Mysql, ofrece muchas
poderosas herramientas para manejar bases de datos de Mysql.
Compatible con todas las versiones de Windows desde Windows Xp, así
como también en Windows Server. Es compatible con cualquier versión de Mysql
superior a la 5 [25].
Al ser una interfaz gráfica facilita los procedimientos de
ejecución/configuración de la base de datos.
2.13.8- Postman
Postman es un cliente REST que se ejecuta como un complemento de
Google Chrome, es especialmente útil para interactuar con REST APIs pues
permite simular rápidamente solicitudes get, post, put/patch, delete. Permite
guardar una colección de solicitudes así como establecer ambientes específicos
[26].
Figura 27.- Logo de Sqlyog.
Figura 27.- Logo de Sqlyog.
Figura 28.- Logo de Postman.
Figura 28.- Logo de Postman.
42
2.14- Ambiente de desarrollo
El ambiente de desarrollo se refiere al conjunto de tecnologías involucradas
para el desarrollo del proyecto, desde el sistema operativo hasta los lenguajes de
programación empleados y las herramientas a utilizar.
2.14.1- Homestead
Es la caja pre empaquetada de vagrant oficial de Laravel que provee todo el
ambiente de desarrollo necesario para empezar el desarrollo de un proyecto en
Laravel sin necesidad de instalar individualmente php, un servidor web, base de
datos entre otras cosas. Permite evadir problemas de compatibilidad al ser una
caja con todo lo necesario se puede instalar en diferentes equipos. [27]
Homestead incluye el siguiente software en su instalación.
Ubuntu 16.04
Git
PHP 7.0
Nginx
MySQL
MariaDB
Sqlite3
Postgres
Composer
Node (With PM2, Bower, Grunt, and Gulp)
Redis
Memcached
Beanstalkd
Figura 29.- Logo de Vagrant y Laravel,
representación de Laravel Homestead.
Figura 29.- Logo de Vagrant y Laravel, representación de Laravel Homestead.
43
Capítulo 3
Diseño y Desarrollo.
44
3.1 Diseño
3.1.1 Metodología
Se escogió Scrum como la metodología a emplear en el desarrollo del
proyecto pues se basa principalmente en la comunicación efectiva entre todos los
elementos involucrados, en cortas iteraciones, permitiendo así, obtener
retroalimentación durante el proceso de desarrollo haciéndolo más eficiente y
eficaz.
3.1.2 Diagrama de Colaboración
El siguiente diagrama representa la relación entre los elementos que
interactúan con el generador de tráfico.
Request: Petición del usuario a los dominios.
Dominios: Sitios provistos de funcionalidad por la API del generador de
tráfico.
API: Provee funcionalidades, contenido y datos a los dominios, utiliza tanto
servicios personalizados como de terceros.
Servicios de terceros: Desarrollados por terceros, complementan la API.
Servicios personalizados: Funcionalidades especificas necesarias para que
la API funcione, comunicación con la base de datos.
El usuario realiza una petición en cualquier dominio, que sea provisto de
contenido por la API del proyecto, la petición es recibida por la API la cual realiza
sus funciones internas y procesa la petición para responder de la manera
adecuada.
45
Figura 30.- Diagrama de colaboración.
Figura 30.- Diagrama de colaboración.
46
3.1.3 Interfaz gráfica
Para poder manipular la información que proporciona la API es necesario
ingresar al administrador del proyecto el cual se ve representado en la siguiente
imagen.
Una vez que se ingresa al administrador se pueden observar el menú con
los módulos del proyecto los cuales contienen el CRUD (Create, Read, Update,
Delete) operaciones básicas para cada elemento de la API.
Figura 31.- Vista del inicio de sesión.
Figura 31.- Vista del inicio de sesión.
Figura 32. Vista principal del administrador.
Figura 32. Vista principal del administrador.
47
Cada elemento tiene sus propiedades únicas por lo que cada modulo es
diferente, sin embargo comparten similitudes, las siguientes imágenes ilustran el
CRUD del módulo productos así como el flujo básico de cada modulo.
Figura 33.- Vista del modulo productos.
Figura 33.- Vista del modulo productos.
Figura 34.- Vista para crear productos.
Figura 34.- Vista para crear productos.
Figura 35.- Vista de un producto.
Figura 35.- Vista de un producto.
48
3.2- Desarrollo
El equipo de desarrollo es compuesto por 2 desarrolladores y un diseñador.
Se hizo uso de software para facilitar la administración del proyecto como Jira, el
proyecto se desarrolla en PHP siguiendo el framework Laravel y utilizando el
ambiente de desarrollo Homestead.
Para facilitar el trabajo y agilizar el proceso de unir los avances de cada
desarrollador se optó por utilizar un sistema de control de versiones, Git.
Se definieron y efectuaron pruebas para garantizar el funcionamiento del
proyecto en cada etapa del desarrollo.
3.2.1- Jira
Se escogió Jira como el software para la administración del desarrollo del
proyecto por su compatibilidad con la metodología ágil y por su gran cantidad de
funciones que facilitan a los líderes de proyecto comunicarse con los
desarrolladores, asignarles tareas, estimar el tiempo invertido, priorizar ciertas
tareas, entre otras funciones.
Figura 36.- Vista para editar un producto.
Figura 36.- Vista para editar un producto.
49
Figura 37.- Backlog en Jira
Figura 37.- Backlog en Jira
Figura 38.- Flujo de las tareas en Jira
Figura 38.- Flujo de las tareas en Jira
50
3.2.2- Ambiente de desarrollo
Se decidió utilizar homestead como el ambiente de desarrollo pues es el
recomendado por Laravel y al utilizarlo se previenen problemas de compatibilidad
y se facilita la configuración del ambiente local de desarrollo.
3.2.3- Laravel
Se escogió Laravel como el framework de desarrollo php pues incorpora
bastantes funcionalidades que facilitan el desarrollo, además que su curva de
aprendizaje es bastante simple, ofrece atajos en la creación de elementos y tiene
una documentación muy amplia, además de un gran número de video tutoriales
que aceleran el aprendizaje.
Se uti liza la versión 5.3 pues al inicio del proyecto es la versión mas actual y
contiene nuevas funciones y elementos que facilitan aun más el desarrollo.
Figura 39.- Iniciando homestead con vagrant
Figura 39.- Iniciando homestead con vagrant
51
Laravel uti liza el patrón de Modelo Vista Controlador, usa los modelos como
los elementos, los controladores como la funcionalidad interna y la vista que el
usuario observa.
Figura 40.- Modelo Products en Laravel.
Figura 40.- Modelo Products en Laravel.
52
Figura 41.- Vista de Products en Laravel.
Figura 41.- Vista de Products en Laravel.
Figura 42.- Controlador de Products en Laravel.
Figura 42.- Controlador de Products en Laravel.
53
Mediante rutas los usuarios pueden interactuar con los controladores y los
controladores con los modelos formando así el flujo de trabajo de la aplicación
desarrollada en Laravel.
Estas rutas pueden ser personalizadas pero laravel sugiere seguir la
convención de RESTful, y el gran beneficio que otorga laravel en caso de seguir
esta convención es que tiene un generador de controlador que agiliza la creación
de los controladores y los métodos que contiene.
Laravel permite crear o modificar fácilmente la base de datos mediante
migraciones, y que por fortuna laravel ofrece un generador integrado que facilita la
creación de las mismas.
Figura 43.- Rutas de la api en Laravel.
Figura 43.- Rutas de la api en Laravel.
Figura 44.- Listado de rutas definidas.
Figura 44.- Listado de rutas definidas.
54
Laravel utiliza muchas dependencias tanto de javascript como de php las
cuales pueden ser instaladas mediante composer y npm mismos que vienen
instalados por defecto en homestead.
Figura 45.- Migración en Laravel.
Figura 45.- Migración en Laravel.
Figura 46.- Dependencias instalables con npm.
Figura 46.- Dependencias instalables con npm.
55
Figura 47.- Dependencias instalables con composer.
Figura 47.- Dependencias instalables con composer.
56
3.2.4- Control de versión
Se utiliza git como el sistema de control de versiones por la rapidez y la
compatibilidad que tiene con los sistemas así como la facilidad de aprender a
utilizarlo.
El servidor donde se aloja el repositorio es de Atlassian Bitbucket por sus
planes gratuitos para equipos pequeños, la rapidez y seguridad del servidor.
Además se utiliza el software SourceTree para manipular mediante una interfaz
gráfica git.
3.2.5- Testing
Se utilizaron PHP Unit y Postman, dos herramientas para poner a prueba la
funcionalidad de la API,
3.2.6- PHP Unit
Las pruebas realizadas en PHP Unit se definen mediante código dentro del
proyecto y se ejecuta el comando phpunit para iniciarlas y tienen como objetivo
probar que el sistema funcione correctamente pese a cambios que se realicen en
el código.
Figura 48.- Interfaz de SourceTree.
Figura 48.- Interfaz de SourceTree.
57
3.2.7- Postman
Las pruebas efectuadas en Postman simulan las peticiones realizadas por
usuarios reales y permite poner a prueba lo que el usuario realiza desde un
enfoque más gráfico.
Se realizaron pruebas para garantizar que cada operación del CRUD se
efectúa correctamente, produciendo en total 55 pruebas.
Figura 49.- Comando phpunit.
Figura 49.- Comando phpunit.
Figura 50.- Pruebas en Postman.
Figura 50.- Pruebas en Postman.
58
3.2.8 Slack
Slack fue escogido como el software de mensajería por el cual el equipo se
comunica por su rapidez y compatibilidad tanto en sistemas operativos de
escritorio y móviles, así como web.
Figura 51.- Conversación en Slack.
Figura 51.- Conversación en Slack.
59
Conclusiones
Se concluye que el generador de tráfico es una herramienta sumamente útil
pues proporciona tanto creación de contenido de alto interés entre los usuarios
que pueden visitar el dominio como mejoramiento de posicionamiento en
buscadores populares, produciendo así, un incremento en el tráfico orgánico del
sitio.
Lo cual resulta en un incremento en las ganancias del sitio que incorpore un
generador de tráfico.
En lo que respecta al desarrollo el framework de Laravel resulta
increíblemente útil pues tiene integradas muchas funciones y comandos que
facilitan el trabajo al desarrollador, además de que sigue una sintaxis muy
semántica que hace fácilmente entendible el código.
60
Bibliografía
[1] VanillaSys, About [En línea]. México: Quetzal Software S.C, 2016 Disponible
en: http://vanillasys.com/?page=about.
[2] F. Manzano, Objeto Social. México: Quetzal Software S.C, 2012.
[3] S. Krohn, Organic Traffic and Why it is Important [En línea]. LinkedIn, 2016
Disponible en: https://www.linkedin.com/pulse/organic-traffic-why-important-krohn-
online-traffic-generation
[4] J Parsons, The top 10 traffic generator applications on the web [En línea].
Growtraffic, 2015 Disponible en: http://growtraffic.com/blog/2015/01/top-10-traffic-
generator-applications-web
[5] V Beal. Search engine [En línea]. Webopedia, Disponible en:
http://www.webopedia.com/TERM/S/search_engine.html
[6] SEW Staff. Search engine placement tips [En línea]. Search Engine Watch,
2007 Disponible en: https://searchenginewatch.com/sew/news/2067083/search-
engine-placement-tips
[7] Common Craft, Search Engine Land, What Is Search Engine Optimization /
SEO [En línea]. 2011. Disponible en: https://www.youtube.com/watch?v=hF515-
0Tduk
[8] T. Sisson, What is a XML Sitemap and how do I create one? [En línea].
Inmotion hosting, 2014. Disponible en:
http://www.inmotionhosting.com/support/website/google-tools/what-is-a-xml-
sitemap-and-how-do-i-create-one
[9] P. Christensson, API Definition [En línea]. TechTerms, 2016. Disponible en:
http://techterms.com/definition/api
[10] R. Raya, ¿Qué son las metodologías ágiles? [En línea]. LeanMonitor, 2014.
Disponible en: http://blog.leanmonitor.com/es/que-son-las-metodologias-agiles/
61
[11] Collabnet, Scrum Training Series | Introduction to scrum [En línea]. CollabNet
,2016. Disponible en:
http://www.collab.net/sites/default/fi les/videos/Intro_to_scrum/Intro_to_scrum.htm
[12] C. Kavourgias, What's the difference between Front-End and Back-End [En
línea]. DigitalAutors, 2014. Disponible en: http://blog.digitaltutors.com/whats-
difference-front-end-back-end/
[13] R. Shannon, What is HTML? [En línea]. HTML Source, 2012. Disponible en:
http://www.yourhtmlsource.com/starthere/whatishtml.html
[14] A. Roberts, What is CSS? [En línea]. Sitepoint 2014. Disponible en:
https://www.sitepoint.com/web-foundations/css/
[15] S. Chapman, What is Javascript? [En línea]. About tech, 2016. Disponible en:
http://javascript.about.com/od/reference/p/javascript.htm
[16] P. Christensson, PHP Definition [En línea]. Techterms 2016. Disponible en:
http://techterms.com/definition/php
[17] M. Rouse, Mysql [En línea]. TechTarget. Disponible en:
http://searchenterpriselinux.techtarget.com/definition/MySQL
[18] A. Batlle. What is Laravel Framework [En línea]. Quora, 2014. Disponible en:
https://www.quora.com/What-is-Laravel-framework
[19] A. Hathibelgal, Getting Started With Vue.js [En línea]. SitePoint 2016.
Disponible en: https://www.sitepoint.com/getting-started-with-vue-js/
[20] J. Ruby, What is Jira [En línea]. Aashtobr 2015. Disponible en:
http://aashtobr.org/wp-content/uploads/2015/06/What-is-JIRA.pdf
[21] S. Chacon. Getting Started - Git Basics [En línea]. Git, 2009. Disponible en:
https://git-scm.com/book/en/v2/Getting-Started-Git-Basics
[22] W. Ritson, What is bitbucket? [En línea]. Quora, 2015. Disponible en:
https://www.quora.com/What-is-bitbucket
62
[23] SublimeText, Sublime Text [En línea].SublimeText. Disponible en:
https://www.sublimetext.com/
[24] V. Beal, Google Hangouts [En línea]. Webopedia. Disponible en:
http://www.webopedia.com/TERM/G/google_hangouts.html
[25] Sqlyogkb, What is Sqlyog [En línea], Webyog, 2015. Disponible en:
http://sqlyogkb.webyog.com/article/166-what-is-sqlyog
[26] J. Savill, What is Postman and how do I use it with Azure? [En línea]. Windows
IT Pro, 2015. Disponible en: http://windowsitpro.com/azure/q-what-postman-and-
how-do-i-use-it-azure
[27] Laravel, Laravel Homestead [En línea]. Laravel, 2016. Disponible en:
https://laravel.com/docs/5.3/homestead
63
Glosario
API: (Application Programming Interface) conjunto de comandos, funciones,
protocolos y objetos que los programadores pueden utilizar para interactuar con un
sistema externo.
Browser: Un navegador o navegador web es un software que permite el acceso a
Internet, interpretando la información de archivos y sitios web para que éstos
puedan ser leídos.
Composer: Es un manejador de dependencias de PHP, permite declarar las
librerías o paquetes requeridos por el proyecto y los instala/actualiza por ti.
Dependencias: Conjunto de paquetes de software externo requerido por el
framework para su funcionamiento.
Dominio: Grupo de computadoras y dispositivos en red que son administrados
bajo el mismo protocolo.
Framework: Esquemas o patrones a seguir con diferentes lenguajes de
programación para el desarrollo de software
HTML: HyperText Markup Language (lenguaje de marcas de hipertexto), hace
referencia al lenguaje de marcado para la elaboración de páginas web.
Metodología ágil: Serie de técnicas para la gestión de proyectos que han surgido
como contraposición a los métodos clásicos de gestión.
npm: Es el manejador de paquetes por defecto para Node.js, un entorno de
ejecución para JavaScript.
Pagina web: Documento o información electrónica capaz de contener texto,
sonido, vídeo, programas, enlaces, imágenes, y muchas otras cosas, adaptada
para la llamada World Wide Web.
64
Pruebas Unitarias: Se utiliza para comprobar que un método concreto del código
de producción funciona correctamente. Una prueba por orden se utiliza para
ejecutar otras pruebas en un orden especificado.
SEO: (Search Engine Optimization) es la práctica de utilizar un rango de técnicas
con el fin de mejorar la posición de un sitio web en los resultados de los
buscadores para unos términos de búsqueda concretos.
Sitemap: Listado compuesto de elementos XML de las páginas web de un sitio
web accesible por buscadores y usuarios.
Sitio web: es un conjunto de páginas web desarrolladas en código html,
relacionadas a un dominio de Internet el cual se puede visualizar en la World
Wide Web mediante los navegadores web o también llamados browser.
Web crawler: Programa que visita sitios web y lee el contenido de sus páginas
con el proposito de crear registros para el indice de un motor de busqueda.
XML: eXtensible Markup Language, es un lenguaje de marcas desarrollado por el
World Wide Web Consortium utilizado para almacenar datos en forma legible.
