React :heart: React Native :yellow_heart: Express :green_heart: MySQL

1. Setup MySQL Database

• Activate MySQL server, then create a dojo database with a ninja table:

  $ create database dojo;
  
  $ use dojo;
  
  $ create table ninja(
      no int not null auto_increment,
      nama varchar(30), 
      usia smallint, 
      primary key(no)
      );
  

• Insert some data, as initial data, into ninja table:

  $ insert into ninja values
      (null, 'Andi', 22),
      (null, 'Budi', 23);
  
  $ select * from ninja;
  

• Done! :thumbsup:

2. Setup Node.js Backend Project

• Clone this repo, go to Express_Backend folder then install all dependencies:

  $ git clone https://github.com/LintangWisesa/React_RNative_Express_MySQL.git
  
  $ cd React_RNative_Express_MySQL/Express_Backend
  
  $ npm i
  

• Open app.js & edit these lines to configure your database:

  const db = mysql.createConnection({
      host : 'localhost',
      user : 'your_database_user',
      password : 'your_database_password',
      database : 'your_database_(dojo)'
  });
  

• Save it, then run your backend project. It will run at localhost:3210:

  $ node app
  

• Done! :thumbsup:

3. Setup React Frontend Project

• Go to React_Frontend folder, install all dependencies then run this project:

  $ cd React_RNative_Express_MySQL/React_Frontend
  
  $ npm i
  
  $ npm start
  

• It will run at localhost:3000 & open in browser automatically! Done! :thumbsup:

4. Setup React Native Android Project

• Activate your AVD (Android Virtual Device). In this project, I'm using Genymotion. It's much lighter than Android Studio's AVD.

• Go to RNative_Mobile folder, install all dependencies then run this project:

  $ cd React_RNative_Express_MySQL/RNative_Mobile
  
  $ npm i
  
  $ react-native run-android
  

• Done! :thumbsup:

See also:

• React :heart: React Native :yellow_heart: Express :green_heart: MongoDB
• React :heart: React Native :yellow_heart: Express :green_heart: MySQL
• React :heart: React Native :yellow_heart: Express :green_heart: PostgreSQL

Lintang Wisesa :love_letter: [email protected]

Facebook | Twitter | Google+ | Youtube | :octocat: GitHub | Hackster