In layman's react Native 2: My first Application

Source: Internet
Author: User

This is the second article in the React native tutorial, the first one for the environment configuration.

Once the React native environment is ready, you can start creating our first app.

Open the console, enter

React-native Init Awesomeproject

The purpose of the above command is to create a project template named Awesomeproject under the current folder. Before you run the command, you can use the CD command to the folder where you want to create the react native.

Of course, the pit is that it takes a long time to execute this command, and sometimes there are a variety of errors, such as no permissions. So in our tutorial, just take an initial project to modify the use. The address is as follows:

Github:https://github.com/cellchen/react-native-init

After downloading, find the Tar folder, which is the item we need to use.

The project file looks like this: (this tutorial is primarily iOS development, so ignore Andorid related first, but Android is similar to the iOS directory.) )

You can see that the project consists mainly of Index.ios.js and iOS projects.

Open the console and make sure that the directory that the current console points to is awesomeproject, enter

NPM start

This command is primarily used to start the local server for development use.

When the server starts, you can use Xcode to open the iOS project, compile, run, you can see the most most original project ~ ~

We can try to modify the next Index.ios.js file to see the effect ~

With the file editor (personal or relatively recommended use sublime, good-looking, useful, plug-in more ~) Open index.ios.js, you can see the following code:

Modify the 20th line of code to "This is my first react native application"

Switch back to the iphone simulator, Cmd+r refresh, you can see the title of the simulator changed to our latest modified text ~ (if cmd+r after refreshing to see or the previous text, you can try to stop the server and then reopen ~)

Well, the above is our first react native application, if the code in the project does not understand, it does not matter, the follow-up will slowly explain the ~

In layman's react Native 2: My first Application

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.