Framework quick-start guides (Backbone, Spine, ...)

[Caolan McMahon]

I'd really like to add a "Step 4" to the end of http://kan.so/install with links to getting started using a number of frameworks. The idea being that if you're a Backbone.js developer you can jump right in with your framework of choice.

I've noticed recently some backbone-related packages cropping up on the repository:

http://kan.so/packages/details/backbone by robbinsd

http://kan.so/packages/details/backbone-couch by mikewallace

http://kan.so/packages/details/backbone-d3 by mikewallace

And of course, there's the Spine related packages by nrw:

http://kan.so/packages/details/spine

http://kan.so/packages/details/spine-adapter

Would anyone be interested in starting such a guide on the Kanso docs wiki? I'd be happy to offer my help with Kanso-specifics. This would probably be more valuable when written from the perspective of a developer coming from one of those frameworks, rather than being written by me after just skimming the basics.

I would view these more as a quick-start guide for people that already know the framework, rather than a "how to write applications in Backbone".

Caolan

[Roberto Garcia]

Hi Caolan, I can help with Spine.
How can we start?

[Caolan McMahon]

> Hi Caolan, I can help with Spine.
> How can we start?

If you're using Spine with Kanso, all you need to do is write down how
to quickly get set up with a project including Spine and put it on the
wiki somewhere. I suppose most Spine developers are also using
CoffeeScript, so we should probably go over the
coffee-script-precompiler package too. If you're not using Spine with
Kanso yet, I suggest catch me on the IRC channel (#kanso on FreeNode)
and we can walk through the process of getting a basic project set up.

Once we've got a quick-start guide on the wiki I can link directly to
it from the install page.

Are there any other commonly used frameworks people might be interested in?

[Peter Bacon Darwin]

One issue I have with Spine on Kanso is that Alex (the creator) has built his own packaging environment/server (similar to Kanso), which he calls Hem.  Hem uses npm modules directly, whereas Kanso has a separate repository. It would be great if we could get the two to kind of come together somehow.  One example is that he has a nice npm module called JQuerify, which wraps JQuery in a CommonJS module so you can just require it in your code and off you go, safe in the knowledge that it is not going to blat something else in the system.

In a similar vein, and thinking about Kanso in a more general purpose sense, it would be great if Kanso streamlined the distinction between front-end code (i.e. in the browser) and backend code (i.e. on the CouchApp).  I know that the whole point of Duality is to remove the need to distinguish some of this but there are many situations where you want to use CommonJS modules specifically on the front-end and it would be nice if Kanso supported packaging this up more simply.

Cheers,

Pete

[Caolan McMahon]

We've talked about using the npm repository for packages a few times,
but it just doesn't seem to make sense in practice. Kanso packages are
working in a very different environment and the number of packages in
npm that would work in Kanso without much modification is surprisingly
small.

jQueryify sounds very useful, perhaps we should create a package for
Kanso projects?

Distinguishing between browser and server-side modules could be useful
if you find yourself running very different code on both sides.
Usually I find myself using pretty much all the code browser-side and
only a small part of it server-side, so it's not a big deal if
everything gets packaged and sent to the browser.

That said, I'd be very interested in your thoughts on how we might
improve the module and package systems in Kanso.

Caolan

[Peter Bacon Darwin]

I'll see if I can think through in more explicit and clear terms what would make the dev process more helpful to me.

[Roberto Garcia]

Caolan I've started now at
http://kan.so/docs/Getting_started_with_Spine

I've cloned the http://kan.so/docs/Simplest_possible_app as a
template.
If you see any problem please fix for me.
Cheers.

[Peter Bacon Darwin]

Hi Robert,

Do you need to have the duality framework in there or have you just not got round to cleaning out all the unneeded dependencies.

I would have thought that the simplest Kanso app would need only modules, properties, coffeescript and spine-adapter?  Is that right?

Pete 

[Roberto Garcia]

Hi Peter,
can you help me?
I dont know how to use the Handlebars templates without Duality.

[Peter Bacon Darwin]

Hi Robert,

Why are you using handlebars?

The most simple app would be a straight Spine application created from "Hem build" and then attached to the CouchApp document, using the attachments package.

The next most simple would be the same but with some CouchApp views (created using the "properties" package), then using spine-adapter to pull the data from the views into the Spine app.

I would be wary of mixing frameworks - Duality is most comfortable (right now) with handlebars templates; Spine is most comfortable with eco templates.  The mix of frameworks and templates is one of the areas of confusion that will put off people from combining the two.

I would also steer clear, at the stage, from generating any html on the server (inside a show or list) as this confuses what will be going on in the Spine app.

Pete 

[Roberto Garcia]

Pete,
I foloowed the TODO example - https://github.com/nrw/kanso-spine-todos
- from Nicholas which uses Dust templates with Duality. I only change
it to handlebars.
I wiil need your help on this :)

