Code Monkey home page Code Monkey logo

bledrill's Introduction

This is a new React Native project, bootstrapped using @react-native-community/cli.

Getting Started

Note: Make sure you have completed the React Native - Environment Setup instructions till "Creating a new application" step, before proceeding.

Step 1: Start the Metro Server

First, you will need to start Metro, the JavaScript bundler that ships with React Native.

To start Metro, run the following command from the root of your React Native project:

# using npm
npm start

# OR using Yarn
yarn start

Step 2: Start your Application

Let Metro Bundler run in its own terminal. Open a new terminal from the root of your React Native project. Run the following command to start your Android or iOS app:

For Android

# using npm
npm run android

# OR using Yarn
yarn android

For iOS

# using npm
npm run ios

# OR using Yarn
yarn ios

If everything is set up correctly, you should see your new app running in your Android Emulator or iOS Simulator shortly provided you have set up your emulator/simulator correctly.

This is one way to run your app — you can also run it directly from within Android Studio and Xcode respectively.

Step 3: Modifying your App

Now that you have successfully run the app, let's modify it.

  1. Open App.tsx in your text editor of choice and edit some lines.

  2. For Android: Press the R key twice or select "Reload" from the Developer Menu (Ctrl + M (on Window and Linux) or Cmd ⌘ + M (on macOS)) to see your changes!

    For iOS: Hit Cmd ⌘ + R in your iOS Simulator to reload the app and see your changes!

Congratulations! 🎉

You've successfully run and modified your React Native App. 🥳

Now what?

Troubleshooting

If you can't get this to work, see the Troubleshooting page.

Learn More

To learn more about React Native, take a look at the following resources:

bleDrill

bledrill's People

Contributors

mdgarden avatar

Watchers

 avatar

bledrill's Issues

안드로이드 장치가 연결되어있는데도 에뮬레이터로 실행이 됨

되야되는 것

  • npm run android 커맨드 실행 시 USB로 연결된 안드로이드 디바이스에서 RN앱이 실행될 것

해본 것

  • USB 디버깅 권한 승인 취소 및 USB 디버깅 기능 온오프
  • 같은 와이파이인지 확인
  • USB 자체를 뺐다 꼽았다 하기

안되는 것

  • adb 커맨드가 안됨 zsh: command not found: adb
    • 기기가 제대로 연결이 된건지 안된건지 알 수가 없음
  • 에뮬레이터는 켜지는데 까만 화면에서 아무것도 바뀌지 않음

사양서

사양서

스캔 화면(ScanningScreen)

  • 특정 장치와 연결

    • 연결되어야 하는 장치는 고정이므로 장치를 선택할 이유가 없음
    • 같은 장치가 여러개 있을 가능성도 있으나 현 시점에서는 고려하지 않아도 되는 예외상황
  • 재스캔

    • 스캔을 완료하고 장치를 찾지 못한 경우 버튼 활성화
  • 📝Components

    • 스캔중 모달
    • 재스캔 버튼
    • 스캔 버튼
    • 텍스트 : '장치를 발견하지 못했습니다.'
    • 지리정보 획득 동의 모달

연결 후 화면 (BLEScreen)

  • 로그 표시
  • SMS 전송
  • 📝Components
    • 로그 리스트 (텍스트 박스)

현재위치 정보를 SMS로 전송하기

SMS 전송기능

현재 위치 취득하기

  • 권한 얻기 (블루투스 연결 과정에서 해결)
  • 현재 위치 획득
  • 현재 위치를 이름으로 표기

취득한 현재 위치를 SMS로 전송

  • SMS 전송 라이브러리 검토
  • SMS 아무 내용이나 전송되는지 확인
  • 전송시, 획득한 위치를 첨부하여 전송되는지 확인

전송할 때의 위치만 있으면 되므로 위치 상시획득은 없어도 됨

Twilio용 람다 함수 배포

내용

  • 현재 RN에서 SMS를 전송할 수 있는 방법은 Twilio를 통한 API통신 밖에 없음
  • RN상에서 Twilio 클라이언트를 이용할 수 없음
  • Twilio용 람다 함수를 작성하여 배포 (severless.js 이용)

Task

  • 서버레스 프레임워크 셋업
  • twilio 테스트 함수 작성
  • 배포
  • 배포 후 테스트 함수 작동 확인
  • 위치, 날짜 정보를 포함한 템플릿으로 수정 > 앱에서 완성된 메세지로 보내는 것으로 변경

useBle 상황 정리

외않되

  • 검색된 장치 이름이 지정한 이름과 같다면 자동으로 연결하는 것까지 되어야 함.
    • 장치 검색까지는 됨
    • startDeviceScan의 정확한 동작 방식을 모르겠음
      • 장치 리스트 만들 때, 중복 장치면 리스트에 안넣는 로직을 본 것 같은데..
      • 이 함수 자체는 주변 장치를 되는대로 검색하는 것 같은데 그게 신호를 하나하나씩(?) 잡아다들이는건지(???)
  • 장치를 리스트로 표시하지 않고 그냥 바로 연결하려고 했을 때, 장치가 연결 된건지 안된건지 잘 모르겠음
  • 앱을 끄고 다시 켰을 때도 장치가 연결되어있다는 확신이 없음. 만약 장치가 연결되어있지 않다면, 어떻게 연결을 시켜야 하는건지
  • 장치가 연결되었다는걸 훅이든 뭐든간에 그 안에 들어있는 정보가 뭔지 모르겠음
    • 그러니까 '연결되었다'라는 상태인걸 앱에서는 어떻게 알지?
    • 만약에 앱 상에서 연결하지 않고 핸드폰 설정에서 먼저 연결 시켜놓고 앱을 열면 어떻게 되는거지?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.