I'm choosing frameworks for my next project and got stuck on a tricky problem: How to share templates between server-side PHP and client-side Javascript?
On server, my application is going to be written in PHP, using Symfony, Twig, and MtHAML. I have few templates as an early GUI prototype and I really like HAML as it cuts my templates in half.
On client, I would like to use Vue.js or React or something like that (and say bye to jQuery spaghetti monsters). I haven't decided what to use here yet. I like ES6 class syntax. The client side is going to be a set of relatively simple SPAs — old-school standalone pages with some JS to make them more interactive. Therefore, there will be no routing nor manipulating browser history on client, but still, I want to update already loaded page here and there.
So, I will need to use templates at two places: server-side in PHP and client-side in Javascript. The question is, how to share one template on both sides?
I'm thinking about compiling the HAML templates with Dust.js/php (Mustache is too dumb) into Javascript or some similar aproach. Another way could be to render Vue templates from HAML (Gitlab does that) and somehow pre/post-process them into PHP templates. But I'm sure there were many people dealing with this problem too. Unfortunately, most resources on the Web are outdated or very messy. Is there some ready-to-use sollution?
I was solving similar problem before and the best solution for me became to use Symfony to build a decent API and then some js framework for frontend. Juggling with templates between two environments was a real pain. Maybe you'll choose different approach, just a suggestion from me...
I just wondered if there is any existing framework or someone has experiences with using entirely static HTML templates that get filled with data provided via JSON from the server.
The HTML pages with JavaScript support should fulfill the role of the View whereas Controller and Model are handled by the PHP on the server side.
Views would the query via JSON-RPC or similar data from the Model and then render the results by manipulating the DOM.
I pretty much like this idea, it came into my mind weeks ago but I never found something on the web experiences with that or even already existing framework.
But maybe I am just a noob at googling?
Maybe one of you can help me out here.
Thanks in advance
Have a nice day!
Benjamin
This is very much possible and often found with Rich Client Applications. The first call to the application delivers the initial UI with any behavior defined in JavaScript files. Any further interaction is done via Ajax.
For the serverside, have a look at
Zend_Rest_Server
Zend_Json_Server
though this could just as well be a regular MVC application too. A Json or XML Response can still be considered a View. It's up to you to code your controllers to return appropriate data.
That's pretty much how Google do a lot of their stuff - do a view source on Gmail to see how much data they return in the HTML.
It's called Ajax. (That's not meant to sound too sarcastic - Ajax doesn't necessarily work like this, but ajax-based apps will do a lot of the rendering logic via JavaScript rather than via server-side code.)
You need a framework that doesn't limit you to any specific way of handling the view component of your MVC application and I think Zend Framework would be your best choice. It also has a great integration with DOJO and that makes it a lot easier to achieve what you need.
I'm starting to architect a quite complex web application. The implementation is probably going to be done in PHP, though if there are impressive reasons to choose a different environment I might be convinced.
I've looked at tools like Symfony and CakePHP. The problem is that it feels like they're relatively low level for a modern Web 2.0 application. They handle the basic things like MVC and scaffolding, but not the more advanced UI elements that I'm looking for. Here are some of my requirements:
Single page architecture. With minor exceptions, there should be no page refresh. All actions are done via ajax, the way it's done in gmail, and to a lesser extent in Facebook.
Ajax layout and widget handling. Not only the application doesn't refresh the page, but the developer can specify the layout and load various widgets into different parts of the page. This is somewhat like iGoogle, but should be better integrated.
Support both on the client side and server side for AJAX widgets. It should be trivial to display the result of a select statement in an AJAX table/array like http://developer.yahoo.com/yui/datatable/. This should also apply to other widgets including
Trees
Menus
Forms
Speaking of forms, there should be easy integration with client side validation
Signup/Authentication/Authorization. Including all the housekeeping things like forgot my password, CAPTCHAs, etc.
There's more, but I think I've given enough details so that you get an idea for what I'm looking for. Basically, I'd like to engineer a modern Web 2.0 app and skip writing, testing, debugging things that most web applications need to do. And yes, I know I can take YUI or jQuery and slap it on top of one of the regular platforms, but then I'd have to write all the glue. Now if there are modules that do this, that would be interesting.
So if you say, take Symfony + modules xyz + jQuery and there's your answer, I'd be happy to hear that.
Finally, in terms of priority, I'm looking for something that's scalable, reliable, well engineered more than something that's easy to learn and deploy.
Since you are looking for all things AJAX, why not try GWT? Its not PHP I agree, but it makes writing AJAX applications easy for developers.
I agree with #Iznogood. What your looking for is not actually a framework but a talent.You can make any framework as "igoogle-ish" as possible if you know what your doing.
I suggest look for a framework with a huge and active community like, CI, Cake and Jquery. Search/ask the community for the specific things you need. Plug it in and Presto!
But I'm afraid you'll have to write some of it.
If you don't mind using Java, there is ZK:
http://www.zkoss.org/
I'd prefer using this over GWT.
In php, you might want to consider Cjax http://cjax.sourceforge.net/.
It is MVC oriented, and has a very generic API, with full support for customization, including the development of plugins (There is a full Plugin API available, including documentation, Plugins can be built in PHP and JavaScript in combination -- see uploadify and validate plugins).
It can access all JavaScript functions, Objects and proprieties, and elements properties and functions from PHP server side, with one line of code.
In Cjax,
you can execute ajax actions, inside controllers (ajax requests) - without a line of JavaScript. this allows you to fully function without refreshing the page. It also allows you to access all Js objects from PHP. A good sample that reflects this is the "recursive ajax request" see that demo. The API can be used on page load, when the page first loads, and within every single ajax request.
Do take a look at the documentation and to the 20+ demos included, and no where you will see a single line of JavaScript. It allows you to manipulate elements, containers, request ajax, submit ajax forms, creates overlays, upload files through ajax, all from the server side. Take a glace at the API Table.
It has support for both, server side ajax, and client side, (see plugins JavaScript Documentation)
It plays nice with jQuery - the validation plugin in jquery is full executable in PHP without a line of JavaScript (see http://cjax.sourceforge.net/examples/plugin_validate.php without any custom line of Jquery inside the framework, it's all plugin's work). Ajax Responses from Jquery also get processed by this framework automatically, so using Jquery's Ajax function API wise, is the same as if you were using the Framework's Plugin's JavaScript Ajax Functions.
And you would just have to take your time learning more about it, because it has quite a few more tools that I am sure you'd find useful.
Currently there are two official releases, the generic release and
there is an official release for CodeIgnater of this framework (and it is the leading ajax option for codeignater) , and works great in conjunction other PHP Frameworks and without them.
Signup/Authentication/Authorization. Including all the housekeeping
things like forgot my password, CAPTCHAs, etc.
This is something that you can build within an ajax controller, the framework itself its meant to be a generic "AJAX" framework, so if you are looking for none ajax features, you will need to build them or integrate other PHP Framework with Cjax (such as Codeignater).
I do not know if this matches all of your criteria, or if you ever will find one. However, I like the Zend Framework myself.
As for the UI and AJAX portions - the server side technology matters little, and it's more about browser-side technology and interaction mechanisms, as well as DOM manipulation.
jQuery is my favorite for that. As for the PHP back-end, I tend to develop it with my own codebase that's grown with me over the years.
But all this takes a lot of practice, knowledge, education, research, reading, and posting questions on StackOverflow.com ;)
I would recommend symfony PHP framework since it has very good support for every feature you mentioned, and it can be easily integrated with Zend Framework - as of version 2.0 coming this year it would be integrated in the package. You can easily set symfony to handle AJAX requests so that it would be perfect transparent layer handling server side.
For me, if you look at THAT heavy AJAX, I would recommend searching for some good JavaScript framework - such as Ext.JS - that would handle all client side functionalities.
For the front-end part of your app, you might want to have a look at SproutCore ( http://www.sproutcore.com/ ).
Building a Web application with SproutCore feels more like configuring components than writing code.
There is no glue code.
On the backend all you have to do is accept and emit JSON.
Depends what sort of level you're looking at. If by 'framework' you mean something like Zend or Symphony, then to be honest all the big ones are about as good as each other. They all have strong points and weak points, but none will really meet your criteria.
But your question implies you're looking for something more than that kind of framework. Maybe you're looking for a full-blown CMS platform like Drupal, Joomla or Wordpress?
In that case, again, you need to consider your needs verses the capabilities and pitfalls of each system.
Drupal, for example, has masses of modules, is very powerful, and easy to write your own modules, but isn't object-oriented and doesn't really do MVC, so if that's your bag then you may find it hard to get on with. Wordpress is much easier to get going quickly but is less flexible once you start getting deeper into it.
But again, they all have strengths and weaknesses. If one was clearly the best, it would be an easy choice. But at the end of day perhaps it's better to have several good quality options to choose from.
Have a look at Ext JS, it is pretty good. If it is a commercial project you are doing it isn't free but not too expensive either. It also has a GWT version if you prefer that.
This is only for the front end but it is not too complicated to use any backend that can emit json.
CakePHP is pretty good
I realize this is a very generic question, but I guess I'm not really looking for a definitive answer. Being new to PHP frameworks I'm having a hard time getting my head around it.
Javascript frameworks, especially with UI extensions, seem to have their sort-of MVC-like approach by separating your JS code from your design. It just seems like it would get confusing to use an additional MVC framework on the backend.
Is this commonly done for primarily AJAX-driven applications? Is there an accepted/common way of doing it?
It's the next logical step from MVC, in my opinion. You already separate your data access (model), from the business logic (controller), from the output (view) - now you're just separating behaviour from markup.
In my experience, it works really well with AJAX features, since you only need to change your View to return the necessary information as JSON or XML.
A quick example of how it can fit together for a Zend Framework app (and this is from a demo app I wrote a few months ago):
Use the MCV Framework to build a fully functional site (which works without javascript).
Modify the controller to understand the difference between a 'normal' request and an AJAX request (Zend's context switching makes this easy).
Add Javascript (in my example jQuery) to cleanly replace the links with AJAX events.
In the end, the PHP app knows that an AJAX request needs an AJAX response (less bandwidth, less processing, only JSON or HTML 'snippet'), but a normal request needs an entire page generated.
Basically, you're just using AJAX to request (or update, or add data to) the 'view' template, without having to process the entire layout. The Zend Framework Context Switch Action Helper may help this make more sense.
It's worth mentioning that context switching works well in making a request available in different formats - HTML/XML,CSV,etc.
Its a very good idea, since the PHP MVC frameworks are bundled with JS frameworks:
Zend comes with Dojo
Symfony comes with Prototype and script.aculo.us
CakePHP comes with Prototype and script.aculo.us or jQuery (future release)
updated link, thanks "Exception e".
Personally we are using Zend (MVC as well as other aspects of the Zend framework) with jquery and it works very well together. Since not all of your interaction from the html page will be via jquery (ajax) then a standard MVC architecture is highly recommended. You certainly want the layers of your architecture (separating the model and the view) and having jquery is (at least to me) and additional "feature" of being able to execute your MVC asynchronously.
It just seems like it would get confusing to use an additional MVC framework on the backend.
No need to worry about that. You can use zend framework and extjs for example independently while developing, they are really separate products. The dependencies between these layers should be kept simple. No need to worry.
The coupling is low, you only need to set up means to query data from your server-app and do whatever you want with in on the client side. The line between these systems is simple and won't confuse you.
Extjs doesn't really has an mvc structure imho. It offers predefined rich components. You glue these components with some configuration and set up the urls of your server where data can be fetched from.
How do you get your zend mvc respond to ajax? I recommend you to view the presentation about zf ↔ ajax from the zf's project lead.
I'm currently developing (another) Open Source CMS in PHP and I'd like to use javascript controls especially for the admin panel. The question is, are there any open-source, freely distributable controls (for creating javascript Editable Grids, Trees, tabs etc ) that have an interface for PHP ?
I've experimented with ExtJs in the past but although its usability and beauty when it comes to implementing it with php, it's a frustration. I've also tried PHP-EXT and ExtPHP libraries but I was disappointed by their generated code, their limited implementation of ExtJs and lack of proper documentation.
Coolite is a nice implementation for .NET but I haven't found anything similar for php. That surprised me, taking into account the years of php development on the market.
Off course there's always the option of implementing different libraries for each component but this would become an overwhelming task, besides the incompatibilities and the difference in look&feel that are going to come up.
Any suggestions?
Thank you in advance.
I really like jQuery with their new jQuery UI. Also, browse through their plugins list for more tools.
But you might like mootools too.
Really the best thing to do is just to write the JavaScript interactions between your JS library and PHP yourself. Overall generated code wil never be fully changeable and most JS libraries take a mere day to learn how to use.
Best bet is to go with jQuery and jQuery UI as it has a lot of documentation and support.
You might also like the Yahoo! User Interface Library which might be closer to Coolite.
There is one framework I've seen for producing thick client web apps called Cappuccino. Might be overkill for what you want to achive, but the demos just look so tasty.