Come creare un'app sanitaria di consulenza video in React Native utilizzando Twilio!

Pubblicato: 2022-04-20

Dall'introduzione delle app mHealth, le organizzazioni sanitarie hanno assistito a un cambiamento epocale nel modo in cui i pazienti si relazionano con i medici. Ora i pazienti hanno un maggiore controllo sulle loro decisioni mediche e il sistema generale è diventato più incentrato sul paziente. A causa di ciò, sul mercato è emersa una varietà di app mHealth e un'app sanitaria di consulenza video è una di queste innovazioni. Questa app consente a pazienti e medici di comunicare istantaneamente in caso di emergenza o quando non è possibile visitare l'ospedale. I medici possono inviare ePrescription online e fornire assistenza medica. Quindi, avere un'app di consulenza medica online con una struttura di videochiamata può sempre essere una decisione redditizia per qualsiasi ente medico o anche per un singolo professionista.

Quindi, l'argomento di oggi riguarda la creazione di un'app sanitaria per la consulenza video. Prenderemo in considerazione il framework React Native per questo scopo poiché i servizi di sviluppo React Native sono una scelta perfetta per lo sviluppo di app multipiattaforma di tipo nativo. Inoltre, parleremo di Twilio come piattaforma di comunicazione cloud ampiamente utilizzata nelle app di videochiamata. Iniziamo con cos'è Twilio e poi il processo per creare l'app.

Cos'è Twilio?

Twilio è un servizio basato su cloud americano o una piattaforma di comunicazioni cloud come servizio (CPaaS). Agisce come un potente strumento di comunicazione e colma il divario tra vari dispositivi mobili, altri sistemi, servizi, ecc. e telefonia. Nello sviluppo di React Native, le API offerte da Twilio consentono agli sviluppatori di implementare diversi servizi di comunicazione come effettuare e ricevere telefonate audio/video, inviare e ricevere messaggi di testo, ecc. Questi servizi includono anche bot AI, e-mail, ecc. In questo processo, oltre alle chiamate audio/video, è possibile lavorare anche su altre funzionalità come il recupero dell'account, la verifica del telefono, le chiamate in-app o le chat in-app, ecc.

Per integrare Twilio nell'app, gli sviluppatori React Native avranno bisogno delle conoscenze esistenti su Cocoapods, React Native Navigation, React, ecc. Twilio

Ecco alcuni dei principali vantaggi dell'utilizzo di Twilio

  • Twilio è abbastanza facile da imparare e quindi ci sono una miriade di sviluppatori disponibili.
  • Segue un metodo di comunicazione standard: HTTP.
  • Anche il passaggio da una tecnologia all'altra è molto più semplice.
  • Grazie a Platforms as a Service (PaaS), i costi di capitale sono leggermente inferiori. Anche i costi di implementazione sono inferiori e aumentano gradualmente man mano che l'azienda cresce.

Passaggi chiave per la creazione di un'app React Native Healthcare con consultazione video utilizzando Twilio WebRTC

Durante l'utilizzo di Twilio WebRTC per l'app di videochiamata sanitaria, una società di sviluppo di app React Native dovrebbe seguire la procedura passo passo come indicato di seguito. Questa procedura è divisa in due parti principali in cui la prima parte riguarda la generazione di un token utilizzando Twilio e la seconda parte parla dell'installazione delle dipendenze utilizzando uno starter kit React Native. Inoltre, per ora prenderemo in considerazione un'app React Native per Android. Quindi iniziamo con la prima parte.

Parte 1: Generazione di token con Twilio

Twilio fornisce sia SDK IOS/Android che JavaScript. Ma per React Native, Twilio non fornisce alcun supporto diretto. Quindi, gli sviluppatori React Native possono utilizzare l'SDK JavaScript per alcuni servizi, ma questo non è possibile per altri servizi, perché in larga misura dipende dalle API del browser. C'è un'altra alternativa e sarebbe il porting dell'SDK Android/IOS nativo su React Native. Quindi qui abbiamo usato questa combinazione: Twilio Video (WebRTC) per React Native.

