Skip to main content

Transfermarkt

The transfermarkt example shows a list of soccer players of the top leagues in the world and let you find information about them and their valuation. The data is initially loaded from kaggle and slightly adapted for this example. The attributes in the data include basic information about the players like their name, their age and height, if the are left or right footed - or both - and also their valuations at a certain point in time ... and their current club (Snapshot taken mid of 2022)

The goal of this project is to demonstrate how to use the dcupl SDK and modelling language and the dcupl Console to build fast and reliable applications in no time.

Sources​

Demo App​

dcupl init Data Explorer

Technical Setup​

  • Framework: Angular 14
  • Additional dependencies: Tailwind CSS
  • Hosting: Firebase

Run it on your local machine​

# 1) clone the project
git clone git@github.com:dcupl-demos/ng-transfermarkt.git

# 2) install and serve the angular project on localhost:4200
cd ng-transfermarkt
npm i
ng serve

# second terminal window
# 3) install and serve the dcupl dev server on localhost:8083
cd dcupl-transfermarkt
npm i
dcupl serve

Data setup​

model sizeproperties
players~25kname, country_of_birth, position, foot, height_in_cm, ... 
player_valuations~360kplayer_id, date, market_value
clubs~400name, competition_id, stadium_seats, ...

Initial data structure​

Our main model of interest is the Players model. The players data includes the reference club_id - the Club he is playing for. The Valuations data references certain players.

classDiagram direction LR class Players { key : string club_id : Club } class Clubs{ key : string name : string stadium_seats : int } class Valuations{ key : string player_id : Player --> } Players --> Clubs : a player references a club Valuations --> Players : a valuation references a player

Data Explorer​

dcupl init Data Explorer