On Jan 21, 12:33 pm, Peter Bacon Darwin <p...@bacondarwin.com> wrote:
> Hi Robert,
>
> Why are you using handlebars?
>
> The most simple app would be a straight Spine application created from "Hem
> build" and then attached to the CouchApp document, using the attachments
> package.
> The next most simple would be the same but with some CouchApp views
> (created using the "properties" package), then using spine-adapter to pull
> the data from the views into the Spine app.
>
> I would be wary of mixing frameworks - Duality is most comfortable (right
> now) with handlebars templates; Spine is most comfortable with eco
> templates.  The mix of frameworks and templates is one of the areas of
> confusion that will put off people from combining the two.
>
> I would also steer clear, at the stage, from generating any html on the
> server (inside a show or list) as this confuses what will be going on in
> the Spine app.
>
> Pete
>

[Peter Bacon Darwin]

How about starting with a tutorial built around the Spine Todos app that only uses CouchDB as the hosting platform (i.e. no data storage - just local storage inside the browser)?  It should walk through creating the app (possibly with Hem build) then bringing that into a Kanso app and pushing it to a CouchDB.

[Roberto Garcia]

Pete
I loved the way spine-adapter (spine-adapter/couch-ajax) do the REST
in couch to read and write the docs - That's what fascinated me: host,
data storage, MVC javascript, replication - all together. With the
simple kanso push.


I don't know how to use HEM with Kanso app.
Why a tutorial without storage in couchdb?
Help me understand this.
Roberto

On Jan 21, 1:01 pm, Peter Bacon Darwin <p...@bacondarwin.com> wrote:
> How about starting with a tutorial built around the Spine Todos app that
> only uses CouchDB as the hosting platform (i.e. no data storage - just
> local storage inside the browser)?  It should walk through creating the app
> (possibly with Hem build) then bringing that into a Kanso app and pushing
> it to a CouchDB.
>

> On 21 January 2012 14:54, Roberto Garcia <beto....@gmail.com> wrote:
>
>
>
>
>
>
>
> > Pete,

> > I foloowed the TODO example -https://github.com/nrw/kanso-spine-todos

[Peter Bacon Darwin]

OK, I agree that the exciting bit is the spine-adapter but this is not the most simple Spine app that one can push to Couch.

It is the second most simple app.

Actually, I don't think we do need Hem as long as we are not using .jeco templates (this is an extension to .eco that Alex created, which is only supported by Hem).

Tell you what I will knock up a couple of simple apps and stick them on GitHub to base the discussion around.

In both cases there will be no use of Duality or Dust or Handlebars (I hope).

Pete

[Peter Bacon Darwin]

Here is a first ultra simple/empty Kanso Spine application.  It doesn't do anything!

Check out the readme for what I am getting at.

https://github.com/petebacondarwin/kanso.spine.simplest

Pete

[Steve Schmechel]

I'll concede it would not be "the most simple app", but I think

