{"id":15371198,"url":"https://github.com/mraible/mobile-jhipster","last_synced_at":"2025-04-15T14:04:06.608Z","repository":{"id":46154796,"uuid":"198309736","full_name":"mraible/mobile-jhipster","owner":"mraible","description":"Mobile Development with Ionic, React Native, and JHipster","archived":false,"fork":false,"pushed_at":"2021-11-10T18:21:04.000Z","size":22901,"stargazers_count":16,"open_issues_count":4,"forks_count":5,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-15T14:02:53.654Z","etag":null,"topics":["ionic","ionic-framework","jhipster","mobile","mobile-development","oauth2","oidc","react","react-native","reactjs","spring-boot"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mraible.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-07-22T22:17:53.000Z","updated_at":"2024-11-15T04:25:24.000Z","dependencies_parsed_at":"2022-09-24T16:00:39.250Z","dependency_job_id":null,"html_url":"https://github.com/mraible/mobile-jhipster","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mraible%2Fmobile-jhipster","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mraible%2Fmobile-jhipster/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mraible%2Fmobile-jhipster/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mraible%2Fmobile-jhipster/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mraible","download_url":"https://codeload.github.com/mraible/mobile-jhipster/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249085440,"owners_count":21210267,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ionic","ionic-framework","jhipster","mobile","mobile-development","oauth2","oidc","react","react-native","reactjs","spring-boot"],"created_at":"2024-10-01T13:45:50.378Z","updated_at":"2025-04-15T14:04:06.590Z","avatar_url":"https://github.com/mraible.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Mobile Development with Ionic, React Native, and JHipster\n\nThis set of apps was developed using [this demo script](demo.adoc). You can follow the steps to create your own versions, or just run the applications here.\n\nSee [Mobile Development with Ionic, React Native, and JHipster](https://developer.okta.com/blog/2020/04/27/mobile-development-ionic-react-native-jhipster) to see a video of these apps being created in 2020.\n\n**Prerequisites:** [Java 11+](http://adoptopenjdk.com) and [Node.js](https://nodejs.org). \n\n* [Getting Started](#getting-started)\n* [Links](#links)\n* [Help](#help)\n* [License](#license)\n\n## Getting Started\n\nClone this application to your local hard drive using Git.\n\n```\ngit clone https://github.com/mraible/mobile-jhipster.git\n```\n\nTo run the JHipster app, start Keycloak, then use Gradle to start it.\n\n```\ncd mobile-jhipster/backend\ndocker-compose -f src/main/docker/keycloak.yml up -d\n./mvnw\n```\n\n### React Native\n\nTo run the React Native app, install its dependencies:\n\n```\ncd react-native\nnpm i\nnpm start\n```\n\nTo run on emulators, you'll need an [Expo](https://expo.io/) account. Then, add `https://auth.expo.io/@\u003cyour-username\u003e/Flickr2` as a Login redirect URI in Keycloak.\n\nTo run on Android, you'll need to run some commands so your device (or emulator) can communicate with your API and Keycloak.\n\n```shell\nadb reverse tcp:8080 tcp:8080\nadb reverse tcp:9080 tcp:9080\n```\n\n### Ionic\n\nTo run the Ionic app, install its dependencies:\n\n```\ncd ionic\nnpm i\n```\n\nYou can run it as a web app using `ionic serve`. \n\n#### Run on iOS\n\nTo run on iOS:\n\n```\nionic build\nionic capacitor add ios\n```\n\nAdd your custom scheme to `ios/App/App/Info.plist`:\n\n```xml\n\u003ckey\u003eCFBundleURLTypes\u003c/key\u003e\n\u003carray\u003e\n  \u003cdict\u003e\n    \u003ckey\u003eCFBundleURLName\u003c/key\u003e\n    \u003cstring\u003ecom.getcapacitor.capacitor\u003c/string\u003e\n    \u003ckey\u003eCFBundleURLSchemes\u003c/key\u003e\n    \u003carray\u003e\n      \u003cstring\u003ecapacitor\u003c/string\u003e\n      \u003cstring\u003edev.localhost.ionic\u003c/string\u003e\n    \u003c/array\u003e\n  \u003c/dict\u003e\n\u003c/array\u003e\n```\n\nRun your app in iOS Simulator:\n\n```shell\nnpx cap run ios\n```\n\n#### Run on Android\n\nTo run your Ionic app on Android, run the following commands:\n\n```shell\nionic build\nionic capacitor add android\n```\n\nChange the custom scheme in `android/app/src/main/res/values/strings.xml` to use `dev.localhost.ionic`:\n\n```xml\n\u003cstring name=\"custom_url_scheme\"\u003edev.localhost.ionic\u003c/string\u003e\n```\n\nThe [SafariViewController Cordova Plugin](https://github.com/EddyVerbruggen/cordova-plugin-safariviewcontroller) is installed as part of this project. Capacitor uses AndroidX dependencies, but the SafariViewController plugin uses an older non-AndroidX dependency. Use [jetifier](https://developer.android.com/studio/command-line/jetifier) to [patch usages of old support libraries](https://capacitorjs.com/docs/android/troubleshooting#error-package-android-support-does-not-exist) with the following commands:\n\n```\nnpm install jetifier\nnpx jetify\nnpx cap sync android\n```   \n\nThen, run your app in an Android emulator.\n\n```\nnpx cap run android\n```\n\nYou'll need to run a couple commands to allow the emulator to communicate with your API and Keycloak.\n\n```\nadb reverse tcp:8080 tcp:8080\nadb reverse tcp:9080 tcp:9080\n```\n\nIf you see `java.io.IOException: Cleartext HTTP traffic to localhost not permitted` in your Android Studio console, enable clear text traffic in `android/app/src/main/AndroidManifest.xml`:\n\n```xml\n\u003capplication\n    ...\n    android:usesCleartextTraffic=\"true\"\u003e\n```\n\nSee [this Stack Overflow Q\u0026A](https://stackoverflow.com/questions/45940861/android-8-cleartext-http-traffic-not-permitted) for more information.\n\nIf that doesn't work, just use Okta (and its HTTPS-by-default feature 😉).\n\n### Use Okta for Identity\n\nInstall the [Okta CLI](https://cli.okta.com) and run the following commands:\n\n```shell\ncd backend\nokta apps register jhipster\n# source .okta.env \u0026\u0026 ./mvnw to start\n\ncd ../react-native\nokta apps create\n```\n\nSelect **Native**, then use the following for Redirect URIs:\n\n```\nhttp://localhost:19006/,https://auth.expo.io/@\u003cyour-username\u003e/Flickr2\n```\n\nCopy the client ID to `react-native/app/config/app-config.js`.\n\nCreate another **Native** app for Ionic with the following redirect URIs:\n\n* login: `http://localhost:8100/callback,dev.localhost.ionic:/callback`\n* logout: `http://localhost:8100/logout,dev.localhost.ionic:/logout`\n\nUpdate `ionic/src/app/auth/auth-config.service.ts` to use the generated client ID.\n\nRestart your mobile apps and sign in with Okta!\n\n## Links\n\nThis example uses the following open source libraries:\n\n* [JHipster](https://www.jhipster.tech)\n* [JHipster React Native](https://github.com/ruddell/generator-jhipster-react-native)\n* [Ionic for JHipster](https://github.com/jhipster/generator-jhipster-ionic)\n\n## Help\n\nPlease post any questions on [Stack Overflow](https://www.stackoverflow.com) with a \"jhipster\" tag.\n\n## License\n\nApache 2.0, see [LICENSE](LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmraible%2Fmobile-jhipster","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmraible%2Fmobile-jhipster","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmraible%2Fmobile-jhipster/lists"}