SlideShare una empresa de Scribd logo
1 de 17
PHONEGAP
Que es PhoneGap?
• Framework para el desarrollo de Aplicaciones móviles.
• Tecnologías:
APIS PhoneGap
• Cámara
• Acelerómetro
• GPS
• Notificaciones
• Almacenamiento
• Sistemas de Ficheros
• Compas
• Media
Sistemas Operativos
Software
Crear Aplicación con Dreamweaver
• Crear sitio nuevo: (conjunto de archivos que utiliza el sitio web.)
Crear Aplicación con Dreamweaver
• Para escoger una plantilla por defecto seleccionamos:
Crear Nuevo-más-Página de Muestra-Mobile Starters-
jQuery Mobile(local):
Crear Aplicación con Dreamweaver
• Observamos que se nos ha cargado un documento HTML y también podemos ver como es la diseño de la plantilla:
Crear Aplicación con Dreamweaver
• Guardamos la plantilla como Index.html, cuando demos a guardar se nos pedirá unos archivos a copiar a nuestra carpeta ,
que los necesitaremos más adelante a la hora de compilar el código:
Crear Aplicación con Dreamweaver
• A partir de aquí ya podemos ir creando nuestra aplicación poniendo imágenes, poner más menús si son necesarios,
submenús….
• Para cambiar colores o poner estilos a nuestra hoja lo podemos hacer en la pestaña de CSS que ya viene por defecto:
Crear Aplicación con Dreamweaver
• Nuestra aplicación ya esta terminada:
Crear Aplicación con Dreamweaver
• Una vez tengamos la aplicación vamos a modificar el archivo principal “config.xml”. Para que nos salga el archivo hay que ir
a la pestaña sitio-servicio de phonegap build- servicio de phonegap build. Se nos abre una ventana donde tendremos que
registrar un Id de Adobe:
Crear Aplicación con Dreamweaver
• Se nos abre otra ventana donde tendremos
que dar a crear como nuevo proyecto y continuar:
Crear Aplicación con Dreamweaver
• Vamos a configurar el archivo “config.xml”, para ello ir a la dirección de abajo, donde lo explica a la perfección
http://docs.build.phonegap.com/en_US/configuring_basics.md.html
• Una vez tengamos el archivo vamos a la web de phonegap build, creeamos una cuenta adobe. Caundo ya nos hayamos
regsitrado nos aparecerá la siguiente ventana:
Crear Aplicación con Dreamweaver
• En upload zip file subimos el rar de nuestra aplicación una vez subida nos saldrá la siguiente ventana:
• Al subirlo se crea un código QR que será la instalación de nuestra aplicación (.apk). Con un software como QR Droid para
los usuarios de android, escaneamos el código y lo guardamos. Después lo instalamos y ya tendremos nuestra apliación para
usarla en nuestros dispositivos.
Bibliografía
• Video Tutorial:
https://www.youtube.com/watch?v=aQfGcYHxpGI
• Manual:
http://docs.build.phonegap.com/en_US/#googtrans(en)
FIN

Más contenido relacionado

La actualidad más candente

Trabajo practico Nº13
Trabajo practico Nº13Trabajo practico Nº13
Trabajo practico Nº13
rodolfogonella
 
Trabajo Practico Nº13
Trabajo Practico Nº13Trabajo Practico Nº13
Trabajo Practico Nº13
rodolfogonella
 
Dreamweaver- mercedes garcia
Dreamweaver- mercedes garcia Dreamweaver- mercedes garcia
Dreamweaver- mercedes garcia
Mercedes Garcia
 
Procesos para colocar marcos, hipervinculo y video en dw
Procesos para colocar marcos, hipervinculo y video en dwProcesos para colocar marcos, hipervinculo y video en dw
Procesos para colocar marcos, hipervinculo y video en dw
dcal2897
 
Trabajo practico 13
Trabajo practico 13Trabajo practico 13
Trabajo practico 13
Tomas Jorrat
 
Tutorial weebly
Tutorial weeblyTutorial weebly
Tutorial weebly
dariur
 
¿Como subir un power point al blog?
¿Como subir  un power point al blog?¿Como subir  un power point al blog?
¿Como subir un power point al blog?
ValentinaAgostina
 

La actualidad más candente (18)

Trabajo practico Nº13
Trabajo practico Nº13Trabajo practico Nº13
Trabajo practico Nº13
 
Artisteerexpouteq
ArtisteerexpouteqArtisteerexpouteq
Artisteerexpouteq
 
Trabajo Practico Nº13
Trabajo Practico Nº13Trabajo Practico Nº13
Trabajo Practico Nº13
 