demonstrating how to work with CouchDB data is important in

nearly every Couchapp.  It seems unlikely that one would choose

CouchDB as a platform simply for it's static web server

capabilities, while ignoring its strong database features.

There are a lot of interesting JavaScript frameworks out there

and I wish I had the time to learn several of them (Spine,

Backbone, SammyJS, etc.).  They all seem to have pro's and con's

and I am not sure that there is a clear winner for my needs.

Likely, any of them would be sufficient for my needs.

In the packaging/deployment area, there are several options also:

Erica, Soca, Kanso, (HEM + Kanso?), etc.  Here Kanso is a clear

leader for my needs.  I'm not saying it is better for everyone,

but in my situation it has some advantages.  It offers a lot of

functionality without requiring me to install and learn other

language tools (Soca and Ruby/Rake).  If I were deploying to some

other platform (Node.js, Heroku, etc.), something else might be a

better choice, but I am deploying to a Couchapp so Kanso seems a

great fit.

So, given limited time, the first framework I invest time in will

likely be the one where I can see how to integrate it with Kanso.

As far as templating and other utilities, I don't have strong

opinions on those yet and those decisions will likely follow from

the framework choice.

My migration plan currently looks like this:

Database:            CouchDB   -->   CouchDB

App Deployment:  Couchapp  -->   Kanso

JS Framework:     Evently      -->   ???

Authentication:     Evently built-in --> framework's pattern or plugin

Templating:          Mustache  -->   ???

Any sample apps or screencasts that can make this transition

easier, are definitely appreciated.  Once I get familiar with a

framework, I would be willing to add to the documentation,

tutorials, and maybe even screencasts.  Right now, I am still

trying to find some solid footing.

Thanks again,

Steve

[Valery Surkov]

" It seems unlikely that one would choose
CouchDB as a platform simply for it's static web server

capabilities, while ignoring its strong database features." ------>
Exactly my feelings.
It would be nice to have in documentation more examples dedicated to
communication with CouchDB for retrieving documents - "db" module like
getDoc...
By the way is it possible to explicitly "tell" underlying modules
where to run different components - server side OR browser side?

[Peter Bacon Darwin]

I totally agree that in most cases one wants to be running Spine apps that use the CouchDB for data storage but since we are talking about tutorials here, surely it is easier to get up to speed if we take it one step at a time? You'll notice that Caolin's Simplest Possible App doesn't talk to the database either.

For me the hardest thing so far about using Spine with CouchDB (and Kanso) has been trying to get the tools to work together.  Frankly once you have an deployment proces up and running Spine is pretty easy to learn.

Anyway, here is the next step in the learning process: https://github.com/petebacondarwin/kanso.spine.todos.  I have moved the very basic (local data store!!) To Do List application over so that it runs in Spine on CouchDB as a CouchApp pushed by Kanso.  The point is that with this set-up (sadly still using Hem to build) you can write your Spine coffee script as always, even test it locally with "hem server" and then push it straight up to a CouchDB to be hosted.

By the way, I do believe that there will be some scenarios where one would use CouchDB as a pure host (of CouchApps) while not necessarily using it for a data store.

Enjoy and please do feedback comments, such as "I don't get what you are trying to do here!"

Pete

[Roberto Garcia]

For JS framework I am loving Spine.
Is simple, the docs is complete and works fine.
And is easy to write with coffescript.
And its a peace of cake with couchdb.
Look like they were designed for each other.

And for templating Handlebars.
I will finish the tutorial and any help is appreciated.

Thanks
Roberto

> On Sat, Jan 21, 2012 at 1:09 PM, Peter Bacon Darwin <p...@bacondarwin.com>wrote:
>
>
>
>
>
>
>
> > OK, I agree that the exciting bit is the spine-adapter but this is not the
> > most simple Spine app that one can push to Couch.
> > It is the second most simple app.
> > Actually, I don't think we do need Hem as long as we are not using .jeco
> > templates (this is an extension to .eco that Alex created, which is only
> > supported by Hem).
>
> > Tell you what I will knock up a couple of simple apps and stick them on
> > GitHub to base the discussion around.
> > In both cases there will be no use of Duality or Dust or Handlebars (I
> > hope).
>
> > Pete
>

