Tutorial 02-Environment Building, HelloWorld and real-machine debugging, hbuilder02-

Tutorial 02-Environment Building, HelloWorld and real-machine debugging, hbuilder02-

Preface to Environment Construction

Using HBuilder for development is actually the simplest environment to build, or even no environment to build,

It is quite painful to think about android development. It is difficult to download all kinds of sdks.

HBuilder is used for development. Only the Basic java environment is required, and Other android and ios environments are not required.

HBuilder can do this because:

1. Placing the package on the cloud saves the trouble of packaging the local environment,

2. directly set debugging to true, saving the trouble of debugging various simulators.

Java environment

You only need the most basic java environment, that is, you can run java and javac in cmd,

For specific tutorials, refer to Baidu, which will provide detailed tutorials, or find a java developer to build them.

Download and install HBuilder

Please download HBuilder: http://www.dcloud.io /,

After the download is complete, ask the zip package to decompress it to the custom directory (windows ),

And send the shortcut of hbuilder.exe in the directory to the desktop.

Double-click the shortcut,

You need to register HBuilder for the first time. Please register HBuilder in a few minutes,

After logging on, you can see the main interface of HBuilder:

Developers who have used eclipse or myeclipse should be familiar with this interface,

Right, HBuilder is a secondary development ide Based on eclipse,

Therefore, most eclipse operations and shortcut keys can be directly moved for use.

HelloWorld Introduction

A little introduction to what HBuilder can do:

1. frontend Development

Various shortcut keys and prompts. The best thing is that there are prompts for compatibility with all html, css, and js browsers.

2. web Development

Born from eclipse, java web development is not a problem.

3. app development

This is a major event, editing, online packaging, and real-machine debugging.

Create a project

Click Create mobile app on the main interface, or right-click the Project Manager interface to create a mobile app, or press ctrl + n, a to create a mobile app,

You will see the following interface:

1. Enter the application name

Similar to the project name in eclipse

2. Select a location

3. Select a template

Empty Template

Mui project to automatically introduce mui-Related Files

Hello h5 + project, same as the nativejs sample app provided on the official website

Hello mui, which is the same as the mui example provided on the official website.

4. Click Finish

Select the hello mui template. You can also select the hello h5 + template. In the future, most of the mui project templates will be developed.

File structure

After the creation is complete, the following directory structure will appear in the left-side project manager:

I am familiar with front-end development, right?

The main note is manifest. json,

Many app-related configurations: app icons, startup pages, and permissions are configured here.

End

It's that simple. You have finished a HelloWorld, and the rest is the result.

Real machine debugging connection mobile phone

Connect your phone with a data cable instead of a power cord,

Ios needs to download a debugging plug-in, which can be directly debugged by android,

No additional environment is required, whether it is ios or android,

When you select a project or open files in any project,

Choose "run"> "run"> "run on a real machine"> "run on xx device,

Or press ctrl + r to run directly,

After modifying the file, you can press ctrl + r to restart the app.

Connection Failed

When you encounter a connection failure,

Android only needs to install a mobile assistant. The mobile assistant can be connected successfully,

Refer to ios instructions.

Run

Ctrl + r

Then enjoy the first app you made with HBuilder.

More Tutorials:

HBuilder development App Tutorial: http://uikoo9.com/book/detail/3

More Study Notes: http://uikoo9.com/book

Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.