react-native-circleci-orb - GitLite

KO | EN

gitlite — search

#hacktoberfest #react #ai #typescript #go #machine-learning #docker #nodejs #macos #awesome #cli #kubernetes #vue #open-source

react-native-circleci-orb

(★ 178)

A CircleCI Orb to Simplify Testing your React Native App

파일 탐색기

최종 버전 다운로드 (.zip)

- config.yml
- test-deploy.yml
- - bug_report.md
  - feature_request.md
- example_workflow.png
- - android_build.yml
  - android_emulator_start.yml
  - bundle.yml
  - detox_build.yml
  - detox_test.yml
  - ios_build.yml
  - ios_simulator_start.yml
  - metro_start.yml
  - ndk_update.yml
  - pod_install.yml
  - setup_macos_executor.yml
  - yarn_install.yml
- - android.yml
  - full.yml
  - ios.yml
- - linux_android.yml
  - linux_js.yml
  - macos.yml
- - android_build.yml
  - android_test.yml
  - ios_build.yml
  - ios_build_and_test.yml
- @orb.yml
.gitignore
.releaserc
.yamllint
CHANGELOG.md
LICENSE
package.json
README.md
yarn.lock

# 설치 가이드

1. 코드 내려받기

git clone https://github.com/react-native-community/react-native-circleci-orb

깃허브에서 프로젝트 코드 전체를 내 컴퓨터로 내려받습니다.

cd react-native-circleci-orb

방금 내려받은 프로젝트 폴더 안으로 이동합니다.

2. Node.js

쉬움 추천

사전 준비물

Git GitHub에서 프로젝트 코드를 내려받으려면 필요합니다.
Node.js npm 명령어를 쓰려면 Node.js가 설치되어 있어야 합니다. LTS(장기지원) 버전을 추천합니다.

command: yarn eslint

이 명령어를 터미널에 그대로 입력해 실행하세요.

command: yarn flow

이 명령어를 터미널에 그대로 입력해 실행하세요.

command: yarn jest

이 명령어를 터미널에 그대로 입력해 실행하세요.

✅ 명령어 실행 후 터미널에 나타나는 주소(보통 http://localhost:3000 형태)를 브라우저에서 열어보세요.

이 레포의 README에 적힌 실제 명령어를 그대로 가져왔습니다.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# React Native CircleCI Orb

[![CircleCI Orb][orb-version-badge]][orb-page]

A [CircleCI Orb](https://circleci.com/orbs/) to simplify testing your React Native app.

## Why?
Setting up CircleCI to test your React Native app correctly is hard. You need to consider using the correct machine type, installing the correct dependencies, running the correct commands, and correctly setting up caching to speed up builds. All of this is complicated and involves a lot of trial and error.

With this Orb we provide simple reusable building blocks which you can use to do the right thing easily.

## Overview
First, we recommend reading the [Using Orbs](https://circleci.com/docs/2.0/using-orbs/) guide from the CircleCI documentation to get an overview of how to use Orbs.

This Orb provides three different categories of tools to help you build and test your React Native app on CircleCI:

* **Executors**: Machines which are configured for use with React Native.
* **Commands**: Individual tasks which you can piece together in your own jobs to perform tasks like installing dependencies, building an APK, or running Detox tests.
* **Jobs**: Groups of commands which are typically used together as a stage in a pipeline.

## Setup
Firstly, as this is a 3rd Party Orb, you need to go into your organisations settings, press on "Security", and enable usage of 3rd Party Orbs.

You will also need to ensure that you have a MacOS plan enabled if you want to build and test your iOS app, or if you want to test your Android app. Open Source projects can contact CircleCI to ask them to enable it and private projects need to select a payment plan.

## Documentation
[You can read the full documentation here](https://circleci.com/orbs/registry/orb/react-native-community/react-native).

## Android

Add this task in your <example>/app/build.gradle

```gradle
task downloadDependencies() {
  description 'Download all dependencies to the Gradle cache'
  doLast {
    configurations.findAll().each { config ->
      if (config.name.contains("minReactNative") && config.canBeResolved) {
        print config.name
        print '\n'
        config.files
      }
    }
  }
}
```

## Example

Here is a full example of how the Orb can be used in a CircleCI workflow to build and test a React Native app:

```yaml
# Orb support is from version >= 2.1
version: 2.1

# Make sure you use the latest version of the Orb!
orbs:
  rn: react-native-community/react-native@7.1.0

# Custom jobs which are not part of the Orb
jobs:
  checkout_code:
    executor: rn/linux_js
    steps:
      - checkout
      - persist_to_workspace:
          root: .
          paths: .
  analyse_js:
    executor: rn/linux_js
    steps:
      - attach_workspace:
          at: .
      - rn/yarn_install
      - run:
          name: Run ESLint
          command: yarn eslint
      - run:
          name: Flow
          command: yarn flow
      - run:
          name: Jest
          command: yarn jest

workflows:
  test:
    jobs:
      # Checkout the code and persist to the Workspace
      # Note: This is a job which is defined above and not part of the Orb
      - checkout_code

# Analyze the Javascript using ESLint, Flow, and Jest
      # Note: This is a job which is defined above and not part of the Orb
      - analyse_js:
          requires:
            - checkout_code

# Build the Android app in debug mode
      - rn/android_build:
          name: build_android_debug
          project_path: "android"
          build_type: debug
          requires:
            - analyse_js

# Build and test the Android app in release mode
      # Note: We split these into seperate jobs because we can build the Android app on a Linux machine and preserve the expensive MacOS executor minutes for when it's required
      - rn/android_build:
          name: build_android_release
          project_path: "android"
          build_type: release
          requires:
            - analyse_js
      - rn/android_test:
          detox_configuration: "android.emu.release"
          requires:
            - build_android_release

# Build the iOS app in release mode and do not run tests
      - rn/ios_build:
          name: build_ios_release
          project_path: ios/Example.xcodeproj
          device: "iPhone 11"
          build_configuration: Release
          scheme: Example
          requires:
            - analyse_js

# Build and test the iOS app in release mode
      - rn/ios_build_and_test:
          project_path: "ios/Example.xcodeproj"
          device: "iPhone 11"
          build_configuration: "Release"
          scheme: "Example"
          detox_configuration: "ios.sim.release"
          requires:
            - analyse_js
```

This is what the final workflow will look like:

![Example React Native CircleCI Orb Workflow](https://raw.githubusercontent.com/react-native-community/react-native-circleci-orb/main/.github/example_workflow.png)

## License
The Orb is released under the MIT license. For more information see [`LICENSE`](https://github.com/react-native-community/react-native-circleci-orb/blob/main/LICENSE).

[orb-version-badge]:https://badges.circleci.com/orbs/react-native-community/react-native.svg
[orb-page]:https://circleci.com/orbs/registry/orb/react-native-community/react-native