Ionic7/Angular SQLite Starter

ionic7-angular-sqlite-starter

Ionic7/Angular application demonstrating the use of the

@capacitor-community/sqlite

this app uses Capacitor 5

Maintainers

Maintainer	GitHub	Social
Quéau Jean Pierre	jepiqueau

Introduction

This application is a complete starter solution for Ionic 7 Angular 16 SQLite CRUD operations using @capacitor-community/sqlite plugin with Capacitor 5.

This application will implement the well known Authors-Posts-Categories SQLite database.

PostData {
  id!: number;
  title!: string;
  text!: string;
  author!: Author;
  categories!: Category[];
}

Author {
  id!: number;
  name!: string;
  email!: string;
  birthday?: string;
}

Category {
  id!: number;
  name!: string;
}

Database schemas are defined using the Incremental Upgrade Database Version workflow in the folder src/app/upgrades/author-posts/upgrade-statements following the guidelines (https://github.com/capacitor-community/sqlite/blob/master/docs/IncrementalUpgradeDatabaseVersion.md).

Initial data for database version 1 are provided in the file src/app/mock-data/posts-categories-authors.ts.

Access to the @capacitor-community/sqlite plugin is made through the use of an angular service (src/app/services/sqlite.service.ts).

Authors-Posts-Categories CRUD operations are accessible through the use of an angular service (src/app/services/author-posts.service.ts).

Initialization of the application is made in the angular service (src/app/services/initialize.app.service.ts) which instantiate the sqlite service, create database schemas and upload the mock data.

In database version 2, company column was added to the author table.

Demonstrations

Demonstrations

Installation

To start building your App using this App, clone this repo to a new directory:

git clone https://github.com/jepiqueau/ionic7-angular-sqlite-starter.git 
cd ionic7-angular-sqlite-starter
git remote rm origin

• then install it

npm install

• if you use the Electron platform

npm run electron:install

• the capacitor config parameters are:

  "appId": "com.jeep.app.ionic7.angular.sqlite",
  "appName": "ionic7-angular-sqlite-starter",

Building Web Project

• development

  • angular cli

  npm run start

  • ionic cli

  ionic serve

• production

npm run build:web

Building Native Project with standard procedure

npm run build:native
npx cap sync
npx cap copy

- Android

npx cap open android

Once Android Studio launches, make sure that you are using

• Gradle JDK version 11
• Android Gradle Plugin Version 7.2.2

and build your app through the standard Android Studio workflow.

- iOS

npx cap open ios

Once Xcode launches, you can build your app through the standard Xcode workflow.

Building Native Project with Ionic Cli

- Android

npm run ionic:android

Once Android Studio launches, make sure that you are using

• Gradle JDK version 11
• Android Gradle Plugin Version 7.2.2

and build your app through the standard Android Studio workflow.

- iOS

npm run ionic:ios

Once Xcode launches, you can build your app through the standard Xcode workflow.

Building Electron Project

npm run electron:start

Contributors ✨

Thanks goes to these wonderful people (emoji key):

This project follows the all-contributors specification. Contributions of any kind welcome!