informatica
informaticainformatica
informatica
 
Tipos de blogs.fsca
Tipos de blogs.fscaTipos de blogs.fsca
Tipos de blogs.fsca
 
Blogs
Blogs Blogs
Blogs
 
Dreamweaver- mercedes garcia
Dreamweaver- mercedes garcia Dreamweaver- mercedes garcia
Dreamweaver- mercedes garcia
 
Blogger
BloggerBlogger
Blogger
 
Otras formas de crear una página web
Otras formas de crear una página webOtras formas de crear una página web
Otras formas de crear una página web
 
Procesos para colocar marcos, hipervinculo y video en dw
Procesos para colocar marcos, hipervinculo y video en dwProcesos para colocar marcos, hipervinculo y video en dw
Procesos para colocar marcos, hipervinculo y video en dw
 
Trabajo practico 13
Trabajo practico 13Trabajo practico 13
Trabajo practico 13
 
Wix vs Sites Google vs Zyro
Wix vs Sites Google vs ZyroWix vs Sites Google vs Zyro
Wix vs Sites Google vs Zyro
 
Tutorial weebly
Tutorial weeblyTutorial weebly
Tutorial weebly
 
¿Como subir un power point al blog?
¿Como subir  un power point al blog?¿Como subir  un power point al blog?
¿Como subir un power point al blog?
 
Presentación1
Presentación1Presentación1
Presentación1
 
Slide Share
Slide ShareSlide Share
Slide Share
 
Practicas 2 parcial
Practicas 2 parcialPracticas 2 parcial
Practicas 2 parcial
 
Blogger
BloggerBlogger
Blogger
 

Similar a Phonegap

Descubriendo Windows Phone App Studio
Descubriendo Windows Phone App StudioDescubriendo Windows Phone App Studio
Descubriendo Windows Phone App Studio
Javier Suárez Ruiz
 
Cap 1 curso_dreamweaver 8
Cap 1 curso_dreamweaver 8Cap 1 curso_dreamweaver 8
Cap 1 curso_dreamweaver 8
marichela2013
 

Similar a Phonegap (20)

GUIA DE LABORATORIO PHONE GAP JQUERY MOBILE CARGADO DE_DATOS_DE_REGISTROS...
GUIA DE  LABORATORIO  PHONE GAP JQUERY  MOBILE  CARGADO DE_DATOS_DE_REGISTROS...GUIA DE  LABORATORIO  PHONE GAP JQUERY  MOBILE  CARGADO DE_DATOS_DE_REGISTROS...
GUIA DE LABORATORIO PHONE GAP JQUERY MOBILE CARGADO DE_DATOS_DE_REGISTROS...
 
GUIA DE LABORATORIO DEL USO DE LOS FRAMEWORS PHONEGAP Y JQUERY MOBILE EN APL...
GUIA DE  LABORATORIO DEL USO DE LOS FRAMEWORS PHONEGAP Y JQUERY MOBILE EN APL...GUIA DE  LABORATORIO DEL USO DE LOS FRAMEWORS PHONEGAP Y JQUERY MOBILE EN APL...
GUIA DE LABORATORIO DEL USO DE LOS FRAMEWORS PHONEGAP Y JQUERY MOBILE EN APL...
 
Comenzar con PhoneGap y subir a Googleplay y AppStore
Comenzar con PhoneGap y subir a Googleplay y AppStoreComenzar con PhoneGap y subir a Googleplay y AppStore
Comenzar con PhoneGap y subir a Googleplay y AppStore
 
Gestionar mis proyectos con ayuda de CodeIgniter
Gestionar mis proyectos con ayuda de CodeIgniterGestionar mis proyectos con ayuda de CodeIgniter
Gestionar mis proyectos con ayuda de CodeIgniter
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Dreamwever
DreamweverDreamwever
Dreamwever
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Descubriendo Windows Phone App Studio
Descubriendo Windows Phone App StudioDescubriendo Windows Phone App Studio
Descubriendo Windows Phone App Studio
 
De Windows Phone App Studio a la Store
De Windows Phone App Studio a la StoreDe Windows Phone App Studio a la Store
De Windows Phone App Studio a la Store
 
Instalacion adobe dream weaver
Instalacion adobe dream weaverInstalacion adobe dream weaver
Instalacion adobe dream weaver
 
Que es dreamweaver
Que es dreamweaverQue es dreamweaver
Que es dreamweaver
 
Trabajo practico nº2
Trabajo practico nº2Trabajo practico nº2
Trabajo practico nº2
 
