Giter VIP home page Giter VIP logo

alarm's Introduction

Alarm Clock in React Native

GithubFollow @svbala99GithubFollow @svbala99 GithubFollow @svbala99 GithubFollow @svbala99 GithubFollow @svbala99 GithubFollow @svbala99

A simple app in react native to implement alarm clock that makes use of react native bridge, schedule alarm with Alarm Manager for Android .

Prerequisites:

  • You should have the latest build system for Android, Java, React Native.

Screenshots

View all alarms Create or edit alarm Ring

Features

  • Alarm will go on even if the app is killed; this is the tricky area where you cannot run a task without headless JS when the app is killed - react native apps run on JS thread - single threaded, if that thread is killed, no way to perform any action). Native modules are implemented here, thereby invoking the Native Android Alarm manager to store and retrieve alarm details and fire it approproately with play, pause, update, etc operations.

Technology

  • React Native : For Cross platform mobile app development
  • Node JS: For runtime environment
  • Javascript : For application development
  • VS code : Code editor IDE
  • Linting: eslint

Installation

This App requires Node.js v10+ to run.

Download the repo and install dependencies
git clone [email protected]:svbala99/alarm.git
cd alarm
npm i
Start the development server
npm start
Install the app first time in Android (in Dev mode)
  • Connect any Android device with USB
  • Enable USB debugging in the device
  • Accept to INSTALL the app when prompted during the deployment
  • This command is not needed for subsequent changes made in project
  • Whenever you include any package that impacts Android native, reinstall the app by issuing this command
  • Alternatively the same can be achieved from Android Studio IDE by clicking "Run" button after opening "Android" project in it
  • Supported Machines: Windows / Linux / Mac
npm run android
Install the app first time in iPhones (iOS) - Dev mode
  • Connect any Android device with USB
  • Enable USB debugging in the device
  • Accept to INSTALL the app when prompted during the deployment
  • This command is not needed for subsequent changes made in project
  • Whenever you include any package that impacts Android native, reinstall the app by issuing this command
  • Alternatively the same can be achieved from Xcode IDE by clicking "Build" & "Run" button after opening "iOS" folder in it
  • Supported Machines: Mac only
cd ios && pod install && cd ..
npm run ios

To generate iOS ipa file

  • Set the scheme to "Any iOS Simulator"
  • Xcode -> product -> clean
  • Xcode -> product -> Archive
  • After 15mins, build will be archived, you can export the build now
  • In the archive window opened, choose "development" method of distribution
  • Choose "Automatically manage signing"
  • Select the location you want to export and click OK

To generate Android APK

gradlew assembleRelease (APK file)
gradlew bundleRelease (AAB file)

Output file location

You will find the APK file in:

~PROJECT_LOCATION\android\app\build\outputs\apk\release

Install the released APK

adb install app-release.apk

Packages used

Package Version
React 17
React Native 0.68.2

and basic necessary packages for react navigation stack and uuid.

License

GNU GPL

React Native

alarm's People

Contributors

bala-divum avatar svbala99 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

alarm's Issues

issue while opening Alarm.js screen

Cannot read property getState of null
Cannot read property getAll of null
this error shows when i open Alarm Screen and hence can't add alarm back after coming from edit screen to alarm screen can you help?
(I think it has to do with AlarmService in alarm.js file)

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.