Diploma in Mobile App Development · PDF fileDisplaying Content 1. Create HTML Tags 2. Loop...

Post on 20-Mar-2018

217 views 2 download

Transcript of Diploma in Mobile App Development · PDF fileDisplaying Content 1. Create HTML Tags 2. Loop...

Lesson 5

Web Hosting

MAD Educator: Tadhg Deeney

Diploma in Mobile App DevelopmentPart I

@ShawMobileApp

MOBILE APP DEVELOPMENT TOOL KIT

ONLY €19.99

Webinar Slides for every lesson

Bonus Videos

Summary Notes for every lesson

Exclusive Starter Pack

INCLUDED:

Enhance your learning experience!

Lesson 4 Recap

• Introduction to JavaScript

• Variables & Functions

• Arrays

• Adding Interactions

• Summary

• Course Interaction

• Q & A

https://www.facebook.com/shawacademy

Facebook Review

Leave a Facebook Review to receive free code samples from todays lesson

Email mobile.app@shawacademy.com once you have posted your review

Lesson 5

• Lesson 4 Recap

• Finishing our App

• Device Testing

• What is Web Hosting?

• Putting our App LIVE on the Web

• Summary

• Course Interaction

• Q & A

Our To-Do List

Using App Designer:-Header-Input Field-Button-Image

FrameworksCSS & JavaScript LibrariesSimplifies tasks for developersEnsures code will work

Our To-Do List

Store Tasks

Add to our Array1. Get the input value from HMTL file2. Push the value into the array3. Update the HTML Document

Displaying Content1. Create HTML Tags2. Loop through each element3. Replace the content in HTML file

Add an Event

JavaScript

var taskList = [];

function add(){

var task= document.getElementById("taskValue").value;

document.getElementById("taskValue").value = "";

taskList.push(task);

display();

}

function display(){

var taskListContent = “<ul>”;…}

document.getElementById(‘add’).addEventListener(‘click’, add);

Modifying our App

Modify the Display function

Add a Button to each List Item

Create an Event for Each Button

Create a Remove function

JavaScript

function remove(){

var id = this.getAttribute(“id”);taskList.splice(id, 1);display();

}

Testing on Devices

How do you Test on Devices?

Buy the Phones you need

Guerrilla TestingTest your App on Devices in

your local Store

Intel’s App Preview

What is Web Hosting?

What is Web Hosting?

The Business of providing storage space & access for Web Apps

A service that posts a Web App on to the World Wide Web

Free Vs Dedicated Hosting

Free Hosting• Nothing is truly free• Ads • No Control over the Server• Difficult to Migrate• Unpredictable Performance

Dedicated Hosting• Very Expensive• No Ads• Full Control over the Server• Full Allocation of Resources• Extremely Predictable Performance

Check your Student Area or Email for Discount Code

Finishing off our App

Testing with App Preview

What is Web Hosting?

Putting our App LIVE on the Web

Congratulations you have just taken the next step

o Attend all of the lessons live to ask Questions in

real time and benefit the most

o We’re here to help, so contact us anytime!

Summary

Coding Challenge

You guys are Awesome!

Stay tuned for another Challenge on Thursday!

www.youtube.com/c/shawacademyMobileAppDevelopment @shawacademy @ShawMobileApp

• The next session is “Development Tools”

• What is Version Control?

• Creating a Repository & Branching

• Project Management

• Keeping a Good Work Flow

Your Next Lesson

Lesson 6

Has your knowledge grown?

Shaw Academy Lifetime Membership Prize

Announcement!

Student Feedback

We strive for continuous improvement

After the lesson we will ask you to rate the lesson on a

scale of 1 (lowest) to 5 (highest).

www.facebook.com/shawacademy @shawacademy @ShawMobileApp

QUESTION TIME See you back for Lesson 6 Development Tools

mobile.app@shawacademy.com