This guide will show you how to generate a set of project files for a new Progressive Web App using the Mobify Platform.
Setting up #
Once you’re gotten your Mobify Cloud account, install Mobify’s generator
npm by running
the following command in a terminal window:
npm install -g @mobify/generator
Running the generator #
Once the generator is installed, you can run it with the following command:
If this is your first time working with Mobify, you will be asked for your email address and Mobify API key. (If you are not asked for your API key and email address, that means you’ve already saved your authentication settings and you can skip ahead to the capturing project information section.)
Here’s how get to your email address and API key:
- Login to Mobify Cloud
- Go to the Account Settings page
- Copy the email address as it appears under Update Account Information. Paste this in the terminal when asked by the generator.
- Scroll down to the section called Authorize Your Computer To Push
- If you are an existing user, click the Reset API Key button.
- If you are a new user, click the Generate your API Key button.
- You will be asked to confirm resetting your API key. Click OK.
- Copy the API key and paste this in the terminal when asked by the generator.
Important: the next time you come back to the Account Settings page in Mobify Cloud, the API key will not be displayed in full, so you would have to reset the API key to copy the full text of the API key.
The generator will verify that your credentials are correct and save them in a
new file called
.mobify in your home directory. This will allow you to use the
generator and push bundles to Mobify Cloud.
Capturing project information #
The project generator will ask you some questions about your project. The first
thing you will be asked to enter is your Mobify Project ID found on Mobify
Cloud. If you do not have a project on Mobify Cloud yet, you can just enter
Next, you’ll be asked if you would like to Push to GitHub. This will push
the generated project directly to Mobify’s GitHub. If you choose this option,
you’ll need to contact Mobify support to
give you permission to access the generated GitHub project. This is fine if you
are generating a real project, but if you are just trying out the Mobify
Platform out you should type
n to answer “no” to this question.
The next prompt will ask you to enter the Project URL. This is the URL for
the site that will have the Mobify tag installed on it. If you’re not working on
an official project yet, just enter
The remaining questions asked by the generator are important when generating a project for a customer. If you are unsure of what to enter, please reach out to Mobify for assistance. If you are trying out the Mobify Platform, answer the rest of the answers as best you can or by using made-up data. When the generator is finished, it will return a link to download your project.
Note: If you do not yet have the Mobify Google Analytics ID for your project, use a placeholder such as ‘merlins-analytics’. Do not use a different Google Analytics ID because this will cause analytics to be reported incorrectly.
Finishing up #
Once you’ve downloaded your project, you may wish to put it in a version control system such as Git. Even if you aren’t working on an official project, storing your project in Git and making regular commits makes it easy to revert changes if you break something and can’t figure out how to fix it. If you want to push your project to your company’s GitHub account, you can run the following commands from your project directory in your terminal application:
git remote add origin firstname.lastname@example.org:your-company/your-project-name.git git push -u origin master