Informe tecnico instalacion de joomla!
Informe tecnico   instalacion de joomla!Informe tecnico   instalacion de joomla!
Informe tecnico instalacion de joomla!
 
Programación web con PHP con Tecnología Bootstrap.
Programación web con PHP con Tecnología Bootstrap.Programación web con PHP con Tecnología Bootstrap.
Programación web con PHP con Tecnología Bootstrap.
 
CodeIgniter
CodeIgniterCodeIgniter
CodeIgniter
 
Uso del troyano cybergate ok
Uso del troyano cybergate okUso del troyano cybergate ok
Uso del troyano cybergate ok
 
Dreamweaver Tutorial
Dreamweaver Tutorial Dreamweaver Tutorial
Dreamweaver Tutorial
 
Configurando Ambiente de Desarrollo WEB en Eclipse Neón para Desarrolladores
Configurando Ambiente de Desarrollo WEB en Eclipse Neón para DesarrolladoresConfigurando Ambiente de Desarrollo WEB en Eclipse Neón para Desarrolladores
Configurando Ambiente de Desarrollo WEB en Eclipse Neón para Desarrolladores
 
Cap 1 curso_dreamweaver 8
Cap 1 curso_dreamweaver 8Cap 1 curso_dreamweaver 8
Cap 1 curso_dreamweaver 8
 
Introducción a Android
Introducción a AndroidIntroducción a Android
Introducción a Android
 

Último

Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
AnnimoUno1
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
FagnerLisboa3
 

Último (15)

Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnología
 
presentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptxpresentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptx
 
Desarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfDesarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdf
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
 
Presentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxPresentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptx
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 
guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Joseph
 
Presentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmerilPresentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmeril
 

Phonegap

  • 2. Que es PhoneGap? • Framework para el desarrollo de Aplicaciones móviles. • Tecnologías:
  • 3. APIS PhoneGap • Cámara • Acelerómetro • GPS • Notificaciones • Almacenamiento • Sistemas de Ficheros • Compas • Media
  • 6. Crear Aplicación con Dreamweaver • Crear sitio nuevo: (conjunto de archivos que utiliza el sitio web.)
  • 7. Crear Aplicación con Dreamweaver • Para escoger una plantilla por defecto seleccionamos: Crear Nuevo-más-Página de Muestra-Mobile Starters- jQuery Mobile(local):
  • 8. Crear Aplicación con Dreamweaver • Observamos que se nos ha cargado un documento HTML y también podemos ver como es la diseño de la plantilla:
  • 9. Crear Aplicación con Dreamweaver • Guardamos la plantilla como Index.html, cuando demos a guardar se nos pedirá unos archivos a copiar a nuestra carpeta , que los necesitaremos más adelante a la hora de compilar el código:
  • 10. Crear Aplicación con Dreamweaver • A partir de aquí ya podemos ir creando nuestra aplicación poniendo imágenes, poner más menús si son necesarios, submenús…. • Para cambiar colores o poner estilos a nuestra hoja lo podemos hacer en la pestaña de CSS que ya viene por defecto:
  • 11. Crear Aplicación con Dreamweaver • Nuestra aplicación ya esta terminada:
  • 12. Crear Aplicación con Dreamweaver • Una vez tengamos la aplicación vamos a modificar el archivo principal “config.xml”. Para que nos salga el archivo hay que ir a la pestaña sitio-servicio de phonegap build- servicio de phonegap build. Se nos abre una ventana donde tendremos que registrar un Id de Adobe:
  • 13. Crear Aplicación con Dreamweaver • Se nos abre otra ventana donde tendremos que dar a crear como nuevo proyecto y continuar:
  • 14. Crear Aplicación con Dreamweaver • Vamos a configurar el archivo “config.xml”, para ello ir a la dirección de abajo, donde lo explica a la perfección http://docs.build.phonegap.com/en_US/configuring_basics.md.html • Una vez tengamos el archivo vamos a la web de phonegap build, creeamos una cuenta adobe. Caundo ya nos hayamos regsitrado nos aparecerá la siguiente ventana:
  • 15. Crear Aplicación con Dreamweaver • En upload zip file subimos el rar de nuestra aplicación una vez subida nos saldrá la siguiente ventana: • Al subirlo se crea un código QR que será la instalación de nuestra aplicación (.apk). Con un software como QR Droid para los usuarios de android, escaneamos el código y lo guardamos. Después lo instalamos y ya tendremos nuestra apliación para usarla en nuestros dispositivos.
  • 16. Bibliografía • Video Tutorial: https://www.youtube.com/watch?v=aQfGcYHxpGI • Manual: http://docs.build.phonegap.com/en_US/#googtrans(en)
  • 17. FIN