In this video, Harkirat takes you through how to build Plinko, a famous game on stake
Link – https://plinkoo.100xdevs.com/game
Simulation link – https://plinkoo.100xdevs.com/simulation
Code – https://github.com/code100x/plinkoo
00:01 Building a gambling website and game analysis
01:48 In the long run, you will not win gambling on a website.
05:28 Understanding the probabilities of winning and losing in a gambling cycle
07:17 Client side games are hackable due to running code on the browser.
10:56 Server should always run logic to prevent hacking
12:40 Server should never trust the client
16:28 Deterministic path calculation for ball landing in gambling website simulation
18:13 Building a game backend to control ball multiplier
21:31 Gambling website operates with stacked odds, no need for shady practices.
23:11 Understanding the importance of using canvas in game development
26:34 Consider clock time and precision errors for game determinism.
28:21 Implement frame-based rendering for deterministic behavior
31:42 Introducing friction to control ball movement
33:09 Importance of determinism in game development
36:32 Introduction to HTML setup and JavaScript functions for rendering on canvas
38:29 Adjusting gravity and friction for realistic movement.
42:00 Creating and positioning obstacles for rendering
43:52 Calculating positioning for obstacles based on row and spacing.
47:57 Setting up obstacles and sinks position logic
49:48 Calculation for positioning obstacles in the gambling website
53:23 Explanation of the draw function in rendering circles on Canvas.
55:04 Understanding the update function and game loop in game development
58:40 Updating position in the horizontal direction based on velocity and obstacles
1:00:25 Calculating collision distance using math.hypot function
1:04:46 Calculating speed and velocity after collision
1:06:26 Detect and handle collisions in game development
1:09:37 Discussing the correct physics for ball movement in a game
1:11:16 The game loop orchestrates the ball class.
1:14:50 Implementing continuous rendering with request Animation Frame
1:16:34 Using request Animation Frame for smooth rendering
1:19:56 Convert raw JavaScript HTML into a React application
1:21:33 Setting up simulation component for creating a gambling website
1:25:33 Testing code outcomes for correctness
1:27:07 Testing the functionality of dropping a ball on the website.
1:30:51 The on finish function is crucial for communicating when a collision happens.
1:32:45 The ‘drop’ function in the gambling website initializes a new ball and triggers the on finish callback.
1:36:15 Building the backend for storing outcomes and multipliers
1:37:47 Implementing random number generation for direction movement
1:41:03 Integrating back end for ball drop functionality
1:42:45 Building a challenging mini-game on Stake platform
Links:
Open Source Cohort: https://100xdevs.com
Twitter:https://twitter.com/kirat_tw
Linkedin:https://linkedin.com/in/kirat-li
Instagram:https://www.instagram.com/kirat_ins/
Discord:https://discord.com/invite/WAaXacK9bh
Telegram: https://t.me/kirat_internal_group
WhatsApp: https://whatsapp.com/channel/0029Va98SYeHrDZhfxCT6s0a
