Ionic Angular SQLite

• App to store data using the Ionic framework, cordova SQLite database & SQLite Porter and Capacitor.
• Note: to open web links in a new window use: ctrl+click on link

Table of contents

• Ionic Angular SQLite
  • Table of contents
  • General info
  • Screenshots
  • Technologies
  • Setup
  • Code Examples
  • Features
  • Status & To-Do List
  • Inspiration
  • License
  • Contact

General info

• App allows user to add details of developer and products.
• Initial seed data is a short list of developers and dev skills.

Screenshots

Technologies

• Ionic/angular v6
• Ionic v6
• Angular v15
• cordova plugin SQLite database v6
• cordova SQLite Porter v6

Setup

• Run npm i to install dependencies
• To start the server on localhost://8100 type: ‘ionic serve’

Code Examples

• database.service.ts function to get details of a developer from the database that return a promise of format Dev

getDeveloper(id): Promise<Dev> {
  return this.database.executeSql('SELECT * FROM developer WHERE id = ?', [id]).then(data => {
    let skills = [];
    if (data.rows.item[0].skills !== '') {
      skills = JSON.parse(data.rows.item[0].skills);
    }
    return {
      id: data.rows.item(0).is,
      name: data.rows.item(0).name,
      skills,
      img: data.rows.item[0].img
    };
  });
}

Features

• storage of data in an SQL database.

Status & To-do list

• Status: compiles and displays in a dev server. Build webpacks created. Needs implementing on an Android device or simulator to use database etc. Database side not tested.
• To-do: test database to see if it stores Dev and Product details.

Inspiration

• devdactic: How to Build an Ionic 4 App with SQLite Database & Queries (And Debug It!).

License

• This project is licensed under the terms of the MIT license.

Contact

• Repo created by ABateman, email: gomezbateman@yahoo.com