Create a full Ionic app with material design - full stack
Course description
It's time to level up and take your design and development skills to the next level: hybrid app development. Ionic 3 allows you to build powerful hybrid apps that work on a variety of mobile platforms including Android, IOS and Windows. This is a full stack development course, which means you're going to witness the entire process from design to code, start to finish. To begin, we will design the logo and create a series of interactive prototype mockups.
Read more about the course
To begin, we will design the logo and create a series of interactive prototype mockups. Then, we will spend the rest of the course developing the app using Ionic 3 and Angular 4.
We will use the free IGDB (Internet Games Database) API to power our app, which will allow users to sort through and discover the latest upcoming games in every genre.
If you're only interested in design or coding, that's perfectly fine! This course is structured in such a way that allows you to jump in on any lesson; as each lesson contains the project files up to that point.
As you can see, this course is absolutely jam-packed with real-world information that you can apply to every project going forward.
So, if you're ready to learn by doing, let's get started!
- Understanding of HTML
- Understanding of CSS
- Basic understanding of Javascript
- Software: Adobe Illustrator or Vector Equivalent (If you're following design)
- Software: Adobe Experience Design (If you're following design)
- Front-end Developer
- Web Developer
- App Developer
What you'll learn:
- Create a relevant and effective logo
- Building App Mockups in Adobe Experience Design (XD)
- App Prototyping with Adobe XD
- Connect to an API
- Understand Ionic Templating, Storage & Material Design
- Integrate Search in an Ionic App
- Integrate Cordova Plugins
- Integrate Angular Animations
- Build an awesome Ionic 3+ App
Watch Online
Watch Online Create a full Ionic app with material design - full stack
All Course Lessons (25)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Designing the Logo Project Resources Demo | 10:43 | |
| 2 | App Icon Design | 05:51 | |
| 3 | Splash Screen UI | 08:13 | |
| 4 | Main UI Header | 12:17 | |
| 5 | Main Game Listing UI | 08:54 | |
| 6 | Favorites UI | 03:18 | |
| 7 | Game Genres Search UI | 10:30 | |
| 8 | Game Details UI | 13:53 | |
| 9 | Installing Prerequisites Starting the Project | 04:51 | |
| 10 | Connecting to the API | 13:26 | |
| 11 | Generating the Page Attaching the API | 06:06 | |
| 12 | Integrating Storage and a LoadingController | 11:40 | |
| 13 | Defining the Navigation Template | 08:55 | |
| 14 | Defining the Games Listing Template | 09:09 | |
| 15 | Styling the Games List | 07:56 | |
| 16 | Favorites | 09:43 | |
| 17 | Filters Modal | 06:20 | |
| 18 | Filters Template API | 08:39 | |
| 19 | Search | 10:45 | |
| 20 | Details Page API | 10:55 | |
| 21 | Details Template | 11:14 | |
| 22 | Details Styling | 06:05 | |
| 23 | Making the Videos and Website Link Work | 05:14 | |
| 24 | Adding Animation | 08:33 | |
| 25 | Launching the App on your Phone | 08:12 |
Unlock unlimited learning
Get instant access to all 24 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionComments
0 commentsSimilar courses
Ionic 4 Firebase Master Course
Want to join the conversation?
Sign in to comment