# Week 1 - Cordova, CSP, NPM
Welcome
MAD9022 Cross-Platform App Dev II
This course will focus on building mobile applications using HTML5 and JavaScript. In the first half of the semester, we will be using the Cordova / PhoneGap framework to compile our apps to run as installable applications for Android and iOS. In the second half we will be focused on building Progressive Web Apps (PWAs) which are HTML/JS based apps that can be installed on a desktop or on a mobile device without going through an app store.
Throughout the entire semester we will also be focused on improving your general JavaScript programming skills and teaching you more advanced techniques and features.
# Course Deliverables
# Quizzes
Most weeks there will be a verbal quiz in class. Each correctly answered question is worth 4 points. You can answer up to 2 questions per class. After answering 5 questions you will have earned your 20%.
# Timed Exercises
There are five in-class timed exercises. The topic will be announced in class, during the preceeding class, to give you a chance to prepare. Each exercise needs to be completed within a time limit. These exercises will test your ability to research a problem and come up with a quick solution before a near deadline. The actual exercise will only be revealed at the start of the exercise period. The research topics are available ahead of time. These exercises are worth 15% of your final grade.
# Hybrid Exercises
Since this course is a Hybrid course, it means that we will have 4 hours face-to-face each week plus an extra hour of asynchronous lessons each week. There are 4 hybrid exercises over the course of the semester. They are worth 15% of your final grade. These exercises each have a series of lessons and required research followed by an exercise to complete outside of class hours.
# Projects
There are 2 Cordova Projects for you to complete in the first half of the course. In the second half of the semester, there will be two PWA projects. The 4 projects are worth 50% of your final grade.
# Program Assignment Late Policy
The MAD&D program has a standard late policy. Late assignments will receive a 10% late penalty for each day they are late.
One day late - 10% penalty Two days late - 20% penalty Three to ten days late - 30% penalty Over ten days late - graded as zero.
Extensions may be given for valid reasons, if requested more than one day before the due date.
The final deadline for late submission of the final PWA project is Friday April 23rd @ 5pm.
# Plagiarism vs Collaboration
We want to encourage all students to collaborate with each other. Explaining concepts and techniques to each other is beneficial for all. Everyone has different skills, strengths, and background experience. Sharing that knowledge has a positive impact on the class and the course.
Plagiarism is just copying work that is done by someone else without making the effort yourself. Whether you are actually taking a copy of someone elses file, or you are just looking at another screen and typing out what they have written - this is plagiarism.
Submitting plagiarized work will get you a zero on the plagiarized assignment. A second incidence of plagiarism will get you a zero on the course.
Student Attestation - please download, complete, and sign this form.
Use this information for the first four form fields:
Program Name: Mobile Application Design & Development
Professor:
Course # and Name: MAD9022 Cross-Platform Application Development
Term: Winter 2021
# Content-Security-Policy Meta Tags
With web applications, Cordova apps, PWAs, SPAs, all need ways to protect their users from malicious attempts to hack the application. A Content-Security-Policy <meta> tag is one way we can do exactly this.
The CSP meta tag allows us to specify the permitted locations for loading every asset in our website or app. We can limit the loading of scripts, styles, images, fonts, media, json, or xml by domain, protocol, or folder. This way, any malicious script will not be able to load assets that we don't want.
# NPM
Last semester we started learning JS by running it through NodeJS. This semester we will be learning about how to manage projects using NodeJS and the Node Package Management tool NPM.
With NPM we can create scripts to run and manage the versions of various components of our projects, manage project dependencies, and compile things like SASS to create distributable versions of our projects.
We will be using NPM to manage our Cordova projects.
# Cordova
Cordova is the open-source version of the Adobe PhoneGap framework. This is a framework that allows web developers to turn Single Page Applications, built with HTML, CSS, and JS into a native/hybrid iOS or Android app.
The way it works is by having a base app that contains nothing but an empty webview. A webview is like a browser without the chrome (buttons, menus, location bar, etc). The HTML homepage is loaded into the webview and then everything in the app is just a web app. The base app for iOS is written with Swift. The base app for Android is written with Kotlin.
Native device capabilities that are beyond what the browser supports natively can be accessed through plugins. The plugins for iOS are written with Swift (older ones with Objective C). The plugins for Android are written with Kotlin (older ones with Java).
Because it is run with web technologies instead of just native Swift or Kotlin code, it is called a Hybrid app.
CodePen Cordova Reference (opens new window) - this is a list of the commands that you can use to manage any Cordova project, including the iOS and Android specific tasks.
Learn about setting up Cordova
TODO
- Read the content and watch the videos for Week 1 and Week 2
- Prepare for the first timed exercise
- Review the description for the first Cordova project.