# Feature Explanation
## **User Authentication**
User authentication is often the first and most important part of the app. This template has pages for Login, Forgot password and Update password.
As per your requirements, you can either
— Allow a user to access the app without login/signup, and ask a login for specific features, OR
— Do not allow any access without login/signup. In this case the Login page with go on top of the router navigation in `app-routing.module.ts`. Only once there is a “login”, the user should be allowed access to HomePage. Authentication can be achieved by your custom back-end or, if you are using Firebase, there are several easy authentication options. You can even choose to integrate social logins in the app. Check details for social logins here
* [Google Login with Ionic](https://enappd.com/blog/google-login-in-ionic-4-apps-using-firebase/39)
* [Facebook Login with Ionic](https://enappd.com/blog/facebook-login-in-ionic-4-apps-using-firebase/25)
* [Twitter Login with Ionic](https://enappd.com/blog/twitter-login-in-ionic-4-apps-using-firebase/24)
* [Anonymous login](https://enappd.com/blog/firebase-anonymous-login-in-ionic-4/37)
* [Email login](https://enappd.com/blog/email-authentication-with-firebase-in-ionic-4/38)
## **Adding cards, Settings, Edit Profile, etc**
This template takes the dummy data from the JSON files placed in the `data.service.ts` file. If you only want to create static data, you can modify the JSON files’ data and the data in the page/ layout will change.
For example, on the Homepage — we see an array of cards.
These cards are imported from the JSON data in the `data.service.ts` file in src/app.
You can generate service in Ionic 5 by executing the command
```
$ ionic g service your service name
```
Editing this data will edit the view in the page on serve or device.
Once you connect your back-end with the app, this JSON data will be replaced by the backend data. All the data labels are self-explanatory.
## **Images**
You can choose to load images from URLs (recommended), or keep images in the local storage. If you are loading images from URL, keep a backup image to show in case the actual image takes time to load.
## **Swipe-able cards**
This is the central component of the dating app. This template has this feature — for getting the interactive animations to users and allowing the user to express his/her perception about the profiles and perform various actions according to that.
The app uses Ionic **angular2-swing** npm package for swipe-able card gestures and **ionic-swing** npm package as a wrapper for swipe views.\
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://enappd.gitbook.io/ionic-tinder-style-template/template-features-1/feature-explanation.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.