JavaScript Interactive "Baseball Cards" Grid

The challenge is to take JavaScript arrays full of JavaScript objects and make a nicely formatted and interactive grid of "baseball cards". The cards will have an image on the front with a name or other identifier and it will be able to "flip" to show some stats or other interesting information on the back. This CodePen should be useful: https://codepen.io/thortek/pen/yQyXvz

You may use whatever source of data you like (Star Wars, Senators, Pokemon, etc.) but you must have at least 25 cards on display. You must also provide the ability for a user to add a new, blank card to your collection.

The page should include the following elements:

Header that summarizes what the page is about

Grid full of at least 25 images that look somewhat like baseball or playing cards

Interactive cards individually flip with an animation of your choice to show stats

The skills to demonstrate with this page are:

Ability to filter, map, and reduce arrays of JavaScript objects

Click event handling to make the card interactive

Basic CSS and/or JavaScript animations

Flexbox skills to evenly layout grid of cards with pictures

New custom JavaScript object creation