soapdog / firefoxos-quick-guide Goto Github PK

A quick guide for Firefox OS app development

JavaScript 75.91% Perl 0.14% CSS 23.95%

firefoxos-quick-guide's Introduction

Quick Guide for FXOS Development

This repository contains the English markdown sources for the book called "Quick Guide for Firefox OS Development" by Andre Alves Garzia.

Live Book Page

The current live copy of the book is available from Leanpub at the public book page

Contributing

To contribute to the English version of this book just use the issues and pull request features. To contribute to the other translations use their own repositories.

Other versions

Portuguese version: GitHub Repo and Live book page

License

This book is distributed using Creative Commons license. More information inside the book.

firefoxos-quick-guide's People

Contributors

Stargazers

Watchers

firefoxos-quick-guide's Issues

Retesting "packaged app installation outside of the marketplace"

Hello,

have you tested the installation of packaged apps outside of the Mozilla Marketplace again? Does it work with v1.1+?

In this case, please edit the distribution.md!

Unlimited storage request

I'm a bit worried that you are encouraging people to request unlimited storage on a device through IndexedDB. Requesting such a thing without actual justification to do so would get the application rejected from the firefox marketplace. This applies to all APIs.

Using IndexedDB in first example is too complicated

Do you really need to use IDB in the first example? IDB is the most complicated storage API on the Web (and generally just really confusing to understand).

Can't you use localStorage instead for such simple data?

Testing "Responsive Design View"

Hello,

did you know, that you can find the "Responsive Design View" tool in the web development toolbar, too?

It's next to what looks like a calendar (= JavaScript environment button) ;-)
Maybe you can put together both aspects in a future version?

Missing README.md

This repo should have a README.md telling people where to get the book from, and some text about how to contribute.

Removing orphans

Hello, me again :)

I'm wondering, what kind of typesetters are working at leanpub …

I found orphans, that is, the heading "Hosted Apps".

The other one is your image of the "permission request screen" -> Boy, there's a screenshot feature for that ;-)

Otherwise ask them for resizing the image bevor delivering the PDF.

Maintaining footnotes

Hello,

while reading through your guide, I noticed redundant footnotes.

Now looking at the source code, I see, that you always added the link directly. May I ask, why you didn't use IDs according to the syntax specs? That would reduce the redundancy a lot.

One could think about using endnotes here (e.g. at the end of each chapter), too.

Using string interpolation?

Hello,

I'm wondering, wether the usage of sprintf may be to confusing for beginners? For me, I'm familar with the concept (+ it is easier to translate apps this way ;-)).

It's up to you. I can edit the code snippets, if you like.

role on body - first app example

The firstapp document says:

The body tag must have an attribute role with its value equal to application because that is used by the CSS selectors to build the interface, so our body tag will be <body role="application">.

The above is somewhat incorrect. The role attribute is a used as an ARIA landmark and changes the way user interaction works - see http://www.w3.org/TR/wai-aria/roles#application.

Example code could be greatly reduced

I think you should just include the source files and force yourself to reduce the complexity of the code... specially in the first coding chapter. By removing indexedDB, and organizing the code better, I think the whole app could be about 100 lines of code max.

I can help you with that, but I need you to update the chapters so that they include the code.

Please avoid genedered language

Be careful with gender specific language. Avoid using "he" (instead use "they", which is gender neutral - or "he or she".... and when using a single form, it's better to use she... just to stick it to the man 😄 ).

Link not working in the PDF and mobi version

If you try to open the link "JavaScript Enlightenment" in the section "Best Practices vs Beginner Friendliness" it doesn't work into the PDF and mobi version; maybe because the note (#9) is empty.

Using document.getElementById everywhere is really ugly

You can make your code much more legible by doing that following:

//Emulate query selection from JQuery 
var $ = $ || function(selector){
   return document.getElementById(selector); 
}

Then the code will be much easier to read.

Front matter split into chapters

The front matter is currently splitting in to chapters... would be good to make sure all that content is grouped into sub-sections instead.

This should be fixed with some urgency.

Using OSNs

Hello,

finally read through the Quick Guide :-)

