{"id":31,"date":"2017-03-02T17:05:22","date_gmt":"2017-03-02T17:05:22","guid":{"rendered":"http:\/\/simplecode.xyz\/?p=31"},"modified":"2022-01-10T14:48:33","modified_gmt":"2022-01-10T14:48:33","slug":"setting-react-native-android-ubuntu-16-04","status":"publish","type":"post","link":"https:\/\/simplecode.com.vn\/?p=31","title":{"rendered":"Setting up React Native Android on Ubuntu 16.04"},"content":{"rendered":"<div>\n<h3><b>Install Nodejs<\/b><\/h3>\n<pre><code>$ sudo apt-get update\r\n$ sudo apt-get install build-essential libssl-dev<\/code><\/pre>\n<p>The version number of <code>nvm<\/code> may be different, but in general, you can download it with <span><code> curl<\/code><\/span>:<\/p>\n<pre><code>$ curl -sL https:\/\/raw.githubusercontent.com\/creationix\/nvm\/v0.31.0\/install.sh -o install_nvm.sh\r\n$ nano install_nvm.sh\r\n$ bash install_nvm.sh\r\n$ source ~\/.profile\r\n$ nvm ls-remote \/\/To find out the versions of Node.js that are available for installation\r\n$ nvm install 6.0.0<\/code><\/pre>\n<p>References: <a href=\"https:\/\/www.digitalocean.com\/community\/tutorials\/how-to-install-node-js-on-ubuntu-16-04\">DigitalOcean<\/a>\n<\/div>\n<div>\n<h3><b>Install Java JDK<\/b><\/h3>\n<pre><code>$ sudo apt-get install default-jdk<\/code><\/pre>\n<p>References: <a href=\"https:\/\/www.digitalocean.com\/community\/tutorials\/how-to-install-java-with-apt-get-on-ubuntu-16-04\">DigitalOcean<\/a>\n<\/div>\n<div>\n<h3><b>Install the React Native command line interface<\/b><\/h3>\n<pre><code>$ npm install -g react-native-cli<\/code><\/pre>\n<\/div>\n<div>\n<h3><b>Install Android Development Environment<\/b><\/h3>\n<p><b>Download and Install Android Studio<\/b><br \/>\nIf you are running a 64-bit version of Ubuntu, you need to install some 32-bit libraries with the following command:<\/p>\n<pre><code>$ sudo apt-get install libc6:i386 libncurses5:i386 libstdc++6:i386 lib32z1 libbz2-1.0:i386<\/code><\/pre>\n<p>To install Android Studio on Linux, proceed as follows:<\/p>\n<ol class=\"inside\">\n<li><span>Unpack the <code> .zip <\/code> file you downloaded to an appropriate location for your applications, such as within <code> \/usr\/local\/ <\/code> for your user profile, or <code> \/opt\/ <\/code> for shared users.<\/span><\/li>\n<li><span>To launch Android Studio, open a <code> terminal <\/code>, navigate to the <code> android-studio\/bin\/ <\/code> directory, and execute <code> studio.sh. <\/code><\/span><\/li>\n<li><span>Select whether you want to import previous Android Studio settings or not, then click <code> OK. <\/code><\/span><\/li>\n<li><span>The Android Studio Setup Wizard guides you though the rest of the setup, which includes downloading <code> Android SDK <\/code> components that are required for development.<\/span><\/li>\n<\/ol>\n<p>References: <a href=\"https:\/\/developer.android.com\/studio\/install.html\">android.com<\/a>\n<\/p>\n<p><b>Install the AVD<\/b><br \/>\nChoose Custom installation when running Android Studio for the first time. Make sure the boxes next to all of the following are checked:<\/p>\n<ul class=\"inside\">\n<li><span><code>Android SDK<\/code><\/span><\/li>\n<li><span><code>Android SDK Platform<\/code><\/span><\/li>\n<li><span><code>Android Virtual Device<\/code><\/span><\/li>\n<\/ul>\n<p>Click &#8220;Next&#8221; to install all of these components, then configure <span><code> VM acceleration <\/code><\/span> on your system.\n<\/p>\n<p><b>Configuring VM acceleration on Linux<\/b><br \/>\nTo check whether you have KVM installed, you can install the <span><code> cpu-checker <\/code><\/span> package containing the <span><code> kvm-ok <\/code><\/span> command. After, you can enter:<\/p>\n<pre><code>$ sudo apt-get install cpu-checker \/\/If you haven't installed it.\r\n$ egrep \u2013c '(vmx|svm)' \/proc\/cpuinfo\r\n12\r\n$ kvm-ok\r\nINFO: \/dev\/kvm exists\r\nKVM acceleration can be used<\/code><\/pre>\n<p>If KVM is missing or to ensure you have the latest KVM installed, enter the following command line to install it: <\/p>\n<pre><code>$ sudo apt-get install qemu-kvm libvirt-bin ubuntu-vm-builder bridge-utils<\/code><\/pre>\n<p>References: <a href=\"https:\/\/developer.android.com\/studio\/run\/emulator-acceleration.html#vm-linux\">android.com<\/a> <a href=\"https:\/\/help.ubuntu.com\/community\/KVM\/Installation\">ubuntu.com<\/a>\n<\/p>\n<p><b>Install the Android 6.0 (Marshmallow) SDK<\/b><br \/>\nAndroid Studio installs the most recent <span><code> Android SDK <\/code><\/span> by default.<br \/>\nReact Native, however, requires the <span><code> Android 6.0 (Marshmallow) <\/code><\/span> SDK. To install it, launch the <span><code> SDK Manager <\/code><\/span>, click on &#8220;Configure&#8221; in the &#8220;Welcome to Android Studio&#8221; screen.<br \/>\nSelect &#8220;SDK Platforms&#8221; from within the SDK Manager, then check the box next to &#8220;Show Package Details&#8221;. Look for and expand the <span><code> Android 6.0 (Marshmallow) <\/code><\/span> entry, then make sure the following items are all checked:<\/p>\n<ul class=\"inside\">\n<li><span><code>Google APIs<\/code><\/span><\/li>\n<li><span><code>Android SDK Platform 23<\/code><\/span><\/li>\n<li><span><code>Intel x86 Atom System Image<\/code><\/span><\/li>\n<li><span><code>Intel x86 Atom_64 System Image<\/code><\/span><\/li>\n<li><span><code>Google APIs Intel x86 Atom_64 System Image<\/code><\/span><\/li>\n<\/ul>\n<p>Next, select &#8220;SDK Tools&#8221; and check the box next to &#8220;Show Package Details&#8221; here as well. Look for and expand the &#8220;Android SDK Build Tools&#8221; entry, then make sure that <span><code> Android SDK Build-Tools 23.0.1 <\/code><\/span> is selected.<br \/>\nFinally, click &#8220;Apply&#8221; to download and install the Android SDK and related build tools.\n<\/p>\n<p><b>Set up the ANDROID_HOME environment variable<\/b><br \/>\nThe React Native command line interface requires the <span><code> ANDROID_HOME <\/code><\/span> environment variable to be set up.<br \/>\nAdd the following lines to your <span><code> ~\/.bashrc <\/code><\/span> (or equivalent) config file:<\/p>\n<pre><code>export ANDROID_HOME=${HOME}\/Android\/Sdk \r\nexport PATH=${PATH}:${ANDROID_HOME}\/tools \r\nexport PATH=${PATH}:${ANDROID_HOME}\/platform-tools<\/code><\/pre>\n<\/p>\n<\/div>\n<div>\n<h3><b>Watchman<\/b><\/h3>\n<p>Watchman is a tool by Facebook for watching changes in the filesystem.<br \/>\n<code># Checkout, compile & install:<\/code><\/p>\n<pre><code>$ git clone https:\/\/github.com\/facebook\/watchman.git\r\n$ cd watchman\/\r\n$ git checkout v4.7.0\r\n$ sudo apt-get install -y autoconf automake build-essential python-dev\r\n$ .\/autogen.sh \r\n$ .\/configure \r\n$ make\r\n$ sudo make install\r\n\r\n$ watchman --version<\/code><\/pre>\n<p><code># Raise inotify limit<\/code><\/p>\n<pre><code>$ echo 999999 | sudo tee -a \/proc\/sys\/fs\/inotify\/max_user_watches && \r\n  echo 999999 | sudo tee -a  \/proc\/sys\/fs\/inotify\/max_queued_events && \r\n  echo 999999 | sudo tee  -a \/proc\/sys\/fs\/inotify\/max_user_instances && \r\n  watchman  shutdown-server<\/code><\/pre>\n<\/div>\n<div>\n<h3><b>Starting the Android Virtual Device<\/b><\/h3>\n<p>You can see the list of available AVDs by opening the &#8220;AVD Manager&#8221; from running the following command in a <span><code> terminal <\/code><\/span>:<\/p>\n<pre><\/code>$ android avd<\/code><\/pre>\n<p>Once in the &#8220;AVD Manager&#8221;, select your AVD and click &#8220;Start&#8230;&#8221;.<\/p>\n<p>Please have a look at <a href=\"https:\/\/developer.android.com\/studio\/run\/managing-avds.html\">Android Studio User Guide<\/a> to create a new AVD if needed.<\/p>\n<\/div>\n<div>\n<h3><b>Testing your React Native Installation<\/b><\/h3>\n<pre><code>$ react-native init AwesomeApp\r\n$ cd AwesomeApp \r\n$ react-native run-android<\/code><\/pre>\n<p>You might see the red screen below because you haven&#8217;t started your app yet.<\/p>\n<p><img loading=\"lazy\" src=\"http:\/\/simplecode.xyz\/wp-content\/uploads\/2017\/03\/Screenshot-from-2017-03-04-16-11-39.png\" alt=\"\" width=\"1366\" height=\"768\" class=\"alignnone size-full wp-image-79\" \/><\/p>\n<p>You just need to start your app.<\/p>\n<pre><code>$ react-native start<\/code><\/pre>\n<p>Press the <span><code>R<\/code><\/span> key twice or select Reload from the Developer Menu (press <span><code>Ctrl + m<\/code><\/span> to show Developer Menu) to see your app running in your Android emulator.<\/p>\n<p><img loading=\"lazy\" src=\"http:\/\/simplecode.xyz\/wp-content\/uploads\/2017\/03\/Screenshot-from-2017-03-04-16-12-02.png\" alt=\"\" width=\"1366\" height=\"768\" class=\"alignnone size-full wp-image-80\" \/>\n<\/div>\n<div>\n<h3><b>Modifying your app<\/b><\/h3>\n<p>Now that you have successfully run the app, let&#8217;s modify it.<\/p>\n<ul class=\"inside\">\n<li><span>Open <code>index.android.js<\/code> in your text editor of choice and edit some lines.<\/span><\/li>\n<li><span>Press the <code>R<\/code> key twice or select Reload from the Developer Menu to see your change!<\/span><\/li>\n<\/ul>\n<\/div>\n<div>\n<h3><b>That&#8217;s it<\/b><\/h3>\n<p>Congratulations! You&#8217;ve successfully run and modified a React Native app.\n<\/p><\/div>\n<p>References: <a href=\"https:\/\/facebook.github.io\/react-native\/docs\/getting-started.html#content\">facebook.github.io<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Install Nodejs $ sudo apt-get update $ sudo apt-get install build-essential libssl-dev The version number of nvm may be different, but in general, you can download it with curl: $ curl -sL https:\/\/raw.githubusercontent.com\/creationix\/nvm\/v0.31.0\/install.sh -o install_nvm.sh $ nano install_nvm.sh $ bash install_nvm.sh $ source ~\/.profile $ nvm ls-remote \/\/To find out [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[6],"tags":[8,5],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v17.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Setting up React Native Android on Ubuntu 16.04 - SimpleCode<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/simplecode.com.vn\/?p=31\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Setting up React Native Android on Ubuntu 16.04 - SimpleCode\" \/>\n<meta property=\"og:description\" content=\"Install Nodejs $ sudo apt-get update $ sudo apt-get install build-essential libssl-dev The version number of nvm may be different, but in general, you can download it with curl: $ curl -sL https:\/\/raw.githubusercontent.com\/creationix\/nvm\/v0.31.0\/install.sh -o install_nvm.sh $ nano install_nvm.sh $ bash install_nvm.sh $ source ~\/.profile $ nvm ls-remote \/\/To find out [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/simplecode.com.vn\/?p=31\" \/>\n<meta property=\"og:site_name\" content=\"SimpleCode\" \/>\n<meta property=\"article:published_time\" content=\"2017-03-02T17:05:22+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-01-10T14:48:33+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/simplecode.xyz\/wp-content\/uploads\/2017\/03\/Screenshot-from-2017-03-04-16-11-39.png\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"simplecode\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/simplecode.com.vn\/#website\",\"url\":\"https:\/\/simplecode.com.vn\/\",\"name\":\"SimpleCode\",\"description\":\"Simple Code\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/simplecode.com.vn\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/simplecode.com.vn\/?p=31#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"http:\/\/simplecode.xyz\/wp-content\/uploads\/2017\/03\/Screenshot-from-2017-03-04-16-11-39.png\",\"contentUrl\":\"http:\/\/simplecode.xyz\/wp-content\/uploads\/2017\/03\/Screenshot-from-2017-03-04-16-11-39.png\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/simplecode.com.vn\/?p=31#webpage\",\"url\":\"https:\/\/simplecode.com.vn\/?p=31\",\"name\":\"Setting up React Native Android on Ubuntu 16.04 - SimpleCode\",\"isPartOf\":{\"@id\":\"https:\/\/simplecode.com.vn\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/simplecode.com.vn\/?p=31#primaryimage\"},\"datePublished\":\"2017-03-02T17:05:22+00:00\",\"dateModified\":\"2022-01-10T14:48:33+00:00\",\"author\":{\"@id\":\"https:\/\/simplecode.com.vn\/#\/schema\/person\/b110785905231d29553717dd14b766dc\"},\"breadcrumb\":{\"@id\":\"https:\/\/simplecode.com.vn\/?p=31#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/simplecode.com.vn\/?p=31\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/simplecode.com.vn\/?p=31#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/simplecode.com.vn\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Setting up React Native Android on Ubuntu 16.04\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/simplecode.com.vn\/#\/schema\/person\/b110785905231d29553717dd14b766dc\",\"name\":\"simplecode\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/simplecode.com.vn\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/22e0b2cc28939e5aecc166195d629442?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/22e0b2cc28939e5aecc166195d629442?s=96&d=mm&r=g\",\"caption\":\"simplecode\"},\"url\":\"https:\/\/simplecode.com.vn\/?author=1\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Setting up React Native Android on Ubuntu 16.04 - SimpleCode","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/simplecode.com.vn\/?p=31","og_locale":"en_US","og_type":"article","og_title":"Setting up React Native Android on Ubuntu 16.04 - SimpleCode","og_description":"Install Nodejs $ sudo apt-get update $ sudo apt-get install build-essential libssl-dev The version number of nvm may be different, but in general, you can download it with curl: $ curl -sL https:\/\/raw.githubusercontent.com\/creationix\/nvm\/v0.31.0\/install.sh -o install_nvm.sh $ nano install_nvm.sh $ bash install_nvm.sh $ source ~\/.profile $ nvm ls-remote \/\/To find out [&hellip;]","og_url":"https:\/\/simplecode.com.vn\/?p=31","og_site_name":"SimpleCode","article_published_time":"2017-03-02T17:05:22+00:00","article_modified_time":"2022-01-10T14:48:33+00:00","og_image":[{"url":"http:\/\/simplecode.xyz\/wp-content\/uploads\/2017\/03\/Screenshot-from-2017-03-04-16-11-39.png"}],"twitter_card":"summary","twitter_misc":{"Written by":"simplecode","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/simplecode.com.vn\/#website","url":"https:\/\/simplecode.com.vn\/","name":"SimpleCode","description":"Simple Code","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/simplecode.com.vn\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/simplecode.com.vn\/?p=31#primaryimage","inLanguage":"en-US","url":"http:\/\/simplecode.xyz\/wp-content\/uploads\/2017\/03\/Screenshot-from-2017-03-04-16-11-39.png","contentUrl":"http:\/\/simplecode.xyz\/wp-content\/uploads\/2017\/03\/Screenshot-from-2017-03-04-16-11-39.png"},{"@type":"WebPage","@id":"https:\/\/simplecode.com.vn\/?p=31#webpage","url":"https:\/\/simplecode.com.vn\/?p=31","name":"Setting up React Native Android on Ubuntu 16.04 - SimpleCode","isPartOf":{"@id":"https:\/\/simplecode.com.vn\/#website"},"primaryImageOfPage":{"@id":"https:\/\/simplecode.com.vn\/?p=31#primaryimage"},"datePublished":"2017-03-02T17:05:22+00:00","dateModified":"2022-01-10T14:48:33+00:00","author":{"@id":"https:\/\/simplecode.com.vn\/#\/schema\/person\/b110785905231d29553717dd14b766dc"},"breadcrumb":{"@id":"https:\/\/simplecode.com.vn\/?p=31#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/simplecode.com.vn\/?p=31"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/simplecode.com.vn\/?p=31#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/simplecode.com.vn\/"},{"@type":"ListItem","position":2,"name":"Setting up React Native Android on Ubuntu 16.04"}]},{"@type":"Person","@id":"https:\/\/simplecode.com.vn\/#\/schema\/person\/b110785905231d29553717dd14b766dc","name":"simplecode","image":{"@type":"ImageObject","@id":"https:\/\/simplecode.com.vn\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/22e0b2cc28939e5aecc166195d629442?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/22e0b2cc28939e5aecc166195d629442?s=96&d=mm&r=g","caption":"simplecode"},"url":"https:\/\/simplecode.com.vn\/?author=1"}]}},"_links":{"self":[{"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=\/wp\/v2\/posts\/31"}],"collection":[{"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=31"}],"version-history":[{"count":53,"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=\/wp\/v2\/posts\/31\/revisions"}],"predecessor-version":[{"id":208,"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=\/wp\/v2\/posts\/31\/revisions\/208"}],"wp:attachment":[{"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=31"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=31"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/simplecode.com.vn\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=31"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}