Polymer: Polymer without NodeJs

[Matheus-Ribeiro95]

Hello guys, i'm trying using Polymer with PHP and i need some advices please.
Is this worth?
Can i have Polymer without NODE (meaning is viable)?
Creating a Polymer web-app without npm/bower is a good way?

Btw, im using starterkit with PHP, but i have this issue in the main polymer.html:
polymer.html:1414 GET http://127.0.0.1/polymer/starterkit/src/my-polymer.html 404 (Not Found)

[mercmobily]

Polymer is all on the client side, and is therefore 100% server-agnostic.
It's very convenient to use it with Firebase, but really, it will work with anything. It's _very_ viable to use it with PHP.

Can i have Polymer without NODE (meaning is viable)?
Absolutely.

Creating a Polymer web-app without npm/bower is a good way?

NPM is mainly for server-side node modules>. If you use PHP, you will use whatever your ecosystem requires.
Bower is how Polymer is distributed. It's all client-side, and it's surprisingly simple (some say too simple :D ) -- it's the best (maybe only?) way to install Polymer elements and satisfy dependencies.

Btw, im using starterkit with PHP, but i have this issue

How are you serving your files? Are you using Apache?

[Matheus-Ribeiro95]

@mercmobily
I'm using Windows right now with nginx with bitnami-stack, but i have dual boot machine with Linux and i will produce in it, its just because some softwares...
I discover the error: in "my-app.html", property "page" isn't setting to "view1" by default.
Take a look here to understand:

_routePageChanged: function(page) { this.page = page || 'view1'; },

Using NodeJS, it set to "view1" by default when first load the web-app, but now with PHP the script is setting to "polymer"!? Wtf.
I already tried to set a default value to "page" with "view1", but no success.
Here is the import script to pages, because this isn't founding "my-polymer".

_pageChanged: function(page) { // Load page import on demand. Show 404 page if fails var resolvedPageUrl = this.resolveUrl('my-' + page + '.html'); console.log(page); // logging for test purpose this.importHref(resolvedPageUrl, null, this._showPage404, true); },

Thanks adv!

[mercmobily]

@Matheus-Ribeiro95 I am having a little bit of grief understanding your current setup.
Keep in mind that:

• PHP is a page processor
• The web server is how you serve those pages

Now, back to the basic questions:

• What HTTP server are you using?
• When you load up http://localhost what do you get?

Merc.

[Matheus-Ribeiro95]

@mercmobily
Yes, i know. I'm using Nginx with PHP.
U dont got what i trying to say.
The starterkit here is hosted in "root/polymer/starterkit".
When i open the server with command "polymer serve open" it open in localhost:8080.
But, using PHP i'm acessing this trough localhost/polymer/starterkit port 80.
The "app-location" or "app-route" element is recognizing the route as the first parameter after localhost, get it?
So the route "page" become "polymer".
I think isn't a problem with using PHP, but only with configuration of app-location/route elements.
Now i need to learn about that elements.
Btw, i'm thinking in using NodeJS, but i need to search about some things, because it runs like a big one loop proccess, so if it fails, the all app drop.
Thanks for the help!
Question Solved!

[maury91]

Btw, i'm thinking in using NodeJS, but i need to search about some things, because it runs like a big one loop proccess, so if it fails, the all app drop.

This is totally wrong, if you handle the errors, even with a simple "process.on('error'" your script will never exit.

However, read the documentation of app-location https://elements.polymer-project.org/elements/app-route?active=app-location
Have a look at the last 2 properties.

And as @mercmobily said, what you use to serve your app, don't change the way your app works.
If you want to have polymer in the root, change the root directory in nginx

[Matheus-Ribeiro95]

@maury91
What i know about NodeJS is that a Javascript server-side, so i will handle the errors in the .js files?
How can i handle errors in NodeJS?

About the app route, i downloaded a NodeJS stack by Bitnami using APACHE, still having issues with app-route because when i refresh the page it list like a directory, u know? ("The requested URL /view1 was not found on this server.")
I'm using StarterKit, and the "/view1" after page refresh isn't interpreted as it should.
But using server provided by "polyserve --open" cmd this work amazing!
This polyserve can be used to properly host a WEB-APP?
And why "view1" isn't listed in browser URL bar at the first page load?
Because the code is threating the route, but still have a function to import the pages, isn't this executed automatic by the element "app-route"?
EDIT: Thanks adv! :p

[maury91]

@Matheus-Ribeiro95 Simply install polymer-cli and user polymer serve. You don't need anything else, the when you deploy to a real server you will need something else. But polymer serve just start a simple http server that serve index.html for any missing file.
On apache you just need to put your 404 as index.html

[Matheus-Ribeiro95]

@maury91
Hmm, ok, thank you, i will test!
I'm still a newbie in Polymer, so give a time, i will test all elements :D

[arthurevans]

@Matheus-Ribeiro95 polyserve (or polymer --serve) isn't designed for hosting web apps, it's designed as a test and development server.

The polymer docs mention installing node, but that's because our CLI tools (and the bower package manager) are built in node, not because you need it to serve your app (for example, the Polymer docs page (www.polymer-project.org) is served using the Google App Engine Python environment, no node involved.

I'm going to try to break down a couple of the other questions in your comment:

1. And why "view1" isn't listed in browser URL bar at the first page load?

   There are two separate properties in my-app: routeData and page. routeData is data bound to the app-route, which is bound to the URL. When you go to /view1, routeData.page is set to view1. When you go to /, routeData.page is undefined.

   When the routeData.page changes, the _routePageChanged observer is invoked. This sets the page property. If the routeData.page is undefined, it sets page to view1, but _it doesn't change the route_. If you click on View One in the UI (or navigate to /view1), you see view1 but you also get view1 in the URL. (If this is confusing, you could change the View One link to point to / so you'd never see view1 in the URL.)

   The view selection logic starts here: https://github.com/PolymerElements/polymer-starter-kit/blob/master/src/my-app.html#L121

2. Why isn't it working with apache?

   This isn't Polymer-specific, it's an issue with any single-page application like Polymer Starter Kit. For a static HTML site, the server responds to each request by returning the matching HTML page.

   For a single-page app, the server needs extra logic to map the user request to the correct file. When the browser requests one of your views (/, /view1, /view2, etc.), the server should return index.html. When the browser requests subresources (like /src/my-view1.html), the server should return that specific file.

   In Apache, this might be as simple as setting FallbackResource: http://httpd.apache.org/docs/trunk/mod/mod_dir.html#fallbackresource

   If you're just deploying the PSK without building, that might look like:

   FallbackResource /index.html

   If you're deploying a bundled or unbundled build, you might need a few more rules.

[Matheus-Ribeiro95]

@arthurevans
Arthur thanks for the answers!
I learned a lot since this questions and i decided to go with NodeJS because of its growing so fast and have a really nice way to do a RESTful API with routers. I think Node is the future to be honest.
I know that "failed to load resources errors" was because of my no existance configuration of proxy in Apache or NGINX (i will use NGINX for production).
Anyway, thanks for the help guys, Polymer is amazing tool to build an web-app, now i just have to learn more about progressive web apps with some tutorials did by Google/Polymer in YouTube and i will rock this out!!
Thanks!!!