Create an App Project
Polymer CLI facilitates you to initialize a project folder with one of several application templates. The CLI comes with a basic template, which is the most basic starting point for a Polymer-based application.
App Project Architecture
Polymer app project follows the app shell architecture.
- First: The main entry point of the application which is served from every valid route. This file should be very small, since it will be served from different URLs therefore be cached multiple times. All resource URLs in the entry point need to be absolute, since it may be served from non-top-level URLs.
- Second: The shell or app-shell, which includes the top-level app logic, router, and so on.
- Third: These are the fragments of the app. A fragment can represent the code for a particular view, or other code that can be loaded lazily (for example, parts of the main app not required for first paint, like menus that aren’t displayed until a user interacts with the app). The shell is responsible for dynamically importing the fragments as needed.
The diagram below shows the components of a simple app:
Setup a basic App Project
1. Create a directory for your app project. Let’s name it “my-application”.
2. Navigate to that directory.
3. Initialize your app project.
4. Select application
Here we have selected a polymer 2.0 application.
Enter the name of the application. Defaults to the name of the current directory. Here, we have chosen the name “my-first-application”.
Enter a name for the main element in your project. The main element is the top-most, application-level element of your app. Defaults to the name of the current directory, followed by -app. Here, we have chosen default name.
Enter description for your app.
Now, Polymer CLI will generate files and directories for your app, and will install your project’s dependencies.
App project layout
After the initialization process Polymer CLI generates the following files and directories.
Run your Polymer App
Execute the following command to run your Polymer app.
polymer serve