A mobile first social media guessing game app.
This app is built with Angular and Ionic. This combination enables the app to work as progressive web app as well as a mobile app. Furthermore, Ionic provides standardized GUI elements that are optimized for the various platforms. For authentication Auth0 is deployed due to its simple and intuitive integration with Angular apps.
- First install dependencies using
npm install - Install the Ionic plugin for vscode
- Run the app with
ionic serveto view the app in the browser - Alternatively you can run the web build via the ionic plugin: Run > Web
- Navigate inside your browser to http://localhost:8100
-> Use the mobile screen setting provided by chrome dev tools -> More information about PWA: https://support.google.com/chrome/answer/9658361?hl=en&co=GENIE.Platform%3DAndroid&oco=0
- Install a mobile emulator plugin to open the app inside an emulator (pass localhost link to emulator)
- Alternatively you can run the Web build inside the editor which will also trigger a mobile preview (navigate to the ... next to the Web Run and select open in editor)
- Run
ng build - Sync ionic with
ionic cap syncor via the plugin - To use the native Run commands of the ionic plugin (Android/IOS) it is necessary to install Android Studio and XCode
- It is possible that your SDK is not defined. Find a help here: https://stackoverflow.com/questions/27620262/sdk-location-not-found-define-location-with-sdk-dir-in-the-local-properties-fil
- Playwright is used for end to end testing. Important: Make sure to run the application before running the tests. For example using
docker compose up - If not yet done run
npx playwright install - Run
npx playwright testto run the test suite in headless mode - Run
npx playwright test --uito run the test suite in UI mode (helpful for debugging) - Run
npx playwright codegen localhost:8100to generate your own testcase. Runnpx playwright codegen --device="iPhone 14 Pro" localhost:8100if you want to generate iPhone test cases (camera access not working)