재밌는 Coding

1. 시험환경

    · React Native

    · expo cli

    · vsCode

    · Android Studio / AVD(Android Virtual Device)

2. 목적

    · expo cli를 이용하여 프로젝트를 생성하고 실행한다.

    · 핸드폰 단말기에 Expo Go 앱을 설치하여 배포 앱을 확인한다.

3. 적용

    ① [휴대폰] Android 및 iPhone 단말기에 "Expo Go" 앱을 설치한다.

        - 윈도우 개발환경에서는 iPhone 에뮬레티어를 실행할 수 없기 때문에 iPhone 단말기를 준비해야 한다.

    ② 안드로이드 에뮬레이터를 사용하기 위해 Android Studio 및 AVD를 설치한다.

        - 참고 : https://languagestory.tistory.com/174

        - 참고 : https://languagestory.tistory.com/175

    ③ node.js를 설치한다.

        - 참고 : https://languagestory.tistory.com/24

    ④ expo 최신 패키지를 설치한다.

        - npm install expo@latest

    ⑤ expo cli를 이용하여 프로젝트를 생성한다.

        - npx create-expo-app [프로젝트명]

    ⑥ 생성된 프로젝트 폴더로 이동하여 프로젝트를 실행한다.

        - cd [프로젝트명]

        - npx expo start

    ⑦ 안드로이드) AVD 실행 후 ⑥에서 실행한 콘솔은 유지하고 별도의 콘솔에서 아래 명령어를 실행한다.

        - npm run android

    ⑧ 아이폰) ⑥ 실행시 나타나는 QR 코드를 핸드폰 "Expo Go" 앱을 열어서 코드스캔한다.

        - QR 스캔 핸드폰은 개발 PC와 동일 네트워크에 있어야 함에 주의한다.

4. 결과

    · 핸드폰에서 실행된 앱을 확인한다.

1. 시험환경

    ˙ Flutter

    ˙ Android Studio

2. 목적

    ˙ Flutter(플러터) 프로젝트 초기 설정시 Lint 기능을 off 하기 위한 설정을 한다.

    ˙ Flutter Lint란 Dart 코드에서 코딩 스타일 및 잠재적인 오류를 식별하고 경고하는 도구이다.

3. 적용

    ① 프로젝트를 최초 생성한다.

        - 참고 : https://languagestory.tistory.com/298

    ② analysis_options.yaml 파일에서 다음과 같이 설정한다.

4. 결과

    ˙ Lint 기능 off 전/후 비교 결과이다.

1. 시험환경

    ˙ 윈도우

    ˙ Flutter SDK

    ˙ Android Studio

2. 목적

    ˙ 윈도우 운영체제에서 Flutter(플러터) 초기 개발환경을 설정한다.

3. 적용

    ① Flutter(플러터) SDK 다운로드 사이트에 접속한다.

        - URL : https://docs.flutter.dev/get-started/install

    ② 설치할 운영체제 해당하는 SDK를 다운로드 받아서 압축을 해제한다.

        - 여기서는 Windows 운영체제에 설치할 것이다.

    ③ Android Studio를 설치한다.

        - 참고 : https://languagestory.tistory.com/174

    ④ Android Studio Plugin에서 flutter를 검색하여 Flutter Plugin을 설치한다.

    ⑤ SDK Manager → SDK Tools → Android SDK Command-line Tools (latest)를 설치한다.

    ⑥ Android Studio에 "New Flutter Project" 버튼이 생성된 것을 확인할 수 있다.

    ⑦ 윈도우 검색 → 시스템 환경 변수 편집 → 환경변수 Path → ②번 과정에서 수행한 압축해제 bin 폴더를 지정한다.

        - 압축 해제한 Flutter의 bin 디렉토리 : D:\util\flutter_windows_3.16.2-stable\bin

    ⑧ Android Studio를 실행하여 Flutter 신규 프로젝트를 생성한다.

    ⑨ 최초 실행시 ②번 과정에서 수행한 Flutter 압축해제 경로를 Flutter SDK Path로 설정한다.

    ⑩ 프로젝트 설정 정보를 입력하고 "Create" 버튼을 클릭하여 신규 프로젝트를 생성한다.

    ⑪ lib/main.dart 파일에서 프로젝트 개발을 시작한다.

4. 결과

    ˙ 브라우저를 선택하고 프로젝트 Run 버튼을 실행한다.

    ˙ 프로젝트 실행화면을 확인한다.