Name: Vue JS and Firebase:Build an iOS and Android chat app
Rating: 3.9 (306 reviews)

Udemy Business

Teach on Udemy

Turn what you know into an opportunity and reach millions around the world.

Learn More

Your cart is empty.

Keep shopping

Created byKim Chen

Last updated 1/2022

English

What you'll learn

Build an amazing real world iOS and Android Chat Application
Implement Firebase Authentication to the mobile app
Send Image to your friends through the mobile app you create
How to create one on one chat
How to create a group chat which allow to add and remove members
Implement email verification and forget password to the Firebase Authentication

Course content

3 sections • 92 lectures • 9h 48m total length

Create a project reminder0:09
Source code0:14
Create a project11:14
Create sign in page14:36
Create sign up page9:51
Connect the app to firebase4:13
implement Vuex5:30
Create sign up action16:05
Toast Firebase message12:59
Apply mixin4:06
Browser custom photo for user profile picture3:46
Create read file action12:18
Sign up with custom profile picture15:28
Auto go to sign in page after sign up5:08
Create send email verification action4:59
Create sign in action10:11
Make the app remember the sign in status3:49
Create sign out action4:05
Check whether the email is verified6:40
Create count down on sending verification email11:18
Dynamic style of button3:02
Conditionally display resend button4:09
Add forget password function5:49
Add profile picture and name to the left panel12:06

Create edit profile page11:35
Modifiy the data and ui inside edit profile page9:01
Create update profile function11:40
Create two icons3:28
We'll create one notification icon for notifying there are incoming requests. The other icon is to go to another page to add some new friends
Create two pages3:49
In this part we are going to create two pages, the requests page for listing out who send you a friend request. The contacts pages is to show all the available users.
Get all user action7:35
For getting all the users, we will use Vuex , which go to the store.js to add an action to get all users
Beautify the contacts page7:27
Create send request action4:48
Create send request function5:03
Install lodash and make it can use the async await25:05
Complete get my requests action14:40
Beautify the requests3:07
Create delete request action7:44
Create confirm request action7:42
Create get all friends action7:59
Beautify the home page2:45
Create chat page7:46
Detail the chat page8:45
Create send message action5:43
Create send message function4:44
Create get chat messages action10:15
Display messages3:23
Group the messages by date4:59
Clear unnecessary code3:04
Browse photo as message5:34
Create read file message action6:53
Create upload chat images action5:38
Send image messages7:42
Create get user key action5:21
Create send latest message action6:26
Modify send message action5:28
Display latest message on friend list8:38

Create chat groups page4:41
Create new group page3:49
Beautify the create new group page4:57
Create group chat module4:34
Initialize group image3:18
Modify the readFile action4:54
Create new group3:46
Modify upload file action4:54
Create group action6:27
Create get all groups action5:05
List out the groups3:53
Create chatgroup page3:15
Edit chat group page6:35
Add options to chat group3:52
Add pages relate to the options6:05
Get group image7:13
Add new members action4:15
Add new member function7:58
Get group members action4:23
Modify potential member list5:50
Display group members2:43
Remove member9:09
Show number of members3:08
Determine which action group5:17
Leave group action5:53
Bind leave group action to method1:36
Edit get group member action1:43
Group info page3:32
Delete unncessary data3:11
Send group message action11:31
Send group message function4:07
Send image message4:45
Get group messages7:19
Display group messages2:44
Send latest message to group5:01
Display latest message1:09

Requirements

Basic VueJS knowledge is required
ES6 knowledge is an advantage
A basic understanding of HTML, CSS & JavaScript

Description

Master the VueJS and Firebase together to build an amazing iOS and Android chat application. By learning from this course, you are not only can build chat application, but also can apply these knowledge to build other incredible applications.

If you’re looking to get started building a real-world mobile chat app, then this course is best for you. In this course, I will teach you how to use Vue JS and Framework7 as frontend, Firebase as backend to build the chat app from scratch.

VueJ S is a very simple framework, which combine with the best of Angular and React

Framework7 is an open source framework7, which let you develop mobile, desktop or web app with a native look and feel

Firebase is a real time database, it allows you to create authentication easily, user can login with email, google, Facebook and twitter account.

The course will cover

Firebase user Authentication

Forget the password

Email Verification

Firebase real time database

One on one chat

Group chat

Who this course is for:

Anyone who wants to learn how to create native view mobile app with Vue JS & Firebase
Anyone who wants to learn Vue JS and Firebase
Anyone who wants to learn about Authentication in Vue JS apps
Anyone who wants to learn how to use Firebase in their real time applications

Who this course is for:

You are interested in building a state-of-the-art iOS and Anrdoid applications
You are looking for the best back-end which can help to create a real time application
You are looking for the framework which is much easier than Angular or React

What you'll learn

Explore related topics

Course content

Create Chat App pages and signup function24 lectures • 3hr 2min

Edit Profile Page32 lectures • 3hr 54min

Group Chat36 lectures • 2hr 53min

Requirements

Description

Who this course is for: