hello world (part 3)

[ghost]

Hi again unscriptable, Thank you so much for teaching me your http://dl.dropbox.com/u/13371575/mod.zip , great basic OO AMD example.

If I can get one last help to learn the basics based on what you showed me:

1. Is Zepto loaded ahead of 'my' modules in your example? It's not obvious to me how to make it so.
2. Why no use of keyword 'require'? Should it use 'require' and how would I? So it looks a bit more like node.js module.
3. In index.html, line 18: { name: 'extend', location: 'lib/extend', main: '.' }, why is that needed, if the 'Ninja.js' uses it like Person, but person is 'defined' differently.

Thank you for your patience and support so far in any case. Vic

[unscriptable]

Hello @puppetMaster3,

Side note: there's no need to keep opening new issues for the same topic. Just re-open the old issue. :)

1. Is Zepto loaded ahead of 'my' modules in your example? It's not obvious to me how to make it so.

zepto isn't loaded at all in that example. The creators of that library are a bit behind the times, tbh. They should have made it using modules, but they didn't. You can either fork it yourself and wrap it in a define() or you can load it using the js! plugin as a preload:

var cfg = {
    baseUrl: '.'
    ,paths: {
        curl: 'lib/curl'
    }
    ,packages: [
        { name: 'myApp', location: 'myApp', main: 'main' },
        { name: 'extend', location: 'lib/extend', main: '.' }
    ]
    ,preloads: [
        'js!lib/zepto.js'
    ]
};

Preloads load in parallel with other modules, but are guaranteed to execute before the modules.

Wrapping zepto in a define() is the better way to go since it eliminates your reliance on a global var. Here's how you do it:

define(function () { /* all of zepto.js goes in here */ return Zepto; });

1. Why no use of keyword 'require'? Should it use 'require' and how would I? So it looks a bit more like node.js module.

AMD supports a few formats that are similar to CommonJS Modules 1.1 (which node supports). Two of these allow you to use the require() function. If you're not using a build tool, this one is more efficient:

define(["require"], function (require) { // require is a local require here and will understand relative module ids var Person = require("./Person"); // etc... });

1. In index.html, line 18: { name: 'extend', location: 'lib/extend', main: '.' }, why is that needed, if the 'Ninja.js' uses it like Person, but person is 'defined' differently.

The preferred way to organize your modules is into packages. Packages are collections of modules that share a namespace. If you have two modules, modA and modB, in package pkgC, then you'd refer to them as "pkgC/modA" and "pkg/modB". You can refer to modules inside the same package using relative module ids. So from modB, you can reference modA as "./modA".

Packages allow you to designate one module as the "default" one: the one to use when you only specify the package namespace and not a module. This is called the "main module". So if you ask for "pkgC", the system will look for "pkgC/main".

I turned your extend function into a package. I figure you'll keep adding more functionality to it over time. Line 18 instructs curl to look for the main module of the extend package at "extend" instead of "extend/main". Later, if you add features to extend, they can be in separate modules.

-- John