Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS AWS Certified Developer - Associate CompTIA Security+
Photoshop Graphic Design Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Mindfulness Personal Development Personal Transformation Meditation Life Purpose Coaching Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee

This course includes:

  • 12 hours on-demand video
  • 2 articles
  • 2 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
Development Mobile Development Ionic

Build an Instagram-Like Android App Using Ionic 3

Create Awesome Instagram App from Scratch using Ionic Framework V3
Rating: 0.0 out of 50.0 (0 ratings)
3 students
Created by Mustafa Alawi
Last updated 9/2020
English
English [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • Build an Instagram-Like Android Application from Scratch using Ionic 3 Framework

Course content

11 sections • 202 lectures • 12h 7m total length

  • Preview01:39
  • Preview01:24
  • Preview02:45
  • Preview01:56
  • Preview02:43
  • Which IDE should be used?
    01:45
  • Project Structure
    03:07
  • Ionic documentation
    05:04
  • Preview01:08

  • The three main sections
    01:40
  • Center Instagram
    00:29
  • Card design - part 1
    05:26
  • Card design - part 2
    02:47
  • Card design - part 3
    02:11
  • Card class
    04:03
  • The three icons
    07:09
  • Colors variable for three icons
    01:27
  • Caption design
    02:48
  • Ionic home page test
    01:13
  • Tabs 1
    01:56
  • Tabs 2
    00:59
  • Tabs 3
    03:14
  • Ionic icons
    01:53

  • Create profile page
    02:31
  • Add profile icon to tab bar
    01:57
  • Profile page design - part 1
    12:32
  • Profile page design - part 2
    00:56
  • Profile upper area test
    01:41
  • Profile user bio design
    04:20
  • ion segments
    04:58
  • Grid images - part 1
    05:04
  • Grid images - part 2
    02:08

  • Login page design - part 1
    07:19
  • Login page design - part 2
    05:54
  • Login page design - part 3
    02:21
  • Signup page design - part 1
    03:18
  • Signup page design - part 2
    05:28

  • Search page design - part 1
    08:54
  • Search page design - part 2
    03:51
  • Notification page design - part 1
    03:48
  • Notification page design - part 2
    02:56
  • Notification page design - part 3
    03:46
  • Message page design
    05:10
  • Message page - ngFor
    04:40
  • Getting to messages page
    05:52
  • Displaying messages with objects
    05:49
  • Single conversation design - part 1
    06:39
  • Single conversation design - part 2
    05:52
  • Receiving last message
    04:58
  • Conversation messages array
    09:31
  • Conversation messages on left & right sides
    05:13
  • Send message function
    04:41

  • Create camera page
    01:14
  • Camera - importing package
    04:53
  • Adding camera page to tab bar
    01:28
  • Camera page design
    04:30
  • Take photo function
    04:55
  • Select photo function
    03:06
  • Share button
    05:06
  • Install file transfer
    01:45
  • File transfer object - part 1
    04:03
  • File transfer object - part 2
    03:31

  • creating user provider
    03:39
  • Import user provider into app module
    00:51
  • HTTP Client import
    00:35
  • User provider variables
    07:11
  • set user method
    02:13
  • Creating edit profile page
    01:44
  • Go to edit profile
    03:08
  • Edit profile page design - part 1
    04:53
  • Edit profile page design - part 2
    05:31

  • Login logic
    05:56
  • Alert in login page
    02:47
  • Testing login page logic
    02:55
  • Signup logic
    05:14
  • Go from login to signup page
    03:03
  • HTTP native module
    02:43
  • Login if else statement
    05:45
  • Storage - import
    02:58
  • Store user info in storage
    04:18
  • set user before redirecting
    02:11
  • Login redirect to tabs
    00:48
  • Testing login page loader
    00:51
  • Signup else logic
    03:08
  • Signup redirect to tabs page
    00:37
  • Testing signup page
    02:56
  • Header
    00:54

  • Database structure
    04:22
  • Back end url structure
    01:55
  • Users table
    04:03
  • Login PHP 1
    03:48
  • Login PHP 2
    05:20
  • Signup PHP
    06:02
  • Database connection
    01:35
  • Ionic cordova browser
    03:11
  • Add all tables
    04:23
  • Things to check before testing
    02:47
  • Test login & signup in the browser
    03:58
  • home page after login 1
    04:34
  • home page after login 2
    00:55
  • home page after login 3
    04:05
  • home page get following ids
    01:02
  • latest posts array structure 1
    03:28
  • latest posts array structure 2
    02:16
  • latest posts array in home HTML
    04:36
  • Get all posts
    04:24
  • Edit user info - HTTP
    09:43
  • Redirect after edit user info
    01:34
  • Update user data - backend
    02:17
  • Logout
    06:16
  • Search - HTTP
    04:34
  • Search bar keyup event
    03:18
  • Search - backend
    02:00
  • Search results
    03:03
  • Comments page design
    05:59
  • Comments page - HTTP
    03:39
  • Send comment - HTTP
    06:13
  • Get all comments
    01:40
  • Send comment - backend
    02:05
  • Other user profile
    04:42
  • Other user profile design
    01:44
  • Other user profile - get all user data
    03:39
  • Other user profile - SCSS
    00:48
  • Same image size
    02:58
  • Other user profile - get all user posts
    02:48
  • Other user profile - following status
    06:30
  • Follow & unfollow click event
    06:16
  • Follow this person
    03:56
  • Unfollow this person
    03:22
  • Check following state - backend
    02:40
  • Get user data - backend
    02:08
  • Get all user posts - backend
    01:31
  • Add user to "likes" table
    01:33
  • Transfer image - backend
    04:49
  • Store image info
    08:17
  • Store image info - backend
    06:41
  • Store image info fields & increase number of posts
    02:12
  • Folder to store uploaded images
    01:24
  • Store image info then go to home page
    00:46
  • Change profile image 1
    06:05
  • Change profile image 2
    07:41
  • Change profile image 3
    04:10
  • Change profile image 4
    04:52
  • Unexpected end of JSON
    03:38
  • All tables
    05:21
  • Test search in browser
    02:33
  • Test follow & unfollow in the browser
    02:31
  • Test home feed in the browser
    02:22
  • Notification for you - HTTP
    02:19
  • Get user notification - backend
    04:46
  • New like - click event
    05:52
  • New like - backend
    03:07
  • Increase likes - HTTP
    02:01
  • Increase number of likes - backend
    01:53
  • Change heart color to red
    04:31
  • Change heart color to black
    03:09
  • Decrease likes - backend
    02:23
  • Remove user from users table
    02:35
  • Test like photo
    01:00
  • Headers PHP
    02:03
  • Project URLs
    04:49
  • Get all messages list
    05:59
  • Conversation messages array
    00:38
  • Conversation messages in HTML
    03:37
  • Store sent message in database 1
    06:10
  • Store sent message in database 2
    02:06
  • Protect all pages
    04:13

  • App name & version
    01:44
  • Change icon
    02:08
  • Test send comment
    01:29
  • Test edit profile in browser
    02:13
  • Test go to poster profile in browser
    01:16
  • Test notification in browser
    04:24
  • Test select image & take photo
    03:24
  • Date pipe
    01:23
  • Scroll effect & pagination
    11:39
  • Display following - advanced 1
    07:16
  • Display following - advanced 2
    02:21
  • Display followers 1
    09:11
  • Display followers 2
    00:51
  • Go to followers & following profiles
    04:24
  • Follow yourself bug fixed
    04:04
  • Android environment setup
    01:36
  • Java JDK - MAC
    06:30
  • Install gradle
    05:02
  • Installing Android Studio - MAC
    05:35
  • Installing Android Studio - Windows
    05:46
  • Java JDK - Windows
    01:34
  • APK debug version
    06:34
  • Test login & signup - emulator
    03:45
  • Test profile & edit profile - emulator
    01:02
  • Test follow & unfollow - emulator
    01:42
  • Update number of following - emulator
    06:14
  • Update number of followers & number of following - browser
    02:48
  • Test change profile image - emulator
    03:00
  • Test select image - emulator
    02:45
  • Ionic Cordova run android command
    00:57
  • Test camera - emulator
    02:30
  • Create APK for Google Play Store
    08:51
  • Congrats!
    01:20

Requirements

  • Good Javascript knowledge
  • Good Object Oriented Programming knowledge
  • Basic understanding of HTML & CSS
  • PC/Mac with Windows/OSX
  • Internet Connection

Description

In this course, Build Instagram-Like Android App in Ionic, will take you step by step towards creating a complete awesome Instagram-Like Android app using Ionic Framework version 3 from scratch.

Building Android apps has never been easier. With Ionic framework, you will be able to create complete, well-designed, user-friendly Android apps quickly, test them, and upload them to Google Play Store. In this course, I'll be using these amazing features given by Ionic framework to build an Android application similar to Instagram. So by the end of this course you will have learned how to create a very complected app like Instagram for Android devices, and you will have your own version of the App!

This course is divided into three main parts:

  1. The first part is that You will learn how to design your app just like Instagram.

  2. Then I'll teach you all the logic to make the app functional.

  3. And finally I'll also teach you the back-end side where it's an essential part to make the app completely functional.

Therefore at the end of this course you will have an outstanding understanding of how an app like Instagram works, and you will be able to create complex apps as well!


Why take this course?

There are many benefits of taking this course for example you will:

1. Improve your programming skills by build a complicated app.

2. Be able to create your own Android mobile apps.

3. Be able to apply for Ionic developer jobs.


What will you learn in this course?

You will learn a LOT in this course, as this course covers the three main aspects of building an Android app: the user-interface, front-end logic, the back-end logic and connection to database.

Here is a list of topics covered in this course:

  1. How to install Ionic

  2. User interface design

  3. How to use Ionic documentation

  4. Ionic icons

  5. Create navigation tabs

  6. Create user profile

  7. Grid images

  8. Login page

  9. Sign up page

  10. Search feature

  11. Capture photos

  12. Upload photos

  13. Scroll infinitely

  14. Pagination

  15. Edit user profile

  16. Logout

  17. Create post

  18. Add comments

  19. Follow other users

  20. Unfollow other users

  21. Change profile image

  22. Like posts

Wish you a successful journey throughout this course.

See you!

Who this course is for:

  • Web developers who want to create Android mobile apps
  • Developers who want to specialize in Ionic framework
  • Mobile app developers who want to learn Ionic framework

Instructor

Mustafa Alawi
Software Engineer & Entrepreneur
Mustafa Alawi
  • 4.0 Instructor Rating
  • 410 Reviews
  • 2,148 Students
  • 27 Courses

Hi, it's Mustafa Alawi, a Software engineer & entrepreneur. I've basically seven years of experience in web development & software development. I also have a great passion for Business & entrepreneurship and I run two businesses.

I like teaching people and providing them with the knowledge that I have because I believe that sharing information is essential in the process of developing our world. I also work on multiple projects consistently and like to share my ideas, get other people's ideas and build upon each others ideas. 


  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.