Learn how to leverage Google Chrome's Remote Inspection feature to debug your Android applications. Chris Griffith demonstrates the inspectors functions, from viewing the DOM, the JavaScript console, and the CSS inspector. This is Chrome Dev tools, but for mobile hybrid apps.
- [Voiceover] Since this is a hybrid application,…we can leverage Chrome's remote debugging features.…If you've done any web development, you're…probably familiar with the Chrome dev tools.…With your Android device connected…via a USB cable, open Chrome on your computer.…In the address bar, go ahead and type in…Chrome://inspect and it will bring…up the dev tools for devices.…Confirm that the discover USB devices is checked.…
Your device will now prompt you…to allow USB debugging from your computer.…Go ahead, click OK, and I always also…recommend enabling the "Always allow from this computer."…Now, we can now see the device here, a Nexus 5X,…and we already have our Samoca app up and running.…Go ahead and launch the Samoca app on your Android device,…and we'll now see it listed on our computer.…Click inspect, and the Chrome dev tools will now open.…
So, we can actually see a representation…of the app over here on the left, as well…as our familiar dev tools over on the right.…Allowing us to go through and inspect,…
Author
Chris Griffith
Released
8/4/2016In this course, Chris Griffith introduces the PhoneGap ecosystem and the basics of PhoneGap Build. He shows how to set up an account for development and create, configure, and compile your first project with PhoneGap Build. Once you've mastered these fundamentals, Chris shows how to extend your app plugins, debug your app, and then prep it for release in the App Store, Google Play store, or Windows Store.
- What is PhoneGap Build?
- Setting up for Android or iOS development
- Creating a PhoneGap Build project
- Exploring the HTML structure of the app
- Defining build platforms and parameters
- Adding icons and splash screens
- Building the app via a ZIP file or GitHub
- Extending an app with plugins
- Debugging a PhoneGap Build app
- Preparing for release
Skill Level Beginner
Duration
Views
-
Introduction
-
Welcome38s
-
-
1. Introduction to PhoneGap Build
-
What is PhoneGap Build?2m 22s
-
The PhoneGap ecosystem1m 13s
-
2. Setting Your Environment
-
iOS Provisioning profile3m 30s
-
3. Creating Our App
-
The sample app53s
-
PhoneGap.js1m 5s
-
Wrap-up20s
-
-
4. Configuring Our App for PhoneGap Build
-
Configuration basics3m 32s
-
IOS specific parameters2m 24s
-
Android specific parameters1m 48s
-
Add app icons1m 51s
-
Add splashscreens1m 49s
-
Set permissions44s
-
Work with external resources1m 47s
-
5. Building Our App
-
Build via a zip file1m 38s
-
Build via GitHub46s
-
App details screen2m 49s
-
-
6. Deploying to Your Mobile Device
-
Deploy to iOS1m 17s
-
Deploy to Android1m 4s
-
7. Understanding PhoneGap Plugins
-
Introduction to plugins1m 24s
-
Add a plugin to an app2m 48s
-
Work with non-core plugins1m 19s
-
Enable the plugin2m 59s
-
-
8. Debugging Our PhoneGap Build App
-
Debug with Safari1m 30s
-
weinre2m 14s
-
GapDebug54s
-
Hydration1m 15s
-
9. Preparing for Release
-
Conclusion
-
Next steps1m 29s
-
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Debug Android apps with the Chrome Remote