Polymer Cli Vs PWA starter Kit - polymer

What is the difference between Polymer Cli and PWA starter Kit? I am eager to build PWA with web components using Polymer but I am confused about these two.

PWA Starter Kit is a set of sample apps based on lit-element, the latest Web Components library made by the Polymer team. You could use one of the sample apps in the PWA starter kit as a template for your own app, and/or to look at the code and become familiar with lit-element.
Polymer CLI is a set of command line tools for working with the stuff made by the Polymer team. You would use Polymer CLI commands like polymer serve to run your PWA starter kit app in a local development server, or polymer build to package it for deployment to a web server.

Pwa starter Kit project is no longer maintained
source: https://github.com/Polymer/pwa-starter-kit/issues/373
use open-wc instead

Related

How to use self-built Electron binaries with electron-builder

I've built my own Electron binaries. I've put those binaries into ./node_modules/electron/dist. Everything works fine when running the app with npm start from the development environment, but when packaging the app with electron-builder, Electron lacks that functionality that I added. It looks like electron-builder does not take whats in node_modules/electron when packaging an app.
Can somebody tell how I can use own Electron binaries with electron-builder?
It can be achieved by using the electronDist property in the electron-builder's build section of package.json.

What is the best time or phase of the project to do gulp integration?

I have a frontend project using polymer and so would like to know whether I should do gulp integration before developing several components or after?

How to use Polymer JS without polymer-cli?

Polymer working well with polymer-cli but is any way to run polymer application without polymer-cli and how we integrate it with struts, grails frameworks?

How do I build a Polymer 2.x project with Polymer CLI?

Can anyone point me to a tutorial that uses Polymer 2 and polymer-build from Polymer CLI? When I use any example in the polymer-starter-kit and use polymer serve, it works fine; but when I use polymer build and serve the bundled or unbundled directory, I get 404 errors. I have even updated to the newest alpha version of polymer-cli.
Also, using https://github.com/tony19/generator-polymer-init-2-x-app generators have the same problem.
I also spent quit a bit of time to figure this one out. Please use the polymer-cli#next instead of polymer-cli
Plain polymer-cli doesn't seem to have the latest build and optimizations to support Polymer 2.0#Preview related functionality.
You can install polymer-cli#next. In Ubuntu, you can simply use npm install -g polymer-cli#next
Then on, the bundled and unbundled versions of the application generated through polymer build would just works fine.
Edit:
You can find my sample Polymer2.0#Preview version of the code at https://github.com/phani1kumar/phani1kumar.github.io branch is "devmaster".
the sw-precache-config.js is initial render-blocking. This will load all the resources that the main page needs to make the app available for offline use. src/lazy-resources.html loads resources for the next routes.
You would need to get a proper configuration based on your layout and main page in the following 3 files:
sw-precache-config.js, polymer.json, src/lazy-resources.html. This is a practice followed in the shop app from Polymer team, you may opt to a different mechanism for lazy loading. The bottom-line for lazy loading is to load the resources after Polymer.RenderStatus.afterNextRender.
You may also find the following article interesting: https://medium.com/#marcushellberg/how-i-sped-up-the-initial-render-of-my-polymer-app-by-86-eeff648a3dc0#.pi2iucwzi
I noticed a bug in the generator in that the starter-kit subgenerator was missing a dependency on webcomponentsjs, which would cause an error with polymer-build. And as you discovered, polymer.json was also missing dependencies for the polyfill support of webcomponentsjs, which caused 404s on polyfilled browsers (such as Linux Chrome). That's all fixed now in v0.0.6.
You'll also need a version of polymer-build that does not try to uglify the JavaScript, which would fail due to its inability to recognize ES6. The new-build-flags branch of the polymer-cli repo replaces uglify with babili for ES6 minification (added in PR#525). You could check out that branch and build it yourself, or you could install it from here:
npm i -g tony19-contrib/polymer-cli#dist-new-build-flags
For convenience, this branch is added as a devDependency when generating the 2.0 starter kit with generator-polymer-init-2-x-app.
To build and serve a Polymer 2.0 Starter Kit project:
Generate a 2.0 Starter Kit (using generator-polymer-init-2-x-app, v0.0.6 or newer) by selecting 2-x-app - starter application template:
$ polymer init
? Which starter template would you like to use?
...
2-x-app - (2.0 preview) blank application template
2-x-app - (2.0 preview) blank element template
❯ 2-x-app - (2.0 preview) starter application template
After the project generator finishes, build the project with yarn build:
$ yarn build
info: Deleting build/ directory...
info: Generating build/ directory...
info: Build complete!
Note that the output is only build/, and no longer build/bundled/ and build/unbundled/.
Serve up the contents of the build directory, and automatically open a browser to it:
$ polymer serve build -o
You could also serve it with a different tool to verify that the build output would work outside of the context of any Polymer tools. Start a Python server in build/, and manually open a browser to it:
$ cd build
$ python -m SimpleHTTPServer

Setting up phonegap development environment

I am working on the windows-8 PC. And i have some HTML app gui which i want to convert to android mobile app.
I am new to phonegap.
How to setup the development environment for phonegap?
1> Following tool android developers app tells to use phonegap cli to create new project :--
http://phonegap.com/blog/2014/04/23/phonegap-developer-app/
This video uses Android sdk to create new project :--
http://www.youtube.com/watch?v=MF6dzbTDwdY
Which is the best methord to start working with phonegap ?
Do we need android SDK if we work with phonegap cli ?
2> This link tells to use commandline or IDE methord to create phonegap projects :--
https://github.com/phonegap/phonegap/wiki
3> What exactly is the relation between android SDK & phonegap cli .. ?
i would recommend you to use Cordova. Why? Yes, there is no realy reason why to do this, It's rather a question of what you like to work with.
I'm using Cordova. Maybe you read the Getting started guide and then the following documentation.
After you installed all, you can open up the CMD and create a new cordova project. If you want to know, how to do this, go on with the posted link above. A little bit under the setup instructions you can find a Guide which explains you, how to setup a new project and so on.
If you work with Cordova, you need Eclipse and i would recommend you to install Genymotion for having more options of deploying an app to a device.
Later on, if you would like to convert an Application to another platform you can use the Phonegap Build from Adobe. But normaly you can use your code like you wrote it for android 1:1 for iOS. Maybe there are some tiny differences, but they would'nt be fixed by the phonegap build i think. So... i would say there is no way to say "You should work with Phonegap" or "You should work with Cordova" it's your choice.
If you want to build app for android locally you'll need android SDK. This is because phonegap/cordova uses the android SDK to wrap the app.
Basically phonegap/cordova uses the SDK to compile the project for android platform and to build the APK file which can be installed in devices. You can interpret as Phonegap/cordova cli is an interface between android technology and cross platform technology. Similarly iOS will need some native technology to work with phonegap. Thiese SDK helps to build and package the app for their own platform which you've written in HTML/CSS/Javascript.