• Fat Cats Boardgame
  • Wicket UI Library
  • About Me

Java and Wicket web development thoughts, tutorials, and tips

roman@coderdreams.com
Coder DreamsCoder Dreams
  • Fat Cats Boardgame
  • Wicket UI Library
  • About Me

Themeable React Monopoly board

September 10, 2020 Posted by Roman Sery react No Comments

I’ve been working on a Monopoly game with a customized rule set and more gameplay options for players to try different strategies. I feel the standard rules make the game mostly based on luck.

It’s been a lot of fun so far mostly because it’s different from the stuff I usually work on and I’ve been learning a lot. Specifically React, CSS grid/flex, NodeJS, Express, Socket.IO, and more. I think the biggest challenge is getting the networking code to work right and to deal with slow/lagging connections, disconnects, and so on.

Live Demo

I want to share some early React/CSS code for displaying the game board, you can see it here.

You can also find the full source here.

Planned game features

One of the features of the game will allow players to create and save their own themes. Other players will be able to select from a list of existing themes. The demo is NYC-themed and you will be able to create your own by giving custom names to the squares.

Instead of having the player that lands on a square immediately purchase it, there will be a new auction system. There will also be more trading and negotiation possibilities between players including loans and rent forgiveness.

If you’re familiar with RPG video games, there will be some elements of that as well. Similar to collecting $200 when you pass GO, each player will also receive ability points they can put into a variety of categories.

About the code

The GameBoard component renders a set of GameSquare components. Each square is assigned an id that used to lookup configuration data. SquareConfigData configures various properties for each square such as color, position, type, and group.

The components in the squares folder are different display implementations that are used by the different square types.

To change the theme data, just change the names in NyThemeData.

No Comments
Share
4

About Roman Sery

I've been a software developer for over 10 years and still loving Java!

You also might be interested in

How to create dynamic HTML markup for Wicket panels

Nov 9, 2019

Use IMarkupResourceStreamProvider and IMarkupCacheKeyProvider to allow your Wicket Panel's to generate their own dynamic markup!

How to implement record locking in Wicket

May 28, 2020

The concept of record locking is useful when you want to allow only one user to edit a data record at a time. In a multi-user environment, you want to avoid the case where multiple users are simultaneously editing the same record and possibly overwriting each other's changes.

Wicket quick tip #4: Change default AjaxChannel to Active

Jul 7, 2020

Change the default behavior of Wicket's ajax request processing in order to avoid some common bugs.

Categories

  • aws
  • customization
  • database
  • debugging
  • enum
  • java
  • models
  • performance
  • projects
  • react
  • software design
  • Spring
  • tool
  • Uncategorized
  • wicket

Recent Posts

  • Rent Day
  • Self-contained Wicket Fragments
  • Pros and cons of unit testing
  • Themeable React Monopoly board
  • Please dont use client-specific release branches

Recent Comments

  • TCI Express Thanks for sharing such insightful information. TCI Express truly stands out as the best air logistics company, offering fast, secure, and efficient air express and cold chain transportation services....

    Tracking down a bug in production Wicket application ·  March 25, 2025

  • Tom Error: A zip file cannot include itself Can you please correct the plugin part so it doesn't use the same folder as input?

    Deploying Spring Boot app to AWS Beanstalk with Nginx customization ·  September 3, 2021

  • Golfman: Reality always wins I've used both Wicket and front-end JS frameworks and, having worked extensively on both, I can tell you that "Speed of development" is definitely NOT with the JS frameworks. You basically end up...

    Five reasons you should use Apache Wicket ·  August 29, 2021

  • Kiriller Sorry can not agree with you, wicket might be a well built technical framework. But the advantages of using a front-end framework like react.js and vue.js can not be beaten by Wicket nowadays. - Speed...

    Five reasons you should use Apache Wicket ·  August 23, 2021

  • Bernd Lauert Sorry but i have to refute your claims with the following arguments: 1. the Wicket community may be small but it is also very responsive, you usually get a helpful answer from the core devs on the...

    Five reasons you should use Apache Wicket ·  July 1, 2021

Archives

  • May 2021
  • October 2020
  • September 2020
  • August 2020
  • July 2020
  • June 2020
  • May 2020
  • April 2020
  • March 2020
  • February 2020
  • January 2020
  • December 2019
  • November 2019
  • October 2019
  • September 2019
  • August 2019
  • July 2019

Contact Me

Send Message
Prev Next