I am a PHP and ExtJS user. I am looking into developing an application using a good PHP framework (CakePHP; good as in "I consider this good for me") and ExtJS version 3. What I would like to achieve is a complete Ext viewport with many grids and functions that would call PHP urls for retrieving data, saving data, edit/remove data (not just for grids, also for treepanel and such). I would like to use CakePHP as backend with all its capabilities for executing these functions. My first goal is to integrate the obAuth component (or any other secure authentification plugin for CakePHP) with an ExtJS 3 login interface. I am searching for the best method of combining these too so that I can easily restrict functions based on the usergroup access. I am thinking of a setup where the logged in user makes one post from Ext regarding the execution of a function and the CakePHP response made present as errors or notifiers through Ext alert boxes.
Do you think this is possible ? Any thoughts of an ideal config for this ?
Thank you.
If you're going back and forth between JavaScript and Cake a lot the first thing you might want to do is override or extend the default View class so it'll package variables you set in the controller automatically into a JSON array or whatever you prefer. That'll save you from having to make a view for each action and/or overriding the layout each time. Study cake/libs/view/view.php and/or cake/libs/view/media.php, you can create custom views in app/views/.
Make use of the RequestHandler Component a lot to reuse logic both for normal views and AJAX.
Beyond that it's normal JS with a PHP backend.
This is actually very easy. First, integrate the obAuth Component into a basic CakePHP install, to see if it works properly and doesn't have any strange quirks. Once that's done, get to work on your frontend.
Your frontend should be designed entirely with ExtJS components. Either design your frontend with ExtJS or via HTML templates, but try not to do both, as it gets confusing and hard to maintain. I recently did this, and every controller action had a view that set up the DOM with some basic elements (a header for the page, any divs I needed to bind components to, and the .js file that was specific to that page/view).
Then, make your application RESTful. All of your ExtJS components can read data from a DataStore (or can just take a URL as the data source), so you just give them the paths you'd like and you're done.
Check out Bancha, it integrates ExtJS 4 and CakePHP 2.
It does this by doing all the communication in the background using an completely implemented Ext.Direct for CakePHP.
cheers
Roland
Related
I am not sure, what is conceptionally thought the right way to serve data from an php mvc backend to the frontend.
Basically, I was happy with the things in angularjs: Put some controllers into DOM and some directives for events like clicking, if conditions etc.. However, times have changed and we have to move on.
So here is my question: I have an huge PHP MVC backend with an template engine. And I would like to keep the things in place, because serving only json to the frontend would completely remove the View out of MVC.
Maybe serving some inner views as json would be ok. But I need the HTML structure to be served and prerendered by PHP. So mixed syntax with php template engine and angular. Let's take the example on angular or vue2 with TypeScript (that is what I prefer to use in my apps).
How to do this correctly to stay future-save? I mean this component style is nice, but I need to get it combined with my backend in smooth way. If I would just give an templateUrl, how could I make sure to use the full advantage of caching technologies and stuff like that from the frontend?
Creating hybrid angular apps is a bit tricky because if handling state is tricky by itself in angular, try combining that with the state in php.
The best way I've found is to think of angular as a widget library.
By creating widgets (components) that contain do the heavy lifting UI wise you can come a long way.
I wouldn't try combining angular components templates with php, but instead pass data into the angular components. That way you can easily test the angular components and you will be able to reason about what is in angular land, and what is in hybrid land.
If you are debugging an angular component, you know it by checking the data coming into the component if the bug is in typescript or php.
A couple of scenarios.
Form validation
You have a form that angular handles validation on, but then submit it using the normal <form action="/submitform" method="post">
Advanced form
You have a more complex form possibly with multiple views where you handle post the data via a json api and angulars Http service.
Graphs
Presenting data graphically via a graph widget.
Howto
Make your whole php app an angular app but don't use angular's routing.
inject php state into components via #Input()
<my-component showinfo="<?= $showInfo ?>"></my-component>
By passing in all php variables via inputs you will be able to test the angular components easily via jasmine.
angular-cli
I would probably use angular-cli to create the app. The problem there is that it defaults to use webpack dev server which only runs in memory.
Instead use
--watch so that angular rebuilds when files change
--output-hashing=none so that angular always outputs the same filenames so that you can include them in your app
--output-path= to specify where you want the build files
ng build --watch --output-hashing=none --output-path=my/php/public/folder
I just started to use PhalconPHP 1.3.1 for an app for my studies' master thesis. Isnt totally developed but I'm working on the CRUD for the moment, so after have some functionality and the UI working I decided to start to introduce this amazing framework. I'm was new on web development, MVC and ORM patterns till I started this thesis. It's first time I use template engines as well. For now I'm successful porting all, but I'm afraid that I'm not doing it in the right way. I started adding my code to the PhalconPHP bootstrap created with the dev tools. Now I start with the questions:
1º- As is a web app that In the future I'll wrap with Phonegapp, I'm using AJAX load function, to don't load all the menu and libraries every time that the id = "content"change. For this I use $('#content').load(); for the content and historyjs functions to change the URL. I didn't do any change to the original code apart of configure on Nginx the clean URLs as
try_files $uri $uri/ /index.php?_url=$uri&$args;
In the documentation shows different way of using AJAX, so I'm afraid that I shouldn't be using this way, breaking somehow the MVC pattern.
2º-Related with this I add to the AJAX dynamically load URL a variable ?header=yes that indicates me to just load the content. So for this in every controller, in the indexActions I do:
$header = filterinput(INPUTGET, 'header');
$this->view->setVar("header",$header);
And after I just check with volt the variable. Is it the right way? I thought to do all with volt but I haven't found how to.
3º-Also, because the menu is common to every page, in the main index.volt(in the folder view) I include the menu depending on the variable. Is it OK as well? Or should I move it to the different views?
4º-Because of 1º, I made my own click functions where I push a new URL and load the content, once again I'm affraid I'm breaking good practices of Phalcon.
5º-The JS/HTML part is in plain code for now, I just replace the PHP part with volt syntax. Should I replace as well code like
<link href="../css/stylefile.css" rel="stylesheet"/>
For its volt syntax?
I would like you to clarify me and give suggestions in case of need of how to change it.
I am using Phalcon and volt at the moment for a commercial project and I find new ways to do things all the time, you have to really try out different methods and see if it works for what you need. if you are looking to work on multiple devices with the same data I would look at the phalcon micro version and use that as a rest api and then create another project which uses the phalcon mvc version to do the client side rendering then use ajax to get the data from your phalcon micro project. This way if you go native mobile, desktop, tv, tablet whatever your needs you don't have to rewrite your code you just need to create a new frontend.
Another thing to look into are partials, you can separate out your header, footer and navigation inside a partial and call them like so:
{{ partial("partials/layout/footer") }}
You also want to look at creating a proper rest api url structure for your phalcon micro project. if you want to get all users you can do something like /users and to get a user by id you can do /users/1 that is very very basic so I have copied in a great article below to give you more information on rest api and a good structure.
You can also set volt variable like so:
$this->view->header = $header;
and call it like so:
{{ header }}
I hope this gives you a little idea, but just try it out and read some articles from different blogs to get an idea what other people are doing, the Phalcon forum and IRC channel is also a really good place to get help
Some good articles and resources
http://inmensosofa.blogspot.co.uk/2011/10/look-into-various-rest-apis.html
http://docs.phalconphp.com/en/latest/reference/micro.html
As I'm new to PHP previously i worked on JAVA, currently for my web application i'm using codeigniter. I want to configure a filter where i can filter every request to identify whether any harmful data is coming from user or not(same as java filter).
Codeigniter have Security and Input Class, Look:
http://ellislab.com/codeigniter/user-guide/libraries/security.html and
http://ellislab.com/codeigniter/user-guide/libraries/input.html
AFAIK, That's all you can get. CI is just a small (IMO) Framework. If you want more, you need to create your own by creating library and/or extending the core.
I'm building an IMDB.com like website using PHP/jQuery and a MVC approach (no OOP).
I have an index.php base controller to 'rule them all' :), a controllers folder with all the controllers, a models folder and a view folder.
In some pages of the website I have tabbed navigation, when the visitor clicks on one of those tabs to get more information, jQuery gets that data using the $.post or $.get method and shows it on the tab container, obviously without refreshing the page.
The problem is that those pages loaded by ajax are also generated using controllers, models, and views, and the things are getting a bit complicated for someone like me ( = 'no experience'). To dynamically get the data I some times need to include a model twice, include an include in an include in an include, send information multiple times, connect with the database again, and all sort of things like that and I'm sure there is a better and prettier way to do this.
I'm searching for the best approach and common methods for this. I have no experience working with a big project like this. This is a personal project so I have full control and every answer is welcome.
Thanks!!!
You can check the X-Requested-With header that most js frameworks send to see if the request is coming via ajax. Then you can only output certain data and not the "entire page".
Not sure why you need multiple includes like you say, maybe you need to rework your logic.
Post some code and we can be of better help.
"To dynamically get the data I some times need to include a model twice, include an include in an include in an include, send information multiple times, connect with the database again, and all sort of things like that and I'm sure there is a better and prettier way to do this."
I think you need a better 'design' for you MVC application. Multiple includes - i am guessing in the different layers of the MVC framework might be indicators that your design needs more attention.
I'll try and be short:
Other frameworks i.e. handle requests via XMLHTTPRequest by AMONG others, disabling or enabling the VIEW or LAYOUT explicitly - check Zend Framework - (e.g. you need to send a JSON encoded string as a response). These requests are handled just as any other request.
I would suggest you have a look at other popular frameworks. Check the application design and layout, and pay attention on the Routing and Dispatching of Actions. I suggest you follow this path since as you say you lack experience.
good luck with your project.
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.