[RA] React Native - 로그인예제 2 (+이슈리스트)

❗ 4년전 코드 -> 실행불가. 이슈리스트 참고용 ❗

React Native + node.js + Mysql 로그인 예제 실행과정과 진행현황 등을 기록한 글입니다.
Reference github

MySQL 환경 구축

create database dojo;

use dojo;

create table ninja(
    no int not null auto_increment,
    nama varchar(30), 
    usia smallint, 
    primary key(no)
    );
    
insert into ninja values
    (null, 'Andi', 22),
    (null, 'Budi', 23);

select * from ninja;

Node.js 백엔드 서버 실행

git clone https://github.com/LintangWisesa/React_RNative_Express_MySQL.git

cd React_RNative_Express_MySQL/Express_Backend

npm i

그 후 app.js의 아래부분을 자신의 환경에 맞게 수정해준다.

const db = mysql.createConnection({
    host : 'localhost',
    user : 'your_database_user', //유저 네임
    password : 'your_database_password', //비밀번호
    database : 'your_database_(dojo)' //위에서 만든 데이터베이스 이름
});

app.js를 저장해준 뒤 cmd창에서 아래 명령어를 입력해 Node.js서버를 실행시켜 준다.
node app

리액트 프론트 실행

cd React_RNative_Express_MySQL/React_Frontend

npm i

npm start

그러면 자동으로 localhost:3000 브라우저가 열릴것이다.

리액트 네이티브 실행

cd React_RNative_Express_MySQL/RNative_Mobile

npm i

react-native run-android

이슈리스트

❗ node app 실행 시 Client does not support authentication protocol requested by server; consider upgrading MySQL client

MySQL에서 아래 코드를 실행
ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY '사용할패스워드'

❗ react-native run-android 실행 시 Could not determine java version from '16.0.2'.

React_RNative_Express_MySQL\RNative_Mobile\android\gradle\wrapper 경로에 들어가서 gradle-wrapper.properties에 들어간뒤 맨 마지막줄을 아래처럼 수정한다
distributionUrl=https\://services.gradle.org/distributions/gradle-7.1.1-all.zip

❗ react-native run-android 실행 시 SDK location not found. Define location with sdk.dir in the local.properties file or with an ANDROID_HOME environment variable.

React_RNative_Express_MySQL\RNative_Mobile\android 경로에서 local.properties 파일을 생성한다. 그 후 아래 코드를 입력 후 저장해준다.

sdk.dir=C\:\\Users\\User_Name\\AppData\\Local\\Android\\sdk //User_Name에는 자신의 이름을 넣음

❗ react-native run-android 실행 시 Failed to notify project evaluation listener. > javax/xml/bind/annotation/XmlSchema

React_RNative_Express_MySQL\RNative_Mobile\android 경로에서 build.gradle 파일을 아래와 같이 수정한다.

//classpath부분
classpath 'com.android.tools.build:gradle:4.2.0'

❗ react-native run-android 실행 시 This project uses AndroidX dependencies, but the 'android.useAndroidX' property is not enabled.

React_RNative_Express_MySQL\RNative_Mobile\android 경로에서 gradle.properties 파일에 아래 두줄을 추가한다.

android.useAndroidX=true
android.enableJetifier=true

❗ react-native run-android 실행 시 Execution failed for task ':app:processDebugMainManifest'. > Manifest merger failed with multiple errors, see logs

cmd 로그를 잘 찾아보면 아래와 같이 suggestion이 쓰여있다.

나는 android/app에 있는 build.gradle파일에서 아래부분을 수정해주었다.

defaultConfig {
        applicationId "com.rnative_mobile"
        minSdkVersion 21 //21로 수정
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
        ndk {
            abiFilters "armeabi-v7a", "x86"
        }
    }

❗ react-native run-android 실행 시 A failure occurred while executing com.android.build.gradle.internal.res.LinkApplicationAndroidResourcesTask$TaskAction


Reference
https://stackoverflow.com/questions/50093144/mysql-8-0-client-does-not-support-authentication-protocol-requested-by-server
https://b.jy.is/could-not-determine-java-version-from/
https://stackoverflow.com/questions/27620262/sdk-location-not-found-define-location-with-sdk-dir-in-the-local-properties-fil
https://gozz123.tistory.com/9
https://thisisspear.tistory.com/47
https://stackoverflow.com/questions/51503218/how-to-specify-the-minsdkversion-in-react-native-project

좋은 웹페이지 즐겨찾기