Innanzitutto, crea un account su https://www.twilio.com/. Iscriviti per una prova e verifica le tue credenziali come numero di telefono, e-mail, ecc. Ora verrai indirizzato alla Dashboard.

Avrai bisogno di un SID ACCOUNT insieme a una chiave API e una chiave segreta per generare un token. Per generare una chiave API, vai alle chiavi API attraverso le impostazioni. La creazione della chiave API qui fornirà sia la chiave segreta che la chiave API. È ora possibile generare un token utilizzando npm install che utilizza il pacchetto npm. I token possono anche essere generati in più lingue. Il valore di identità deve essere modificato per ogni token poiché lo stesso token non può essere utilizzato in luoghi diversi.

C'è un altro modo per creare un token utilizzando gli strumenti Twilio. Fare clic su Strumenti Twilio e scrivere un'identità e il nome di una stanza. Questo genererà il token di accesso. Salva in modo sicuro queste chiavi per la parte successiva.

La parte Twilio dell'app sanitaria di videoconsulenza termina qui. Ora iniziamo con la parte di sviluppo di React Native.

Parte 2: Installazione delle dipendenze utilizzando uno Starter Kit React Native

Qui utilizzeremo lo starter kit React Native che può essere copiato dal collegamento GitHub — https://github.com/flatlogic/react-native-starter. È necessario eseguire il comando "npm install https://github.com/blackuy/react-native-twilio-video-webrtc –save" nella directory del progetto del terminale e quindi scrivere il codice richiesto nel file App.js.

Assicurati che tutte le dipendenze richieste siano installate mediante l'esecuzione del comando "npm install" nella directory del progetto. Inoltre, è necessario effettuare alcune configurazioni per l'utilizzo di Twilio e utilizzare anche l'audio, la fotocamera, ecc.

Per creare la cartella vai alla cartella Android, dovresti aggiungere le seguenti righe di codice nel file settings.gradle-

includi ':react-native-twilio-video-webrtc'

progetto (':react-native-twilio-video-webrtc').projectDir = nuovo file (rootProject.projectDir, '../node_modules/react-native-twilio-video-webrtc/android')

Ora vai su Android> app> file build.gradle e cerca le dipendenze. Successivamente, aggiungi il codice sotto indicato nel blocco.

compile project (':react-native-twilio-video-webrtc')

Inoltre, aggiungi il codice indicato di seguito in Android > app > SRC > main > JAVA > com > reactnativestarter > MainApplication.java

import com.twiliorn.library.TwilioPackage;

Dopodiché, sostituisci il metodo getPackages() con il codice richiesto.

Ora per richiedere i permessi all'utente è indispensabile modificare AndroidManifest.xml aggiungendo il codice richiesto in questo file. Assicurati inoltre che nel tuo account Twilio sia abilitata la creazione della stanza lato client.

Esecuzione dell'applicazione

Infine, quando tutti i passaggi sono stati implementati e il codice è stato eseguito, esegui la tua app sanitaria React Native eseguendo il comando "react-native run-android" dalla finestra del terminale.

Verdetto finale

Qui abbiamo sviluppato una semplice app React Native per dimostrare la capacità di videochiamata di Twilio. Ma dobbiamo solo ricordare che alcune cose come le connessioni degli utenti, la generazione di token di accesso degli utenti, la creazione di stanze, ecc. devono essere gestite molto diligentemente sul back-end.

Vorresti sviluppare un'app sanitaria per la consulenza video con l'implementazione di Twilio in React Native come descritto sopra? Ci auguriamo che i suddetti passaggi possano essere utili agli sviluppatori di React Native. Per qualsiasi assistenza tecnica nella creazione di un'app sanitaria personalizzata per la consulenza video medico su richiesta, contatta Biz4Solutions, una società di sviluppo di app sanitarie altamente competente con oltre 11 anni di esperienza in questo dominio.