Best way to build a web application with MODx?

Hi All,

We're making a web application, a normal app with a couple of views a UI with some accordions, input types and dropdows. nothing really fancy. an dynamically updating data with AJAX.

We're looking into our options for building this with MODX and are wondering what would be the best approach. I've build more than enough websites with modx but never en application.
We're looking into Knockout and Angular with a view snippets/resources to handle the AJAX calls.
But we could also use getChunks and HTML-chunks for tempting.
Does anyone have experience with this and could advise what is a good approach? is there a tutorial for this?

What techniques/frameworks would you use to build an application with MODX?

Thanks

Rdg

I've used ExtJS once several years ago, then used JQuery plugins and JQuery UI since then. I recently decided that my next application will use Angular.

There is some official documentation tutorials on using ExtJs, mostly geared towards developing Customer Manager Pages, but they might be helpful. There also are a few official documentation tutorials for working with JQuery. There is also the AJAX-Revolution extra that provides a heavy-duty Javascript framework.

http://rtfm.modx.com/revolution/2.x/developing-in-modx/advanced-development/custom-manager-pages/modext/modext-tutorials
http://rtfm.modx.com/revolution/2.x/case-studies-and-tutorials/loading-pages-in-the-front-end-via-ajax-and-jquery-tabs
https://forums.modx.com/thread/79187/support-comments-for-ajax-revolution

I've started to build some frontend-apps with MIGXangular.
There are allready some working input-types and each project(package) can have its own custom-input-types.

The Form-windows with tabs are configurable with the same MIGX-configurations, used for MIGXdb for extJS in the backend.

In theorie its possible to use the same configuration and processors on the frontend with MIGXangular and on the backend with MIGXdb(ExtJs)

Its also possible to build custom-stuff arround MIGXangular.

There is nothing official released, yet, and there isn't a documentation, but a package can be found at github:

https://github.com/Bruno17/migxangular

@Bruno, thanks we'll look into it.

@Susan. how would you call the url form AJAX? a snippet on a modResource and the calling the 'myPage' in AJAX(url: 'myPage.htm') or call a PHP directly (downside there is i won't have acces to $modx object, right?) Ajax (url:myCode.php)

Ralph

a snippet on a resource with a blank template is the easiest way to create ajax-connectors.

But you can allways initialize the MODX-object in your custom-php-controller.
There are many examples out there.

One of them:
https://github.com/Jako/AjaxUpload/blob/master/assets/components/ajaxupload/connector.php

Usually I prefer to use a resource with a blank template to hold snippets for my AJAX back-end. Just use the URL to the resource for the AJAX URL parameter.

You can also put a connector.php file in assets/components/yourcomponentname/ and use that. That's how most CMPs do it and they're very similar to a web app. You might look at the Discuss extra, which is really a web app. Its connector is a little more complex, but here's a typical one (from Articles):

@Susan. Thanks that is the way we are doing it now. But i find it a bit complicated. i make all my PHP/snippet code in static fils. so first make a snippet, link to a static file , put the snippet on a resource target the resource in my ajax call... it feels there has to be a cleaner more efficient way of doing this. unfortunatly the link to ajaxRevolution blog is down so it hard to check out without documentation.

@Bruno, @Bobray you both suggest making a connector that is what i will try. I'm i correct in understanding that including 'index.php' instantiates the new MODx(); ? is that a clean way of doing that? because it also does a handlerequest().
Now in index.php it says something about MODX_API_MODE but i can't figure out how this id used. both examples you guys gave do not use that. shoulkd it be used?

thanks
Ralph

This is a great topic. With all the freedom MODX provides there are many ways to accomplish something like this. I've been told that using a central Ajax processor (like a resource with an uncached snippet) is perfectly sensible. I've always wondered though, if making conditional templates that process either then entire page or just what is needed for an Ajax request could make more sense. What if you need to fetch the value of several TVs? Would doing this from the resource itself be faster?

Say you have blog posts and you want to be able to request just their comments over Ajax. The first step is to reduce your blog post template to one Chunk, so it can be included conditionally.


Now we need a way to look for a 'ajax' URL parameter to determine if we should load the whole page or just Ajax request. I will use the getUrlParam Extra.

I'll use the If snippet for the conditional since I think it is more legible than output modifers.


Since this is being done from the resource itself, all of the Template Variables will be available using the syntax. Whether or not this technique has worthwhile performance benefits I'm not certain. Also I always get confused on whether or not both the If and getUrlParam need to be uncached, but I believe they both do.

A longer time ago, I posted this ajaxSwitch - snippet, which I still use often to get different (cached) ajax-responses from that same page.

https://forums.modx.com/forums/thread/15204/change-template-on-the-fly#dis-post-82229