Create, Run And Build A PhoneGap App

Now that you have finished installing PhoneGap, let’s understand the process of creating, running and building an app developed by PhoneGap.

Create an app

Here There are two ways to create an app:

Reading: How to create an app with phonegap

• GUI
• CLI

Create app with GUI:

You need to openthePhoneGap desktop app.

1. Click ‘+’ icon and then select ‘Create new PhoneGap project‘.
2. Fill in the following details from:
   1. Local Path
   2. Name
   3. ID (optional)
3. The app was created ted. You must click the green button to run the app. The server address below indicates that your app is running and that it is the active project among all. Only one project can be active at a time.

Create app with CLI:

Open command prompt if using Windows or the Terminal app if you are using Mac OS X

1. Create a folder named “sample” using the following command current location.

   The project will be created with the default name as Hello World and the default ID as ‘com.phonegap.helloworld’ . . If you want to create a project with custom name and custom ID, type the following command.

2. Make sure that you are getting the following output.
3. Now that your project has been created in the current location, type cd command to go to the project directory.
4. You need to type dir command in Command Prompt (Windows) and ls command in Terminal app (Mac OS X).Command Prompt (Windows)

   Terminal App (Mac OS X)

   You will see the following files and Directories.

5. Since index.html is stored in www, we change our directory from sample to www .

Run an app

See also: How to Make a Vector Image in Photoshop

Again, there are two ways to run your app:

• GUI
• CLI

Run an app with GUI:

1. Run the project by typing on the green button in the desktop app.
2. Take your device, open the PhoneGap mobile app,type type theserver address at the bottom of the desktop app and tap “Connect”
3. You will see a message about the successful connection, followed by the success message
4. When the app connects, it loads and a preview of the app is shown.

Run an app using CLI:

1. Open the command prompt and change it to the directory of the project.
2. Type “$ phonegap serve” in the command prompt or terminal app to run the project. This will return a server address.
3. Now that you have the server address, all you have to do is follow the 2nd, 3rd and 4th step in the “Run your app with GUI” section above is mentioned. strong>’.

Make updates:

1. The preview you saw in the step above was the default Appearance of an app . Now let’s make some changes.
2. Open the file index.html (in the project folder: ~/sample/www/index.html) in any text editor. I will use Sublime Text.
3. I will make the following code changes:
   • Change the title from ‘Hello World‘ to ‘Welcome to FormGet‘
   • Change the logo from ‘PhoneGap’s‘ to ‘FormGet‘ . li>
   • Change the heading from ‘PhoneGap‘ to ‘FormGet‘
   • Change the paragraph text from ‘Device is ready‘ to ‘Welcome to FormGet‘
4. Save the changes and run the app by clicking the green button of the desktop application.
5. Now open the mobile app and see View the changes.
6. You can make further changes to the HTML, CSS and JavaScript code as you like.

Create an app

Create/ Compile An app is an important development phase. Now that we’ve created an app, we need to compile it and generate an executable for different platforms. Below are the ways to build an app.

• Build an app with PhoneGap Build
  • By uploading a ZIP file
  • With GIT
• Build an app with CLI

Build an app Use by PhoneGap Build:

PhoneGap Build is a cloud service used to build apps online. All you have to do is upload the project to PhoneGap Build and it will create an executable with apps for different platforms. It generates:

• APK for Android
• IPA for IOS
• XAP for Windows

You need to follow the following process:

1. Open PhoneGap Build and Login.
2. Log in to the PhoneGap Build Account . li>
3. Now you have 2 ways to upload a project:

• By using GIT

  You can keep your app open source or private. PhoneGap Build has different plans for private apps. You need to upload your project to GitHub and copy and paste the link of this repository here. Now click on ‘Pull from .git repository‘. Your project will be uploaded.

• By uploading a ZIP file

  Click on the Private tab. Click Upload ZIP File to upload the project.

See also: How To Make a Resume in Google Docs

4. After uploading the project (either via .git or .zip file), click Ready to build. You will get the following screen. 5. Now click on ‘PG Build App’.

6. Click the “No key selected drop-down menu “. next to the Android icon and select “Add Key“. (Optional) 7. Finally, you can download the app for the platform you want.

Create an app With CLI:

1. Open the node.js command prompt on Windows or Terminal app on Mac OS X. li>
2. Create a new project with the following command.

   where “sample” is an application name and “com.phonegap.sample” is an application id strong>.

3. Make sure you get the following output.
4. Now that your project has been created in the current location, type cd command to go to the project directory.
5. Now login to the PhoneGap Build using the credentials you received after registration.

   where -u is the username and -p is the password.

6. Make sure you get the following output.
7. Now let’s build your project for Android platform.
8. Make sure you get the following output.
9. Similarly, you can build your project for iOS and Windows platforms using the following commands.IOS platform

   Windows platform

Conclusion:

Now you are ready to build, run and create your own apps. You can do this operation with GUI and CLI as you like. Create more useful apps and enjoy 🙂

You may also like –

See also: Business Directory Website Development: How to Build a Review Website Like Yelp

• Install PhoneGap
• PhoneGap splash screen

.