4 ms·

Show HN: A website built with React and Elasticsearch for exploring Magic cards

8 points by pakectas 11y ago

pakectas 11y ago
This is the second website I've ever built. My first one was also a React project, a few months ago, but with a single json file as a 'database' and a much smaller scope. In this case I've used searchkit (http://searchkit.co http://searchkit.co) to build a more sophisticated product, while learning about elasticsearch queries, typescript, and too much css to think about. What is it? Basically, it's a site that lets you impose tons of filters on search results, all of which help to explore the vast array of Magic: the Gathering cards that exist. It also shows a breakdown within those filters so you get an idea what you're looking at. (For example, there are 2427 cards that are pure red, represented by setting 'Colours' to red and 'Colour Count' to 1. If you look at the Type filter, you'll see 1361 of those are creatures. Of those, 403 of them have power 2. In the Subtype filter, it shows that Humans have most representation at 265, followed closely by Goblins at 241.) I've had a lot of design and feature feedback from people so I've already got a good amount of fixes and new features to add. It's been a good experience so far, learning how to make this (except, really, css). In particular, the searchkit devs have made this much easier by helping me out with questions and such, especially concerning elasticsearch.
fiatjaf 11y ago
Do they still launch new cards every year? Without searching too much I see many cards from the time I played Magic, around 2001~2: http://i.tcgplayer.com/7539_200w.jpg http://i.tcgplayer.com/7539_200w.jpg
- pakectas 11y ago
  Oh yeah, about 1000 new cards a year. They're up to 16171 total now.
tacone 11y ago
Isn't a 3mb index.js a little bit too much? Time to dive into minifying and gzipping :)
- pakectas 11y ago
  Yeah, it probably is. I've not made a production-ready site before, so there's plenty more for me to do. Didn't even know minifying and gzipping were necessary things yet.

8 points by pakectas 11y ago

This is the second website I've ever built. My first one was also a React project, a few months ago, but with a single json file as a 'database' and a much smaller scope. In this case I've used searchkit (http://searchkit.co http://searchkit.co) to build a more sophisticated product, while learning about elasticsearch queries, typescript, and too much css to think about. What is it? Basically, it's a site that lets you impose tons of filters on search results, all of which help to explore the vast array of Magic: the Gathering cards that exist. It also shows a breakdown within those filters so you get an idea what you're looking at. (For example, there are 2427 cards that are pure red, represented by setting 'Colours' to red and 'Colour Count' to 1. If you look at the Type filter, you'll see 1361 of those are creatures. Of those, 403 of them have power 2. In the Subtype filter, it shows that Humans have most representation at 265, followed closely by Goblins at 241.) I've had a lot of design and feature feedback from people so I've already got a good amount of fixes and new features to add. It's been a good experience so far, learning how to make this (except, really, css). In particular, the searchkit devs have made this much easier by helping me out with questions and such, especially concerning elasticsearch.

fiatjaf 11y ago

Do they still launch new cards every year? Without searching too much I see many cards from the time I played Magic, around 2001~2: http://i.tcgplayer.com/7539_200w.jpg http://i.tcgplayer.com/7539_200w.jpg

pakectas 11y ago
Oh yeah, about 1000 new cards a year. They're up to 16171 total now.

tacone 11y ago

Isn't a 3mb index.js a little bit too much? Time to dive into minifying and gzipping :)

pakectas 11y ago
Yeah, it probably is. I've not made a production-ready site before, so there's plenty more for me to do. Didn't even know minifying and gzipping were necessary things yet.