Augmented Reality for JavaScript Developers [Video]

Preview in Mapt

Augmented Reality for JavaScript Developers [Video]

Daniel Wise

Explore the limitless applications of AR
Mapt Subscription
FREE
$29.99/m after trial
Video
$106.25
RRP $124.99
Save 14%
What do I get with a Mapt Pro subscription?
  • Unlimited access to all Packt’s 5,000+ eBooks and Videos
  • Early Access content, Progress Tracking, and Assessments
  • 1 Free eBook or Video to download and keep every month after trial
What do I get with an eBook?
  • Download this book in EPUB, PDF, MOBI formats
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
What do I get with Print & eBook?
  • Get a paperback copy of the book delivered to you
  • Download this book in EPUB, PDF, MOBI formats
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
What do I get with a Video?
  • Download this Video course in MP4 format
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
$0.00
$106.25
$29.99 p/m after trial
RRP $124.99
Subscription
Video
Start 14 Day Trial

Frequently bought together


Augmented Reality for JavaScript Developers [Video] Book Cover
Augmented Reality for JavaScript Developers [Video]
$ 124.99
$ 106.25
The complete JavaScript developer: MEAN stack zero-to-hero [Video] Book Cover
The complete JavaScript developer: MEAN stack zero-to-hero [Video]
$ 73.99
$ 62.90
Buy 2 for $35.00
Save $163.98
Add to Cart

Video Details

ISBN 139781788471640
Course Length4 hours and 9 minutes

Video Description

Augmented reality is the idea of mixing computer-generated media with someone’s view of the real world. AR.js provides a framework and set of utilities to develop augmented reality applications efficiently just using web technologies.

This course will show the learning ropes on how to produce interactive augmented reality experiences with nothing but a set of web technologies such as JavaScript and HTML. We'll start off with a basic introduction to Augmented reality experiences and an introduction to all the libraries and development tools that we are going to utilize in this video course. We'll begin by setting up our basic structure for our very first AR web application using the AR.js framework. We then move on to setting up our camera feed to localize our AR markers. After that, we'll deep dive into learning to overlay 3D content on top of our markers with three.js where we'll learn to apply realistic lighting and shadows to the 3D objects that we create using the different camera controls provided by Three.js to effortlessly navigate around your 3D scenes. After getting our 3D right we'll learn how to integrate both the 3D and our camera feed onto the screen. Towards the end of the video, we'll create a couple of real-world AR web application to better apply our gained knowledge.Finally, we get started into building Projects such as a 3D business card and AR data histogram.

By the time we are done with the course we would be able to create AR applications with A-Frame along with AR.js and with awe.js and also create Business cards and Data histograms.

Style and Approach

Practical and simplistic approach covering the basics with room for growth and step by step build your AR Apps or integrate the AR view to the existing App.

Table of Contents

Exploring AR Technologies
The Course Overview
Overview of AR Development
AR Features Versus VR Features
AR Ready Devices
Course Topics
Simple AR Application with A-Frame and AR.js
Setting up Our Project and Creating Our Scene
Object Meshes and Mesh Attributes
Adding Text and Animations to Objects
Adding Textures to Objects
Adding AR.js to Our Application
Working with Three.js
Discussing Three.js and Setting up Our Project
Creating a Basic Scene
Exploring Different Geometry Meshes
Creating Materials
Creating Shaders
Lights and Cameras
Loading a Model
Building an Extensive AR Application with Awe.js
Setting up, Creating the Load Function
Adding POIs, Projections, and Events
Creating a Case Statement with Conditionals
Adding Our Last Box and Create a Compatibility Error Message
Testing Our App
Testing Our Projects on Mobile Devices
Going over Web Hosting with Heroku
Deploying Our AR.js and Awe.js Applications to Heroku
AR Web Applications on Mobile Browsers
Building Our Projects
Creating an AR Business Card with A-frame and AR.js
Creating an AR Histogram with Awe.js

What You Will Learn

  • Explore various AR technologies and the differences between Augmented reality vs Virtual Reality.
  • Create a simple AR application with-Frame and AR.js and learn how to add animation to your objects
  • Work with technologies like Three.js to add different geometry, shades, lightings and camera angles to your model.
  • Build an extensive AR Applications with awe.js by creating scenes, objects and adding events.
  • Test your projects on different mobile platforms and explore if there are any compatibility issues.
  • Proceed to build your own customised business card and Data Histogram using AR.js, A-Frame, and awe.js

Authors

Table of Contents

Exploring AR Technologies
The Course Overview
Overview of AR Development
AR Features Versus VR Features
AR Ready Devices
Course Topics
Simple AR Application with A-Frame and AR.js
Setting up Our Project and Creating Our Scene
Object Meshes and Mesh Attributes
Adding Text and Animations to Objects
Adding Textures to Objects
Adding AR.js to Our Application
Working with Three.js
Discussing Three.js and Setting up Our Project
Creating a Basic Scene
Exploring Different Geometry Meshes
Creating Materials
Creating Shaders
Lights and Cameras
Loading a Model
Building an Extensive AR Application with Awe.js
Setting up, Creating the Load Function
Adding POIs, Projections, and Events
Creating a Case Statement with Conditionals
Adding Our Last Box and Create a Compatibility Error Message
Testing Our App
Testing Our Projects on Mobile Devices
Going over Web Hosting with Heroku
Deploying Our AR.js and Awe.js Applications to Heroku
AR Web Applications on Mobile Browsers
Building Our Projects
Creating an AR Business Card with A-frame and AR.js
Creating an AR Histogram with Awe.js

Video Details

ISBN 139781788471640
Course Length4 hours and 9 minutes
Read More

Read More Reviews

Recommended for You

The complete JavaScript developer: MEAN stack zero-to-hero [Video] Book Cover
The complete JavaScript developer: MEAN stack zero-to-hero [Video]
$ 73.99
$ 62.90
Responsive Web Development with HTML5, CSS3, and JavaScript [Video] Book Cover
Responsive Web Development with HTML5, CSS3, and JavaScript [Video]
$ 124.99
$ 106.25
JavaScript Choice Made Easy - Angular v. React v. Vue [Video] Book Cover
JavaScript Choice Made Easy - Angular v. React v. Vue [Video]
$ 124.99
$ 106.25
JavaScript from Beginner to Expert [Video] Book Cover
JavaScript from Beginner to Expert [Video]
$ 121.99
$ 103.70
Augmented Reality for Developers Book Cover
Augmented Reality for Developers
$ 39.99
$ 28.00
Web Developer Toolbox - Essentials for Modern Web Development [Video] Book Cover
Web Developer Toolbox - Essentials for Modern Web Development [Video]
$ 124.99
$ 106.25