[Roberto Garcia]

Pete, can I put this links as a reference in the
Getting_started_with_Spine?
Roberto

On Jan 21, 9:05 pm, Peter Bacon Darwin <p...@bacondarwin.com> wrote:
> I totally agree that in most cases one wants to be running Spine apps that
> use the CouchDB for data storage but since we are talking about tutorials
> here, surely it is easier to get up to speed if we take it one step at a
> time? You'll notice that Caolin's Simplest Possible

> App<http://kan.so/docs/Simplest_possible_app> doesn't

[Peter Bacon Darwin]

Of course. My pleasure

...from my mobile.

[Caolan McMahon]

Wow, looks like you're making some great progress here! :)

I agree with Pete that we should try to keep this guide as simple as possible, it is to get people already familiar with Spine developing apps with Kanso as quickly as possible. That said, the spine-adapter is probably important enough to be included.

Looks like what you have already is great. The directory structure seems a little prescriptive (though perhaps this is a structure Spine developers expect?). I also think we could trim down the dependencies a bit, and probably not prescribe a templating library at this stage. I'll have a go at removing some dependencies then if Roberto and Pete could review it, that would be great.

Any useful info we remove in the name of simplification can be added to subsequent guides on separate pages, which we can link to from the bottom of this 'Getting started with Spine' page.

I'm planning to link to this page from the main Kanso Install page under 'Spine'. I'll also link to the existing 'Simplest possible app' page under 'No framework' (or something similar). Ideally, I'd also like one to Backbone too... I might take a look at that myself soon unless someone wants to volunteer :)

[Roberto Garcia]

Great Caolan!
Can you change the wiki for me, triming down the dependencies?

[Peter Bacon Darwin]

Hi Guys,

I have revamped my Kanso-Spine-Todos application so that it doesn't depend upon Hem any more.

It is built entirely using Kanso packages.

It uses a similar folder layout to what is generated by the Spine app.

The whole thing is written in coffee-script, stylus and eco, very much following what is presented in the MaccMan version.

All the coffee-script is stitched up into CommonJS modules that are dumped into modules.js, making front end development a doddle, just "require and go". I have knocked up a few Kanso packages to support this development (eco-1.1.0, es5shim, json2).

Note that the currently published versions of the jquery and stylus-precompiler packages are broken and need to be fixed.  Check out the bottom of the README for more info.

Hopefully this provides a bridge between the tutorials for Spine and using Kanso.

(Just to keep everyone happy, I will now add the CouchDB backend storage!)

Enjoy!

Pete

[Roberto Garcia]

Show Pete!
Can you rewrite the wiki with your example?
Once ready we include the CouchDB backend storage.
Thanks a lot.
Roberto

On Jan 24, 10:32 am, Peter Bacon Darwin <p...@bacondarwin.com> wrote:
> Hi Guys,
> I have revamped my

> Kanso-Spine-Todos<https://github.com/petebacondarwin/kanso.spine.todos>application

> so that it doesn't depend upon Hem any more.
>
> It is built entirely using Kanso packages.
> It uses a similar folder layout to what is generated by the Spine

> app<http://spinejs.com/docs/started>
> .

> The whole thing is written in coffee-script, stylus and eco, very much
> following what is presented in the MaccMan version.
> All the coffee-script is stitched up into CommonJS modules that are dumped
> into modules.js, making front end development a doddle, just "require and
> go". I have knocked up a few Kanso packages to support this development
> (eco-1.1.0, es5shim, json2).
>
> Note that the currently published versions of the jquery and
> stylus-precompiler packages are broken and need to be fixed.  Check out the

