Firefox OS/AcademyNCU2016
Contents
Academy Program in National Central University 2016
Web applications are popular due to the ubiquity of web browsers, and the convenience of using a web browser as a client to update and maintain web applications without distributing and installing software on potentially thousands of client computers is a key reason for their popularity, as is the inherent support for cross-platform compatibility.
Firefox OS is an open source mobile operating system build entirely using Web technologies. Having launched into market on smartphones built by leading handset manufacturers, Firefox OS is seeing rapid expansion into further markets. By making the Web a first class citizen on mobile, Firefox OS seeks to tear down closed ecosystem barriers and promote an open mobile Web.
As an open source project, Firefox OS is built by a community of employees, partners and contributors. Mozilla enthusiastically encourages students from the academy to contribute to Firefox OS. Mozilla works with National Central University in Taiwan and creates a semester class in 2015. In that class, Mozilla deploys required knowledge and skills to students, to implement web based apps. In the end of the class, there are totally 53 web apps implemented by students, and parts of them are submitted to Mozilla Firefox Marketplace. At the end of this class, the computer science department in National Central University hosted an exhibition to demo some of these apps.
After we finished the successful class in 2015, Kevin Hu talked with the chairwoman in computer science department in National Central University, and we are going to open another semester class in 2016. This class will focus on the implementation of Web Apps and Add-ons, including programming best practice, API basics, and some workshops that allow students to experience the whole process to implement Web Apps. In the end of the class, finished and completed Web Apps are expected. To submit these apps to Mozilla Marketplace is even better.
Basic Information of the Class
- National Central University, Taiwan
- Computer Science and Information Engineering Department
- Name of the Class: Web Technologies and Practice (Web技術與實作)
- Number of Students: ~25
- Required Skills: Basic JavaScript programming
- Time: 2-5pm every Monday.
- Location: Room 206 in Computer Science department building (工程五館).
Estimation Survey
Students are expected to fill in an estimation survey before enrolling this class. After students fill in this survey, speakers will review the submissions and provide suggestions to students to enroll this class or not.
Working Environment
Operating System
- Ubuntu Desktop 15.04. (Recommended)
Tools
- NVM - Node Version Manager
- git tool
- Firefox OS Simulator
- Firefox Nightly Build - In order to try new framework for Add-Ons.
- WebIDE in Firefox browser(Gecko 34 or higher) with Firefox OS 2.2 and 3.0 runtime installed.
- Pythonpip, Python-virtualenv.
Before development
- Running your own Gaia build:
- First, make a fork of the main Gaia repo on Github.
- Clone your fork locally: git clone https://github.com/your-username/gaia.git
- Go to 'gaia' folder and add upstream: git remote add upstream https://github.com/mozilla-b2g/gaia
- Now you need to create a Gaia profile. Running make inside your repo folder creates a profile in the profile directory, which is setup for optimal debugging. It creates unpackaged (hosted versions) of the Gaia apps that can be served directly via the local HTTPD server bundled along with Firefox desktop as an extension. When you make a change you just need to refresh your browser window to see the result (as you'll see later), rather than having to rebuild the profile, repush it to the device, etc. This is really good for rapid CSS/JS/HTML hacking.
- With your debug profile built, run it in Mulet or WebIDE.
Testing environment
- Firefox OS Simulator, Add-on for Firefox browser.
- Firefox OS Flame device(To be clarified. Need to be returned at the end of the class).
- Students need to sign agreements to make sure that these Flame devices will be returned at the end of this class.
Rating Criteria
- Rating Criteria:
| Type | Percentage | Detailed description |
|---|---|---|
| Project | 60% | * Votes from Demo: 25% ** In the 25% for demo, each student, teacher assistant and speaker has votes to choose the projects that are done by others. * Code quality: 20% * Creativity: 15% |
| Homework | 30% | Based on the completion and quality of assignment after sessions. Will be reviewed and assigned by teacher assistants and speakers. |
| Attendance | 10% | Based on how students are involved in the class [1]. |
- Button line: (Students who don't meet one of the following conditions may have a fail in this class.)
- The project should not be copied from others.
- Students are expected to finish the project by the end of this class. Date is to be clarified.
- [1] Should not have absence for more than 2 sessions.
- To quit in the middle of the class is not allowed. Please make sure you understand the criteria and decide to enroll this class or not before the end of the 2nd session.
Deliverable
- Each student needs to prepare a demo and shows to other students in this class.
Communication Channels
- IRC:
- How to use IRC to get connected with others in the Mozilla projects
- Channels: #b2g, #mozilla-taiwan, #Academy-NCU2016
- Mailing list:
- Discussion for this class: Google Group
- General discussions for Firefox OS: dev-fxos, dev-gaia
- Mozilla Community in Chinese language
Agenda
| # | Date | Topic | Speaker / Owner | Homework |
|---|---|---|---|---|
| 1 | 02/22 | Introduction Overview of this class(rating criteria, major goals, projects). At the end of this session, we will also provide the basic instruction to use Github. Slides can be opened here. |
Kevin Hu | Register a Github account and create a repository and rename it via git commands. |
| 2 | 03/07 | Introduce browser devtools, issue tracking and version control system Introduction of Git, Github, Bugzilla and DevTools. After this session, students are expected to have the skills to use essential tools to develop website and collaborate with a team. Slides can be opened here. |
Ricky Chien Kevin Hu |
To create a Hello World app, and submit to your own Github repository. |
| 3 | 03/14 | Introduce browser devtools, issue tracking and version control system (continue) Introduction of Git, Github, Bugzilla and DevTools. After this session, students are expected to have the skills to use essential tools to develop website and collaborate with a team. Slides can be opened here. |
Ricky Chien Kevin Hu |
Collaborate as team to work on a Github project together and solve a git conflict issue. |
| 4 | 03/21 | Introduction of animation and web component Introduction of animation technology and web component. Slides can be opened here. |
Yifan Liao Kevin Hu |
None. |
| 5 | 03/28 | JavaScript Best Practice (1) Some examples will be used in this session. After this session, students are expected to learn JavaScript best practice, and the skills to refactor JavaScript codes. Slides can be opened here. |
Greg Weng Kevin Hu |
Codes refactoring. |
| 6 | 04/11 | JavaScript Best Practice (2) Some examples will be used in this session. After this session, students are expected to learn JavaScript best practice, and the skills to refactor JavaScript codes. Slides can be opened here. |
Greg Weng Kevin Hu |
Codes refactoring. Start to provide the draft of proposed project. |
| 7 | 04/18 | JavaScript Best Practice (3) Something new in ES6/ES7, that already used in Mozilla's codebase. Slides can be opened here. |
Wei-Cheng Pan Kevin Hu |
|
| 8 | 04/25 | Business Model Canvas and animation Overview of business model and how it works. Keynotes of animation. Slides can be opened here:UX-UI-Animation(keynote). Slides can be opened here:UX-UI-Animation(pdf). |
Charles Chen Morpheus Chen |
|
| 9 | 05/02 | Responsive Web Design | Joseph Yeh | None. |
| 10 | 05/09 | Introduction of client-server model and development tools | Ray Lin Kevin Hu |
None. |
| 11 | 05/16 | HTML5 Gaming, Canvas API Slides can be opened here. |
Scott Wu Kevin Hu | |
| 12 | 05/23 | Mozilla Taipei Visit (Dates: TBC) Students will come to visit Mozilla Taipei office. Will provide basic introduction about Mozilla. Slides can be opened here. Office Location: 台北市信義區信義路五段106號4樓A1 Agenda:
|
Kevin Hu | None. |
| 13 | 05/30 | Project Demo | TAs | |
| 14 | 06/06 | Project Demo | TAs |
Mentors / Session Owner
| Speaker | Responsibility | IRC | Github | Detailed work on items |
|---|---|---|---|---|
| Kevin Hu | Management of Engineering Community Development, the organizer of this class | khu | kaichih | LinkedIn: https://www.linkedin.com/in/kaichih Telegram: kaichih Skype: kaichih.hu |
| Greg Weng | Firefox OS Software Engineer | snowmantw | snowmantw | Lockscreen, and NFC visual effects in Firefox OS. |
| Ricky Chien | Firefox OS Software Engineer | rickychien | rickychien | Work on Firefox OS Gaia. |
| Yi-Fan Liao | Firefox OS Software Engineer | yliao | bebeeben | system browser, vertical home screen, and bookmark in Firefox OS. |
| Joseph Yeh | Firefox OS Software Engineer | joseph | ||
| Charles Chen | Senior Business Development Manager | Building Relationship and Developing Business with various Partners to explore opportinuty for Firefox OS in Connected Device Area. | ||
| Wei-Cheng Pan | Firefox OS Software Engineer | wcpan | legnaleurc | Firefox OS Performance. |
| Scott Wu | Firefox OS Software Engineer | Firefox OS Front End Developer. | ||
| Ray Lin | Firefox OS Software Engineer | rylin | raylin | Web developer. |
Teaching Assistants
- 鍾智鈞
- Github: chungya
- 蔡宗明
- Github: FlowerHop
