Ionic Demo App for Web, iOS, Android & Desktop

This repository shows various Ionic & Capacitor Features. Made using TypeScript, React, Vite, Ionic, Capacitor & Electron. Deployed to Netlify.

Tutorial Followed: freeCodeCamp
Instructor: Simon

Funcionalities:

• Ionic Slider to Show Sliding Components.
• Native Camera & Image Picker.
• Button Animation.
• Various Gesture.
• Pull Down to Refresh.
• In-App Screen Navigation with Gesture.
• Modern / Responsive Layout.
• Desktop Application with Electron Wrapper.

Prerequisites

Node ^= 16

Android Studio / XCode (Virtual Device Simulation)

VS Code (IDE)

Cloning the repository

git clone https://github.com/nayak-nirmalya/ionic-playground.git

Running Project

To run your project, navigate to the root directory and run one of the following npm commands:

Start the Web App

npm run dev

Available commands

Running commands with npm npm run [command]

command	description
dev	Starts a development instance of the web app
build	Starts a building final version for production
lint	Run lint check as configured in .eslintrc.js file
preview	Run final build production version
npx:sync	Sync all apps to final version
run:android	Run android app with hot reload feture
electron	Run the desktop app with electron

Screenshots

Intro Card

Register Screen

Login Screen

Logging In Loading Screen

User Loading Skeleton Screen

Home Screen

Pull to Refresh Screen

User Detail Modal Screen

User Detail Modal DateTime Screen

Sidebar Menu Screen

Camera/Image Picker Screen

Gesture with Animation Screen

Desktop App with Electron

Web App with Ionic, React & Vite