Git Product home page Git Product logo

ionic4-ionfits's Introduction

Ionifits is a Zenefits-inspired human resources demo app. It's a showcase of Ionic App Platform technologies, including Ionic Framework, Capacitor, Appflow, and Ionic Enterprise solutions.

Ionifits screenshot on iOS

Try the App

Ionifits runs on the web, iOS, and Android all from a single codebase. See for yourself:

To log into Ionifits, use username [email protected] and password: ionic. Optionally, tap the "Skip" button to bypass the login.

An 8 minute overview video of the app's key features is also available. See the app running on an iPhone alongside explanations of the real code in use.

Features

"Vanilla" Ionic Framework: Show off the power and performance of Ionic UI components by using them as-is (out-of-the-box as much as possible).

Login page, powered by Auth Connect and Identity Vault: After login, the Auth0-powered user access token is securely stored in the mobile device keychain using Ionic Identity Vault. When the app is placed into the background, the screen is obscured to protect Ionifits data. Log out from the Settings page.

Employee Management page: Display a list of all "employees", demonstrating high performance infinite scrolling containing hundreds of items. Tap on an employee to see their details (note the built-in Ionic Framework native-feeling animations).

Expense Management page, powered by Ionic Secure Storage: Complete expense management implementation (similar to how Abacus works), featuring full CRUD (create-read-update-delete) for expenses. Add a new expense's merchant name, cost, date, and more, and capture a photo of the receipt using your device's camera. Once saved, tap on the expense to make changes. Slide an expense item in the list of Completed Expenses to the left to delete it. All expenses are encrypted on device using Ionic Secure Storage.

Settings page: Simple page showing off other Ionic Framework UI components. If user has logged in, user name is displayed and Log Out button appears.

Implementation Details buttons: Tap the "i" icon in the upper-right hand corner to view details about the technologies used, including Ionic Framework UI components and Ionic Native Enterprise features.

Tech Details

How to Run

Note: Installing and running this app requires a subscription to Ionic Enterprise. For details and a live demo, please reach out here.

  • Install the Ionic CLI: npm install -g @ionic/cli
  • Clone this repository: git clone https://github.com/ionic-team/ionifits.git
  • Navigate to repo in a terminal: cd ionifits
  • Add an Ionic Enterprise Native key into your .bash_profile file or as an Environment Variable on Windows: export ENT_NATIVE_KEY="key_4e9d5..."
  • Install dependencies (this will fail if you don't have an Ionic Native key): npm i
  • Run locally in a browser: ionic serve
  • Deploy to a mobile device: See details here.

ionic4-ionfits's People

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.