Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Ionic Angular Firebase - ZERO to ONE [Updated 2020]
[center][Image: 225353e04fd2b190dda3e39895a5d504.png]
MP4 | Video: h264, 1280x720 | Audio: AAC, 44.1 KHz, 2 Ch
Genre: eLearning | Language: English | Duration: 86 Lessons (7h 28m) | Size: 3.2 GB

This course will be of great benefit regardless of your familiarity with Ionic, Angular, and/or Firebase.[/center]


It's designed in such a way that linearity is not necessary: helpful if you are new, but if you know what you're looking for it's quick easy to find. This is fact how true learning happens: through non-linear, creative engagement with information.

The only thing prerequisite on your part is familiarity with Javascript and/or web development, and genuine curiosity. Everything else will fall into place.



The framework releases used in this course span across Ionic 4 and 5, and Angular 8 and 9. All code in the repo has since been updated to the latest releases and tested. More information can be found at the GitHub repo.



All code from this course can be found at the GitHub monorepo (didaktio/Ionic-Angular-Course). The monorepo is broken down into submodules, which are independant repositories also locatable on the didaktio GitHub profile. Attached to every video (in Resources) is a link to the specific repo containing the code used in that video.


This is a future-proof course for practical people. Unlike many other such courses, little is given to theory. Heavy theory about the concepts of Ionic, Angular, Javascript. Web Development, Firebase etc. are of little use early on - and rarely needed at all. What matters is their capabilities and potential as relevant to your needs. This course is about that. This course is making these powerful technologies do what you want. That isn't learned from documentation, but problem-directed doing.

In this course you will pick up 90% of the important principles underlying Ionic and Angular by focusing on specific and common problems like: login, user registration, role-based capabilities, blocking particular URLs, storing and manipulating data, notifications, sending emails, and more. Every line of code in this course was written on a live development server, so most videos finish with the result live in the browser.

The course is as anti-acad as you can get. We'll work through solutions together, often line-by-line, thinking in real-. This means we'll encounter errors, figure out alternatives on-the-fly, and that things will be uncompromisingly changed when necessary.

The guiding philosophy is Just-in- Learning. Like every subject-area in the world, advancement in understanding is amplified 100-fold when the information being provided maps onto a local problem - in other words, we learn much faster when working with problems that we understand AND that are interesting. Absent well-defined problems, learning never really happens; theory only sticks when you're familiar with the subject area.

Again, this is a practical course. Only take it if you're serious about learning how to develop applications and build websites with Ionic and/or Angular.

Amongst the learnings on offer:

The fundamentals of the LATEST Ionic and Angular releases + TypeScript, Node, Google Cloud, RXJS, and more

User Login and Signup (multiple methods)

Popovers, Modals, Alerts

Notifications, automatic emails, text message logic (and all common background task needs)

How to deploy an app/website to the web using Kubernetes and/or Firebase Hosting

Storing data on device for user detection (like how most websites know it's you even when you're logged out)

How to stream, convert, transform and present live, complex data as good as Netflix (RXJS)

Angular Modules, Components, Pipes, Attributes, Directives (ngFor, ngIf, ng-container, ng-template etc)

Building a fine-grained theme controller

Ionic Pages, UI Components, CLI

Role-Specific capabilities: routes, data-viewing and entirely different UI's for different types of users (eg admin vs customer)


Forms: Simple and advanced, validation, error-handling and pre-population

Services, reusable utilities, global features

Interpolation, DOM Sanitisation

CAPTCHA forms and the 'Are You a Robot?' test

Custom scripts

Build and publish a Progressive Web Application (PWA)

Firebase: Firestore Documents, Collections, Permissions

Cloud Storage: uploading and accessing images and other media types

Cloud Functions: running secure backend processes, scheduling, fine-grained control over your app

Designing for all device screen sizes using Ionic Grid and other SCSS tricks

and much, much more.

The videos are fast-paced, dense, and somes unforgiving. Where necessary, they're slowed down -but practical people with work to do(!) want and need information that can be employed immediately. Hopefully every single video delivers on this measure. It certainly does sound-wise: every minute is backgrounded by brainwave-enhancing, epiphany-inducing sounds from the brilliant Steve Reich.


NOTE: The Basics section of this course is where to go if you're stuck with or unsure about some of the core concepts (directives, interpolation, forms, data presentation, services etc). It one of the latter modules by design - because your first foray into any domain should be to get a feel for it. You likely already have knowledge of the basics: realistic, tangible (and personal) problems are how we weave independent and fragmentary threads of knowledge into something deep and functional. Starting with theory before practice is at minimum going to slow down learning rate, and is typically the most reliable and quickest way to become disinterested and eventually turned off.