> bottom of the README<https://github.com/petebacondarwin/kanso.spine.todos/blob/master/read...>for

> more info.
>
> Hopefully this provides a bridge between the tutorials for Spine and using
> Kanso.
>
> (Just to keep everyone happy, I will now add the CouchDB backend storage!)
>
> Enjoy!
> Pete
>

[Peter Bacon Darwin]

I'll see if I can get the back end working then we can discuss how to move the wiki forward.

Pete

[Andy Gold]

Hi Roberto

I'm new to this group and looking at Kanso etc. I just tried to kanso
install from your kanso.spine.todos application below, it says Error:
No package found for eco-1.1.0. Is there a reason this is missing from
the kanso modules now?

Thanks

Andy

On Jan 24, 1:32 pm, Peter Bacon Darwin <p...@bacondarwin.com> wrote:
> Hi Guys,
> I have revamped my

> Kanso-Spine-Todos<https://github.com/petebacondarwin/kanso.spine.todos>application

> so that it doesn't depend upon Hem any more.
>
> It is built entirely using Kanso packages.
> It uses a similar folder layout to what is generated by the Spine

> app<http://spinejs.com/docs/started>
> .

> The whole thing is written in coffee-script, stylus and eco, very much
> following what is presented in the MaccMan version.
> All the coffee-script is stitched up into CommonJS modules that are dumped
> into modules.js, making front end development a doddle, just "require and
> go". I have knocked up a few Kanso packages to support this development
> (eco-1.1.0, es5shim, json2).
>
> Note that the currently published versions of the jquery and
> stylus-precompiler packages are broken and need to be fixed.  Check out the

> bottom of the README<https://github.com/petebacondarwin/kanso.spine.todos/blob/master/read...>for

> more info.
>
> Hopefully this provides a bridge between the tutorials for Spine and using
> Kanso.
>
> (Just to keep everyone happy, I will now add the CouchDB backend storage!)
>
> Enjoy!
> Pete
>

[Andy Gold]

That last post I sent was meant for Peter not Roberto, sorry.

Thanks

Andy

On Jan 24, 1:32 pm, Peter Bacon Darwin <p...@bacondarwin.com> wrote:

> Hi Guys,
> I have revamped my

> Kanso-Spine-Todos<https://github.com/petebacondarwin/kanso.spine.todos>application

> so that it doesn't depend upon Hem any more.
>
> It is built entirely using Kanso packages.
> It uses a similar folder layout to what is generated by the Spine

> app<http://spinejs.com/docs/started>
> .

> The whole thing is written in coffee-script, stylus and eco, very much
> following what is presented in the MaccMan version.
> All the coffee-script is stitched up into CommonJS modules that are dumped
> into modules.js, making front end development a doddle, just "require and
> go". I have knocked up a few Kanso packages to support this development
> (eco-1.1.0, es5shim, json2).
>
> Note that the currently published versions of the jquery and
> stylus-precompiler packages are broken and need to be fixed.  Check out the

> bottom of the README<https://github.com/petebacondarwin/kanso.spine.todos/blob/master/read...>for

> more info.
>
> Hopefully this provides a bridge between the tutorials for Spine and using
> Kanso.
>
> (Just to keep everyone happy, I will now add the CouchDB backend storage!)
>
> Enjoy!
> Pete
>

[Caolan McMahon]

Hi Andy,

I think that package has been renamed to just "eco" instead of
"eco-1.1.0", update your kanso.json accordingly and try "kanso
install" again. If that works you might want to raise an issue or send
a pull request on the kanso.spine.todos application.

Caolan

[Peter Bacon Darwin]

Hi Andy,

Sorry, I am in the middle of updating that package and the example application.

