De App "EventFinder" geeft informatie weer over aankomende evenemenenten. Hierbij kan je evenemenenten ondekken door een randomizer. Om een nieuw random evenemenent weer te geven moet je de device schudden. Daarnaast kun je ontdekken welke evenemenenten er binnenkort plaats vinden. Uw favorieten events kunt u lokaal opslaan.
De visie is dat tijdens evenementen en uitgaan heb je altijd je mobiel bij je, gebruik dit app als je entreeticket en informatie voorziening. Sinds je altijd in beweging bent met mobiel op zak kunnen we gebruik maken van dit aspect. Uiteindelijk zouden we kunnen maken dat je punten kan verzamelen voor kortingen hoe meer je beweegt (mobiel schudt) op de locatie van de evenement. Dit aspect is uitgebreid naar de willekeurige event zoeken en het logo.
| Component | Toelichting |
|---|---|
| Tabs (https://ionicframework.com/docs/api/tabs) | Als hoofdstructuur wordt er gebruik gemaakt van tabs om te switchen tussen de componenten. Op de ene tab is de feature-pagina te zien waarbij een random evenement wordt weergegeven. Op de andere tab wordt een lijst weergeven van verschillende evenementen in de buurt. |
| Cards (https://ionicframework.com/docs/api/card) | Cards wordt gebruikt als detail-pagina voor een evenement. |
| List (https://ionicframework.com/docs/api/list) | Evenementen worden weergeven in een list. |
| Fab (https://ionicframework.com/docs/api/fab) | Om een event als favoriet op te slaan. |
| Sensor | Toelichting |
|---|---|
| Device motion (https://ionicframework.com/docs/native/device-motion) | Het schudden van het telefoon zorgt voor een random event weergave op de app. |
| Geolocation (https://ionicframework.com/docs/native/geolocation) | De huidige locatie van het telefoon wordt gebruikt voor het weergeven van evenementen in de buurt. |
| HTTP/API | Toelichting |
|---|---|
| Ticketmaster Discovery API (https://developer.ticketmaster.com/products-and-docs/apis/discovery-api/v2/) | Hieruit worden alle evenementen gehaald. |
These instructions will get you a copy of the application/project up and running on your local machine or own device.
What things you need to install the application and how to install them
- Install Nodejs and NPM.
- Install Ionic CLI
- Download or clone the project from the repository
- Download and install Nodejs and NPM on https://nodejs.org/
- Install the Ionic CLI globally with NPM by opening the terminal/command line and typing:
npm install -g ionic
The -g means it is a global install. For Window’s it's recommended to open an Admin command prompt. For Mac/Linux, run the command with sudo.
- Download or clone the application project on your computer.
On the top right of the repository is a green button for cloning or downloading the application project
Make sure you remember the path of the project since we will be using this often. Its the map inside the downloaded/cloned folder called eventFinder.
In Windows theres also a button Pad kopieren (Copy Path) which will save the path on your clipboard. You can copy the path now with CTRL+V or right-click and "Copy".
- Enter
NPM installto install all the required packages.
Now everything is ready for use!
There are a couple of ways to run this application; in your own browser on on your mobile device.
- Open the terminal in the folder
eventFinder. - Enter
ionic serveto run the application - This will setup the application server and automaticly open your browser where you can enjoy the app!
To run this application on your own Android device there are a few prerequisites first:
- You have to remember to connect your device with your computer and accept the connection on your device.
- Download en Install Android Studio: https://developer.android.com/studio/
- Also turn on developer-mode on your mobile phone. This application is tested in the browser and on Android.
Developer-mode on Android
1. Open the Settings app.
2. Select System (Only on Android 8.0 or higher).
3. Scroll to the bottom and select About phone.
4. Scroll to the bottom and tap Build number 7 times.
5. Return to the previous screen to find Developer options near the bottom.
Running the application on Android (source)
- Open the terminal and go to the project folder
eventFinder - Install Cordova CLI by typing
npm i -g cordova - Run the following:
ionic cordova run android - And enjoy the app on your Android-device!
Running the application on DevApp (source)
- Download the app: Ionic DevApp. It is available in the iOS App Store as well as Google Play
- With DevApp installed, sign up or login to an Ionic Account (free).
- The mobile device and your computer has to be on the same wifi-network.
- Open the terminal and go to the project folder
eventFinder - Run the following:
ionic serve --devapp(This will also open the application browser automaticly) - If the network is correct (and no network restrictions) you would see the running application in the list in DevApp in your mobile device. Select it and enjoy the app on your device!