Welcome

Welcome to the Beginners’ Mobile Web App Development Tutorial. In this tutorial we will introduce basic front-end technology, the Apache Cordova Mobile development framework, the Onsen-UI framework and build our first app from scratch! No experience needed!

Contents:

• Project Introduction
  • Welcome
  • What is Web Development?
  • What is Web App?
  • What is Mobile Web App/Hybrid App?
  • What is Cordova?
  • What is HTML?
  • What is CSS?
  • What is JavaScript?
  • What is Onsen UI?
  • What is front-end and back-end?
• Environment Setup
  • Install node.js/npm
  • Install Cordova CLI
  • Useful Command line
  • Create Root Directory
  • (Optional) For Git Users
  • Install Onsen UI
  • IDE/Text Editor
  • (Recommended) Testing
  • Delete Sample Files
• Designing the Structure
  • Directory Structure
  • index.html
  • Pages
  • app.js
  • controllers.js
  • view.js
  • model.js
• Navigation
  • toolbar
  • Menu Button
  • Challenge 1: Creating About Page
• Models
  • What’s Model
  • models.js implementation
  • Challenge 2: Enable Long-term Storage
• Views
  • Show Todo List
  • Floating Action Button
  • Challenge 3: Seperate Page for Creating Task
• Controllers
  • The final controllers
• Testing in Browser
  • Why Test in Browser?
  • Python HTTP Server
  • Ripple Emulator
• Deploy on Your Phone
  • Congratulations
  • Cordova Platform Requirements
  • Distributing your App via App Store and Google Play
  • Challenges