Caolan is right though.  If you change the dependency to eco rather than eco-1.1.0 then it should (fingers' crossed) work.

I'll finish my changes and push a definitely working version tonight (GMT) so if you can't get it working then just pull the repos again tomorrow.

Pete

[Andy Gold]

Hi Pete

I just tried again today with the updated version, and now I get
Error: cp: /Users/andygold99/.kanso/cache/eco/1.1.0-kanso.1/package/
node_modules/kanso-precompiler-base: No such file or directory.

All the other modules download and install fine, just this eco one is
not working.

Can you check if its the same for you, or am I doing it wrong. I just
downloaded the repo and ran kanso install from within the folder.

Thanks

Andy

On Jan 31, 6:16 pm, Peter Bacon Darwin <p...@bacondarwin.com> wrote:
> Hi Andy,
> Sorry, I am in the middle of updating that package and the example
> application.
> Caolan is right though.  If you change the dependency to eco rather than
> eco-1.1.0 then it should (fingers' crossed) work.
> I'll finish my changes and push a definitely working version tonight (GMT)
> so if you can't get it working then just pull the repos again tomorrow.
> Pete
>

> On 31 January 2012 17:06, Caolan McMahon <caolan.mcma...@gmail.com> wrote:
>
>
>
>
>
>
>
> > Hi Andy,
>
> > I think that package has been renamed to just "eco" instead of
> > "eco-1.1.0", update your kanso.json accordingly and try "kanso
> > install" again. If that works you might want to raise an issue or send
> > a pull request on the kanso.spine.todos application.
>
> > Caolan
>

[Peter Bacon Darwin]

Hi Andy,

Sorry again.  I am finding jumping from npm module to kanso package and back again a very confusing development process.  Without getting into the detail, my eco package was picking up the module from a local folder so it worked on my machine without including it in the package.  I am adding it now and will republish.

As a quick fix you can go into the packages/eco folder and run

  npm install kanso-precompiler-base

to get the module in there and it should then work.  I will let you know when the fixed version of eco is published.

Pete

[Peter Bacon Darwin]

Hi Andy,

I have pushed a new version of eco (1.1.0-kanso.2).  It should contain the kanso-precompiler-base module.  You need to delete the packages/eco folder and then run kanso install again.

Alternatively you can just start with a fresh clone of the kanso-todos github repository and just run kanso install.

By the way, this new version includes CouchDb integration. I haven't got the URLs to quite line up yet but you can see in the browser console (in Chrome or FireBug) that the app is sending ajax messages to what it thinks is the CouchDB.  I'll try to fix this soon.

Let me know if you have any further problems.

Cheers,

Pete

[Andy Gold]

Hi Peter

Thanks, the repo code works now when I run kanso install.

Andy

On Feb 1, 2:04 pm, Peter Bacon Darwin <p...@bacondarwin.com> wrote:
> Hi Andy,

> I have pushed a new version of eco (1.1.0-kanso.2).  It should contain the
> kanso-precompiler-base module.  You need to delete the packages/eco folder
> and then run kanso install again.
> Alternatively you can just start with a fresh clone of the kanso-todos
> github repository and just run kanso install.
> By the way, this new version includes CouchDb integration. I haven't got
> the URLs to quite line up yet but you can see in the browser console (in
> Chrome or FireBug) that the app is sending ajax messages to what it thinks
> is the CouchDB.  I'll try to fix this soon.
> Let me know if you have any further problems.
> Cheers,
> Pete
>

> On 1 February 2012 12:48, Peter Bacon Darwin <p...@bacondarwin.com> wrote:
>
>
>
>
>
>
>
> > Hi Andy,
> > Sorry again.  I am finding jumping from npm module to kanso package and
> > back again a very confusing development process.  Without getting into the
> > detail, my eco package was picking up the module from a local folder so it
> > worked on my machine without including it in the package.  I am adding it
> > now and will republish.
>
> > As a quick fix you can go into the packages/eco folder and run
>
> >   npm install kanso-precompiler-base
>
> > to get the module in there and it should then work.  I will let you know
> > when the fixed version of eco is published.
>
> > Pete
>