Ionic Framework with VueJS: Build a CRUD App Using SQLite

Get you VueJS App running on IOS and Android Using Capacitor & Sqlite Plugin

4.38 (8 reviews)
Udemy
platform
English
language
Mobile Apps
category
instructor
140
students
3 hours
content
Feb 2021
last update
$44.99
regular price

What you will learn

Using Ionic & Capacitor to Deploy VueJS Apps to Native Devices

Working With SQLite Database

Deploying VueJS App to Mobile Device with Capacitor

Anyone who wants to create a cross platform mobile application with Ionic, Capacitor and SQLite

Description

The new Ionic Framework VueJS Web Components are a great way to leverage your javascript skills with VueJS to build professional looking Mobile Applications and PWAs efficiently.


This course, including the final source code, is to get you prepped for the more advanced course that I have provided here on the Udemy platform. We are not expecting you to have a deep knowledge of Vue3 and Ionic Framework, but if you get stuck, don't worry, there is great documentation provided on the Ionic Framework Website


Create a CRUD Application with Ionic VueJS and Capacitor SQLite Plugin

  • Create the project and get the basic structure created

  • Capture data using ionic input elements

  • Learn CRUD actions ( Create, Delete ) for the data

  • Create an IonList to view the content

  • Use IonItem, IonLabel, and IonInput to manage forms

  • Use Ionic Lifecycle Methods

  • Use Vue Provide Inject to access the database

  • Learn to use Capacitor SQLite Plugin to query and update the database

  • Test and run application on native devices using Ionic Framework Capacitor  live reload

Aaron Saunders is the CEO Clearly Innovative Inc web and mobile development firm I started 10 years ago. I have been working in the software development industry as a development, manager, and executive for over thirty years. I have taught at the university level and run an apprenticeship program within my company

At Clearly Innovative Inc, we have built solutions for large and small business and have been using Ionic Framework since version 1

Content

The Basic of SQLite CRUD App Using Ionic VueJS

Introduction
Install Plugin, Run IOS Simulator
Create First Table In SQLite
Create First Database Insert
Create a Input Page For Adding Contacts
Add Query To Create Contact and Reload Data
IonList and Delete Contact
Editing And Existing Contact
Android Configuration - Video Overview
Android Configuration Code

Ionic UI Component Extras: Adding More Polish

Adding IonAlert Instead of Browser Alert
Adding IonToast for Confirmation of Changes
Adding IonAlert to Confirm/Prompt Before Delete

Refactoring the SQLite Functionaliy Into A Service

Refactoring the Code : Database Setup And Initialization
Refactoring The Code: All the CRUD Functions
Android Configuration - Check Build

Resources

Source Code - 1
Source Code - 2 Ionic UI Component Extras
Source Code - 3 SQLite DataService Refactor Completed

Screenshots

Ionic Framework with VueJS: Build a CRUD App Using SQLite - Screenshot_01Ionic Framework with VueJS: Build a CRUD App Using SQLite - Screenshot_02Ionic Framework with VueJS: Build a CRUD App Using SQLite - Screenshot_03Ionic Framework with VueJS: Build a CRUD App Using SQLite - Screenshot_04

Reviews

Yap
August 9, 2021
I love the way how instructor do the real life mistake instead of doing some thing 'perfect', he solve the problems immediately in-front of us, good instructor !

Charts

Price

Ionic Framework with VueJS: Build a CRUD App Using SQLite - Price chart

Rating

Ionic Framework with VueJS: Build a CRUD App Using SQLite - Ratings chart

Enrollment distribution

Ionic Framework with VueJS: Build a CRUD App Using SQLite - Distribution chart
3851680
udemy ID
2/15/2021
course created date
2/19/2021
course indexed date
Bot
course submited by