[ Part 1 (Introduction) – Part 2 – Part 3 – Part 4 ]

Yooo! What’s going on?

Here we are with the last part of our Ionic card matching game!

Out of all the parts, this will be the shortest one given we have put in so much work already in the previous parts one through three.

If you’ll remember, in part three we had left off with a fully functioning level that had a time and life counter, along with the displayed cards.

This time around, we will basically use that same code to create another two levels and then we’ll cover some other small interface details.

Coding Summary

Let’s begin by creating another two pages (one for each other level):

[ Part 1 (Introduction) – Part 2 – Part 3 – Part 4 ]

What’s up guys?

We are back with another part of our Ionic 4 card matching game.

In the previous parts we broke down the basics of the Ionic framework, did the groundwork for our little game, added some images and coded the basic functions for matching cards on-screen.

Although we have a lot of functionality in the game already we’re lacking screens for when the player loses, wins and for loading.

That’s what we’ll be working on this time.

One more twist we’ll be adding is time. Let’s give the player something like sixty seconds to match all the cards otherwise he loses.

Coding Summary

To start off we have to add a bunch of variables to support the new screens we’re adding and to control time inside our game.

[ Part 1 (Introduction) – Part 2 – Part 3 – Part 4 ]

What’s going on guys?

We’re continuing with our Ionic 4 series today.

As explained in part one, we’re making a simple card matching game in order to learn the different components of the Ionic framework.

If you’re clueless about the Ionic framework, you should go check out the first part where I explain it in more detail.

I won’t ramble for too long in this post (as usual), since I explained that I’m not planning on covering code in these blog posts for Ionic – that’s what the videos are for anyway alright.

Instead, I’ll leave a summary of what goes down in this part.

Coding Summary

In this second part, we’ll get our card matching game to a playable state.

Basically, by the end of it, you’ll be able to select both cards and we’ll put conditions in place to check if the selected cards match or not.

[ Part 1 (Introduction) – Part 2 – Part 3 – Part 4 ]

Howdy! How you doing today?

Welcome to another series of videos!

This time we’re diving into hybrid applications with Ionic 4.

We’ll be developing a simple card matching game that you can run in many different platforms like: Android, Apple devices (iPhone, iPad, etc.) and basically anything that runs HTML, CSS and JavaScript.

I’m always excited to learn new technologies and of course, share the knowledge with you guys in my path moving forward. But why Ionic?

Ionic Framework

With the explosion of smartphones and mobile applications of this decade, there had to be new developments for programmers as well. Why?

Well, imagine that programmers would have to learn how to make applications for Android, then for Apple devices, then Microsoft products and the list goes on… something had to be done.

It turns out that hybrid applications would make our lives incredibly easier by allowing programmers to use a single codebase for applications.

All thanks to frameworks like Ionic, among others, usually JavaScript-based.

Now that you know more about the framework and its capabilities, let’s take a look at the required software for this project.