the best way to make a SPA/non-SPA page/site with Liferay 7

[Viktor Dzundza, modifié il y a 7 années.]

Hi everyone,

Does anyone can provide a useful link how to create a SPA page/site with LifeRay?

I am looking a latest information about it and couldn't find any useful link.
How much methods are in the lifeRay to do a some frontend stuff with any js framework(backbone, angular, ember, react) ?


Best regards,

Viktor

[David H Nebinger, modifié il y a 7 années.]

Liferay 7 is already spa-ish on it's own. If you create a regular Liferay MVC portlet, have it move around from one jsp to another, just normal stuff, but you deploy this on Liferay 7, you'll find that you're not doing full page refreshes and that the automatic SPA handling is working really well, all without adapting how you might code a portlet.

[Viktor Dzundza, modifié il y a 7 années.]

I want to use angular for making SPA page with different functionality. Should I create own theme with SPA app or portlet?

[David H Nebinger, modifié il y a 7 années.]

I would do at a portlet level just because the templates, etc would be best served from a portlet level.

Note that there are things you have to be concerned about using angular in portlets:

• Context is not persisted server side, so if you navigate to another portal page and come back, your angular app is basically reset to the beginning.
• Angular will fight w/ other portlets on the page to own the address bar; remember all angular context is basically kept in the address bar, so if other portlets/code are trying to own the address bar this can pose problems.
• Angular won't have dynamic access to i18n, portlet prefs or permissions like a regular portlet. You basically have to retrieve everything you need at first render of the portlet and pass it via javascript.

Just some things to keep in mind. Angular can be a workable solution, but you have to be prepared to handle the issues yourself.

[Viktor Dzundza, modifié il y a 7 années.]

Thank you for answer, I am looking in this way but found one issue with SPA. Liferay provide own spa so when I go to another page and after that return back to page with angular SPA portlet, it won't initialised. How can I disable spa support for one page? Or maybe there are another ways to solve these.


Best regards,
Viktor

[David H Nebinger, modifié il y a 7 années.]

This is not an artifact of Liferay's SPA implementation, it impacts Angular portlets in general.

Angular does not store server side context. It handles navigation, state context, etc using the address bar to pass details around. This works in angular servlets because you are contained within the angular app and cannot easily navigate away.

The portal is different. It exposes obvious nav targets in the navigation bar. Other portlets on the page can change the address bar and affect navigation.

These are all cases that show that angular does not own the address bar when running under Liferay and it will be up to the angular portlet developer to work around these issues...