There is no Right Way to Learn. There is the way that works for you. The course is as loosely structured as it can be without sacrificing on quality. In other words, the naming needs to be informative but not --verbose, the sectioning needs to have a purpose, and each video must be lean and to the point but also able to stand on its own. The Just-in- Learning philosophy must only be deviated from when necessary; videos should first and foremost be practical, concise, and well spent. With all that in mind, what follows is a few pointers for navigating your way up Mount Everest. They're not all incompatible; use those that appeal to you, expent, iterate, throw others in the trash. The critical thing to know is: formalities and structure and tyrannical rules about sequence are usually bad things, and freedom to explore and follow interest are good. This isn't school. This is you taking control over your own learning. And yes, it can - and should! - be fun. To the tips:

Watch the Outro before you start.

Move laterally. For example, you might do the Basics section first and then jump to the intro, and then the RXJS section, and then the Badass Todo App

Do the Basics section first if you're unfamiliar with Angular.

Criticise. Have the confidence to change things, improve the code, structure the code in your preferred manner.

View everything through a practically-oriented lens. Watch videos wearing your technique-coloured glasses, not those lawyer-esque analysis spectacles.

Use tools(!) - those recommended in the course and those you discover yourself. The heuristic here is simple: if it lets you get on with working on the most important stuff (the HARD problem solving, the stuff that requires true creativity), then it's worth it. All other benefits - it saves , increases readability, better security etc - are secondary.

Speed up videos. Slow down videos. Install Video Speed Controller on your browser to enable easier jumping through and speed manipulation of the tutorials.

Use the supporting materials where possible ( the files, visit the links).

Peruse the GitHub repository when one exists.

Post questions.

Combine this course with other courses and brilliant bodies of work (Fireship on YouTube, Angular in Depth, The Net Ninja on Youtube...)

Use The Problem of Concern as your North Star.



Prioritise techniques and concepts over formalities.

Use Stack Overflow and the relevant GitHub Issues pages for errors and/or optimisations.

Know that things will constantly evolve, which means you shouldn't lock yourself in from the first day. This means being liberal with typings (use any and unknown quite a lot early on), and worrying about structure and clean imports and other formalities when things are working. The heuristic here is: let small fires burn. Small fires rid the woodlands of flammable materials, thereby minimising the chances of one big, catastrophic fire. This applies to pretty much all aspects of life, but is starkly manifest in programming.

When building for users, how you do things under the hood should be extremely conservative relative to the UX. This is most apparent with form input, where users should be able to enter typos and other different representations of the same data without any fuss. Under the hood, all data is converted and normalised into a standard form. For example with dates, you might let the user enter a date or use a datepicker. This means two different types of data. Combine this with the usual complication accompanying date manipulation (dealing with zones, incorrect dates, offsets, readability, unix vs iso etc), and you've got the ultimate recipe for a migraine. A far-reaching decision to make early on might be to deal only with ISO strings in the backend, meaning you convert EVERY single date into an ISO. If the datepicker gives you a date object, you convert it to an ISO. If the user enters something like (10.12.2019), you convert it to an ISO. This ISO is how you store the information backend. Displaying it frontend then becomes a doddle: another conversion into the preferred format, and some interpolation - simple. This method works because ISO strings, like unix and javascript stamps, are the same for everybody.

Don't worry about testing.

The less code the better. Condensed, concise code has more to it than beauty: by demanding true understanding, it protects against the illusion that information consumption equals knowledge. It doesn't. I can read one thousand lines of code and, thinking that the invested and length of information absorbed is impressive enough, be satisfied with my grasping. But later on I end up coming back to that code repeatedly and making a ton of other errors because actually, I don't understand. Alternatively, I could breakdown (and even improve upon) that one line of code which resembles a space equation, and not leave until I actually understand. And if I cannot understand, at least I don't have the illusion that I do. Finally, condensed code far better facilitates principles of modularity, flexibility, changeability, and debuggability.



This is a future-proof course. Just like any real-world project or company or system, the course and it's supporting resources (links, GitHub Repo) will be continuously updated - new tutorials, errors addressed, dependencies updated, and additional content added as requested or necessary. The course uses a combination of Angular 8 and 9, node 10 and 12, and Ionic 4 and 5. If you have any problems, a question or something else you'd like to talk about, do reach out.

keywords: ionic, angular, web development, ionic 4, ionic 5, angular 8, angular 9, typescript, node, kubernetes, firebase, npm, websites, progressive web application, pwa, future-proof, coding, programming, google cloud, aws, docker, git, role-based, notifications, rders




Forum Jump:

Users browsing this thread: 1 Guest(s)