Menu Sheet Overlay
Search Sheet

      Quick Start

      This guide will show you how to install and configure all of the software you’ll need to start building a Accelerated Mobile Pages (AMP) with the Mobify Platform.

      Required software #

      If you haven’t already, you’ll need to install the following software:

      Windows users: Always use the Git BASH terminal application that is installed with Git for Windows to run the terminal commands in our documentation.

      Recommended software #

      We strongly recommend that you also install the following software. Even if you prefer using other development tools, having these ones available will help Mobify support you.

      Project files #

      Every project using Mobify’s Accelerated Mobile Pages technology begins with a set of project files, including:

      • The Accelerated Mobile Pages Software Development Kit (SDK)
        • Includes 25+ user interface components optimized for mobile users, and many more components are in development.
        • Installed as an npm dependency so you can upgrade your SDK version without regenerating your project
      • A fully functional AMP Service for ecommerce based on a fictional store called Merlin’s Potions
      • Open-source libraries
      • A development server for previewing your work locally
      • Scripts for automating common tasks, such as generating boilerplate code for pages and components

      Previewing your new project #

      Now that you’ve generated your project files, the next step is to start the development web server so that you can preview the changes to your project as you work.

      cd your-project-slug
      cd web
      npm install
      cd ../amp
      npm install
      npm start

      The AMP server listening on port 3000, so you open your browser and type http://localhost:3000 in the URL. We recommend using Google Chrome because of its accurate emulation of mobile devices and its strong debugging tools. With the generated project, you can preview the Merlin’s Potions product page and product list page so you will need to change the URL to http://localhost:3000/eye-of-newt.html for product page and http://localhost:3000/potions.html for product list page.

      Terminal Preview AMP

      Open the Chrome Developer Tools and choose a mobile device to emulate.

      Emulating A Mobile Device

      Troubleshooting #

      If you encounter errors in your terminal while starting your development server: #

      1. Run node -v from your terminal
      2. Check that the version is v8.x If you have a different version of Node installed:


      Was this page helpful?