Sign in to follow this  

Recommendation for 2D online card game?

Recommended Posts

Hey, I was wondering if anyone has a recommendation for creating a 2D online card game. I'm planning on using a canvas or webgl library for the game board. (Inside a React app.)

I have experience with Phaser, but it also feels like that would be way overkill for what I'm looking for. I basically just need to draw images to screen, some drag 'n' drop, right click functionality. I don't need anything fancy or pretty. (This is going to be a client for a pre-existing card game, not something I will try to sell.) Maybe I should go the simple route and just use the straight up canvas?

Share this post

Link to post
Share on other sites

Have a look at Pixi, it just helps manage drawing to the canvas really quickly.

Usage inside React is non-trivial, but there is plenty of help out there. You might find Inler's React-Pixi module helpful, it doesn't officially support v5 of Pixi yet but I've been using it (so far) without issue. You have choices here, try searching npm/github for react-pixi and you'll come across a few implementations.

If you really like getting your hands dirty there are a few projects like regl that are fun. Probably not quite what you're after though.

You could just go the route of having an uncontrolled React component with the canvas renderer inside, again, try searching if you need help working this out. It's been done and written about a number of times for a few different front-end rendering libraries and with a few different canvas rendering libs.

There are options other than Pixi too, try searching for canvas rendering libs.

It's fun to play with the canvas API but it's quicker to let someone else create a wrapper around it, i.e. Pixi etc.

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.