Get started with Ionic by building a Notes app that runs on iOS, Android, and the web - with just one codebase. Powered by Ionic React (web app) and Capacitor (native app runtime).
It is a Notes app which have two tabs, one is the home page where the notes are listed and another is the new note tab where you can create the new note and save it. These notes are saved in the local storage.
- App framework: React
- UI components: Ionic Framework
- Menu Tabs: Tab-based navigation
- Notes display cards: Cards
- Home page (
src/pages/Home/home.tsx): Notes displaying page in the card view. - New List page (
src/pages/New List/newList.tsx): Creating a new note and saving it. - Layout high order component (
src/hoc/layout.tsx): Defines the structure of the application with routing.
Note: It's highly recommended to follow along with the tutorial guide, which goes into more depth, but this is the fastest way to run the app.
- Install Ionic:
npm install -g @ionic/cli. - Clone this repository.
- In a terminal, change directory into the repo:
cd cs732-se75-assignment-mohatankita. - Install all packages:
npm install. - Run on the web:
ionic serve. - Create the build:
ionic build - Run on Android:
- If capacitor is not installed, use this command to enable the capacitor:
ionic integrations enable capacitor - Create the build:
ionic capacitor add android - Run the build:
ionic capacitor run android - For more info, See here
- Creating virtual device on android: See here
- Run on iOS:
- If capacitor is not installed, use this command to enable the capacitor:
ionic integrations enable capacitor - Create the build:
ionic capacitor add ios - Run the build:
ionic capacitor run ios - For more info, See here
Deploying to play store, See here Deploying to app store, See here