You may ask leanpub, to use OSNs in a future version? It's easier to read in my opinion :-)

Handling warning boxes

Hello,

another pinpoint for leanpub: In firstapp.md (lines 180 + 225 or so) you used A> to embed the following content in a box. While warning boxes (those with a leading W>) are correctly displayed, I'm missing an icon for those A> boxes …

Avoid XHTML-like markup

Please avoid using redundant XHTML markup patterns. So:

    <link rel="stylesheet" type="text/css" href="/style/base.css" />
    <link rel="stylesheet" type="text/css" href="/style/ui.css" />
    <link rel="stylesheet" type="text/css" href="/style/building_blocks.css" />
    <link rel="stylesheet" type="text/css" href="shared/style/headers.css" />
    <link rel="stylesheet" type="text/css" href="shared/style_unstable/lists.css" />
    <link rel="stylesheet" type="text/css" href="shared/style_unstable/toolbars.css" />
    <link rel="stylesheet" type="text/css" href="shared/style/input_areas.css" />
    <link rel="stylesheet" type="text/css" href="shared/style/confirm.css" />

Would be:

    <link rel="stylesheet" href="/style/base.css">
    <link rel="stylesheet" href="/style/ui.css">
    <link rel="stylesheet" href="/style/building_blocks.css">
    <link rel="stylesheet" href="shared/style/headers.css">
    <link rel="stylesheet" href="shared/style_unstable/lists.css">
    <link rel="stylesheet" href="shared/style_unstable/toolbars.css">
    <link rel="stylesheet" href="shared/style/input_areas.css">
    <link rel="stylesheet" href="shared/style/confirm.css">

Much more clear - and less useless attributes, spaces, and slashes, etc.

First app - use of `menu` element

I think your use of the menu element is invalid. The HTML5 specification states that:

If the element's type attribute is in the toolbar state: either zero or more li and script-supporting elements, or, flow content.
If the element's type attribute is in the popup menu state: in any order, zero or more menuitem elements, zero or more hr elements, zero or more menu elements whose type attributes are in the popup menu state, and zero or more script-supporting elements.

I would recommend against using menu as it might cause issues once it's actually supported in Firefox OS.

New argument for the guide

I had already started thinking about writing a guide for Firefoxos and I wanted to include these topics. So I translated the guide and I saw these deficiencies.
I wanted to make a guide focused on the boilerplate because it contains very basic material. Also because this is boilerplate what I have learned how to work with Firefox OS then I think it is an important element.
What do you think?

Guidelines for the marketplace https://developer.mozilla.org/en-US/Marketplace/Submission/Marketplace_review_criteria
Details for the manifest https://developer.mozilla.org/en-US/Apps/Developing/Manifest
ADB Helper / https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/
https://github.com/fabi1cazenave/webL10n
http://mozilla.github.io/brick/
https://github.com/robnyman/Firefox-OS-Boilerplate-App
Web activity
API specific for Firefox OS
https://github.com/Mte90/moz-polyfills (my polyfill for the webactivity)
Update the dashboard of the simulator because integrated in firefox

        <button id="back-to-list"><span class="icon icon-back">back</span>
        </button>

Why not?

        <button id="back-to-list" class="icon icon-back">back</button>

Or is it that Gaia Building Blocks are broken with regards to this?

soapdog / firefoxos-quick-guide Goto Github PK

firefoxos-quick-guide's Introduction

Quick Guide for FXOS Development

Live Book Page

Contributing

Other versions

License

firefoxos-quick-guide's People

Contributors

Stargazers

Watchers

Forkers

firefoxos-quick-guide's Issues

Recommend Projects

Recommend Topics

Recommend Org