{"id":15316,"date":"2024-01-11T02:18:09","date_gmt":"2024-01-10T22:48:09","guid":{"rendered":"https:\/\/rasanegar.com\/blog\/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%be%d8%a7%db%8c%d8%aa%d9%88%d9%86-%d9%85%d8%a8%d8%aa%d8%af%db%8c-%d9%be%d9%88%d9%86%da%af\/"},"modified":"2024-01-11T02:18:09","modified_gmt":"2024-01-10T22:48:09","slug":"%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%be%d8%a7%db%8c%d8%aa%d9%88%d9%86-%d9%85%d8%a8%d8%aa%d8%af%db%8c-%d9%be%d9%88%d9%86%da%af","status":"publish","type":"post","link":"https:\/\/rasanegaar.com\/blog\/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%be%d8%a7%db%8c%d8%aa%d9%88%d9%86-%d9%85%d8%a8%d8%aa%d8%af%db%8c-%d9%be%d9%88%d9%86%da%af\/","title":{"rendered":"\u0622\u0645\u0648\u0632\u0634 \u067e\u0627\u06cc\u062a\u0648\u0646 \u0645\u0628\u062a\u062f\u06cc: \u067e\u0648\u0646\u06af"},"content":{"rendered":"<span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\">\u0632\u0645\u0627\u0646 \u0644\u0627\u0632\u0645 \u0628\u0631\u0627\u06cc \u0645\u0637\u0627\u0644\u0639\u0647: <\/span> <span class=\"rt-time\"> &lt; 1<\/span> <span class=\"rt-label rt-postfix\">\u062f\u0642\u06cc\u0642\u0647<\/span><\/span><p> <br \/>\n<\/p>\n<section class=\"post-content \" data-test-label=\"post-content\">\n<p>\u067e\u0646\u06af \u06cc\u06a9\u06cc \u0627\u0632 \u0627\u0648\u0644\u06cc\u0646 \u0628\u0627\u0632\u06cc \u0647\u0627\u06cc \u0648\u06cc\u062f\u0626\u0648\u06cc\u06cc \u0628\u0648\u062f.  \u0648 \u0647\u0645\u0686\u0646\u06cc\u0646 \u0632\u0645\u0627\u0646\u06cc \u06a9\u0647 \u062f\u0631 \u062d\u0627\u0644 \u06cc\u0627\u062f\u06af\u06cc\u0631\u06cc \u06a9\u062f\u0646\u0648\u06cc\u0633\u06cc \u0647\u0633\u062a\u06cc\u062f\u060c \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 \u067e\u0627\u06cc\u062a\u0648\u0646 \u0627\u0648\u0644 (\u06cc\u0627 \u0627\u0648\u0644\u06cc\u0647) \u062e\u0648\u0628 \u0645\u06cc \u0633\u0627\u0632\u062f.<\/p>\n<p>\u0645\u0627 \u0641\u0642\u0637 \u06cc\u06a9 \u062f\u0648\u0631\u0647 \u0631\u0627 \u0645\u0646\u062a\u0634\u0631 \u06a9\u0631\u062f\u06cc\u0645 \u0631\u0648\u06cc \u06a9\u0627\u0646\u0627\u0644 YouTube freeCodeCamp.org \u06a9\u0647 \u0628\u0647 \u0634\u0645\u0627 \u06a9\u0645\u06a9 \u0645\u06cc \u06a9\u0646\u062f \u0645\u0647\u0627\u0631\u062a \u0647\u0627\u06cc Python \u0648 Pygame \u062e\u0648\u062f \u0631\u0627 \u0628\u0627 \u0622\u0645\u0648\u0632\u0634 \u0633\u0627\u062e\u062a\u0646 \u0628\u0627\u0632\u06cc \u06a9\u0644\u0627\u0633\u06cc\u06a9 \u067e\u0646\u06af\u060c \u0627\u0645\u0627 \u0627\u06cc\u0646 \u0628\u0627\u0631 \u0628\u0627 \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u0627\u0636\u0627\u0641\u06cc\u060c \u0628\u0647\u0628\u0648\u062f \u0628\u062e\u0634\u06cc\u062f.  \u0627\u06cc\u0646 \u0622\u0645\u0648\u0632\u0634 \u0645\u0628\u062a\u062f\u06cc \u06cc\u06a9 \u0631\u0627\u0647 \u0639\u0627\u0644\u06cc \u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639 \u06cc\u0627\u062f\u06af\u06cc\u0631\u06cc \u0631\u0648\u0634 \u0627\u06cc\u062c\u0627\u062f \u0628\u0627\u0632\u06cc \u0647\u0627\u06cc \u062c\u0630\u0627\u0628 \u0628\u0627 \u0645\u06a9\u0627\u0646\u06cc\u06a9 \u0647\u0627\u06cc \u0645\u0646\u062d\u0635\u0631 \u0628\u0647 \u0641\u0631\u062f \u0627\u0633\u062a.<\/p>\n<p><!--kg-card-begin: html--><canvas><\/canvas><br \/>\n<script>\n\/\/ Global Variables\nvar DIRECTION = {\n\tIDLE: 0,\n\tUP: 1,\n\tDOWN: 2,\n\tLEFT: 3,\n\tRIGHT: 4\n};\nvar rounds = [5, 5, 3, 3, 2];\nvar colors = ['#1abc9c', '#2ecc71', '#3498db', '#e74c3c', '#9b59b6'];\n\/\/ The ball object (The cube that bounces back and forth)\nvar Ball = {\n\tnew: function (incrementedSpeed) {\n\t\treturn {\n\t\t\twidth: 18,\n\t\t\theight: 18,\n\t\t\tx: (this.canvas.width \/ 2) - 9,\n\t\t\ty: (this.canvas.height \/ 2) - 9,\n\t\t\tmoveX: DIRECTION.IDLE,\n\t\t\tmoveY: DIRECTION.IDLE,\n\t\t\tspeed: incrementedSpeed || 9\n\t\t};\n\t}\n};\n\/\/ The paddle object (The two lines that move up and down)\nvar Paddle = {\n\tnew: function (side) {\n\t\treturn {\n\t\t\twidth: 18,\n\t\t\theight: 70,\n\t\t\tx: side === 'left' ? 150 : this.canvas.width - 150,\n\t\t\ty: (this.canvas.height \/ 2) - 35,\n\t\t\tscore: 0,\n\t\t\tmove: DIRECTION.IDLE,\n\t\t\tspeed: 10\n\t\t};\n\t}\n};\nvar Game = {\n\tinitialize: function () {\n\t\tthis.canvas = document.querySelector('canvas');\n\t\tthis.context = this.canvas.getContext('2d');\n\t\tthis.canvas.width = 1400;\n\t\tthis.canvas.height = 1000;\n\t\tthis.canvas.style.width = (this.canvas.width \/ 2) + 'px';\n\t\tthis.canvas.style.height = (this.canvas.height \/ 2) + 'px';\n\t\tthis.player = Paddle.new.call(this, 'left');\n\t\tthis.paddle = Paddle.new.call(this, 'right');\n\t\tthis.ball = Ball.new.call(this);\n\t\tthis.paddle.speed = 8;\n\t\tthis.running = this.over = false;\n\t\tthis.turn = this.paddle;\n\t\tthis.timer = this.round = 0;\n\t\tthis.color=\"#2c3e50\";\n\t\tPong.menu();\n\t\tPong.listen();\n\t},\n\tendGameMenu: function (text) {\n\t\t\/\/ Change the canvas font size and color\n\t\tPong.context.font=\"50px Courier New\";\n\t\tPong.context.fillStyle = this.color;\n\t\t\/\/ Draw the rectangle behind the 'Press any key to begin' text.\n\t\tPong.context.fillRect(\n\t\t\tPong.canvas.width \/ 2 - 350,\n\t\t\tPong.canvas.height \/ 2 - 48,\n\t\t\t700,\n\t\t\t100\n\t\t);\n\t\t\/\/ Change the canvas color;\n\t\tPong.context.fillStyle=\"#ffffff\";\n\t\t\/\/ Draw the end game menu text ('Game Over' and 'Winner')\n\t\tPong.context.fillText(text,\n\t\t\tPong.canvas.width \/ 2,\n\t\t\tPong.canvas.height \/ 2 + 15\n\t\t);\n\t\tsetTimeout(function () {\n\t\t\tPong = Object.assign({}, Game);\n\t\t\tPong.initialize();\n\t\t}, 3000);\n\t},\n\tmenu: function () {\n\t\t\/\/ Draw all the Pong objects in their current state\n\t\tPong.draw();\n\t\t\/\/ Change the canvas font size and color\n\t\tthis.context.font=\"50px Courier New\";\n\t\tthis.context.fillStyle = this.color;\n\t\t\/\/ Draw the rectangle behind the 'Press any key to begin' text.\n\t\tthis.context.fillRect(\n\t\t\tthis.canvas.width \/ 2 - 350,\n\t\t\tthis.canvas.height \/ 2 - 48,\n\t\t\t700,\n\t\t\t100\n\t\t);\n\t\t\/\/ Change the canvas color;\n\t\tthis.context.fillStyle=\"#ffffff\";\n\t\t\/\/ Draw the 'press any key to begin' text\n\t\tthis.context.fillText('Press any key to begin',\n\t\t\tthis.canvas.width \/ 2,\n\t\t\tthis.canvas.height \/ 2 + 15\n\t\t);\n\t},\n\t\/\/ Update all objects (move the player, paddle, ball, increment the score, etc.)\n\tupdate: function () {\n\t\tif (!this.over) {\n\t\t\t\/\/ If the ball collides with the bound limits - correct the x and y coords.\n\t\t\tif (this.ball.x <= 0) Pong._resetTurn.call(this, this.paddle, this.player);\n\t\t\tif (this.ball.x >= this.canvas.width - this.ball.width) Pong._resetTurn.call(this, this.player, this.paddle);\n\t\t\tif (this.ball.y <= 0) this.ball.moveY = DIRECTION.DOWN;\n\t\t\tif (this.ball.y >= this.canvas.height - this.ball.height) this.ball.moveY = DIRECTION.UP;\n\t\t\t\/\/ Move player if they player.move value was updated by a keyboard event\n\t\t\tif (this.player.move === DIRECTION.UP) this.player.y -= this.player.speed;\n\t\t\telse if (this.player.move === DIRECTION.DOWN) this.player.y += this.player.speed;\n\t\t\t\/\/ \u0631\u0648\u06cc new serve (start of each turn) move the ball to the correct side\n\t\t\t\/\/ and randomize the direction to add some challenge.\n\t\t\tif (Pong._turnDelayIsOver.call(this) && this.turn) {\n\t\t\t\tthis.ball.moveX = this.turn === this.player ? DIRECTION.LEFT : DIRECTION.RIGHT;\n\t\t\t\tthis.ball.moveY = [DIRECTION.UP, DIRECTION.DOWN][Math.round(Math.random())];\n\t\t\t\tthis.ball.y = Math.floor(Math.random() * this.canvas.height - 200) + 200;\n\t\t\t\tthis.turn = null;\n\t\t\t}\n\t\t\t\/\/ If the player collides with the bound limits, update the x and y coords.\n\t\t\tif (this.player.y <= 0) this.player.y = 0;\n\t\t\telse if (this.player.y >= (this.canvas.height - this.player.height)) this.player.y = (this.canvas.height - this.player.height);\n\t\t\t\/\/ Move ball in intended direction based \u0631\u0648\u06cc moveY and moveX values\n\t\t\tif (this.ball.moveY === DIRECTION.UP) this.ball.y -= (this.ball.speed \/ 1.5);\n\t\t\telse if (this.ball.moveY === DIRECTION.DOWN) this.ball.y += (this.ball.speed \/ 1.5);\n\t\t\tif (this.ball.moveX === DIRECTION.LEFT) this.ball.x -= this.ball.speed;\n\t\t\telse if (this.ball.moveX === DIRECTION.RIGHT) this.ball.x += this.ball.speed;\n\t\t\t\/\/ Handle paddle (AI) UP and DOWN movement\n\t\t\tif (this.paddle.y > this.ball.y - (this.paddle.height \/ 2)) {\n\t\t\t\tif (this.ball.moveX === DIRECTION.RIGHT) this.paddle.y -= this.paddle.speed \/ 1.5;\n\t\t\t\telse this.paddle.y -= this.paddle.speed \/ 4;\n\t\t\t}\n\t\t\tif (this.paddle.y < this.ball.y - (this.paddle.height \/ 2)) {\n\t\t\t\tif (this.ball.moveX === DIRECTION.RIGHT) this.paddle.y += this.paddle.speed \/ 1.5;\n\t\t\t\telse this.paddle.y += this.paddle.speed \/ 4;\n\t\t\t}\n\n\t\t\t\/\/ Handle paddle (AI) wall collision\n\t\t\tif (this.paddle.y >= this.canvas.height - this.paddle.height) this.paddle.y = this.canvas.height - this.paddle.height;\n\t\t\telse if (this.paddle.y <= 0) this.paddle.y = 0;\n\n\t\t\t\/\/ Handle Player-Ball collisions\n\t\t\tif (this.ball.x - this.ball.width <= this.player.x &#038;&#038; this.ball.x >= this.player.x - this.player.width) {\n\t\t\t\tif (this.ball.y <= this.player.y + this.player.height &#038;&#038; this.ball.y + this.ball.height >= this.player.y) {\n\t\t\t\t\tthis.ball.x = (this.player.x + this.ball.width);\n\t\t\t\t\tthis.ball.moveX = DIRECTION.RIGHT;\n\t\t\t\t}\n\t\t\t}\n\t\t\t\/\/ Handle paddle-ball collision\n\t\t\tif (this.ball.x - this.ball.width <= this.paddle.x &#038;&#038; this.ball.x >= this.paddle.x - this.paddle.width) {\n\t\t\t\tif (this.ball.y <= this.paddle.y + this.paddle.height &#038;&#038; this.ball.y + this.ball.height >= this.paddle.y) {\n\t\t\t\t\tthis.ball.x = (this.paddle.x - this.ball.width);\n\t\t\t\t\tthis.ball.moveX = DIRECTION.LEFT;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t\/\/ Handle the end of round transition\n\t\t\/\/ Check to see if the player won the round.\n\t\tif (this.player.score === rounds[this.round]) {\n\t\t\t\/\/ Check to see if there are any more rounds\/levels left and display the victory screen if\n\t\t\t\/\/ there are not.\n\t\t\tif (!rounds[this.round + 1]) {\n\t\t\t\tthis.over = true;\n\t\t\t\tsetTimeout(function () { Pong.endGameMenu('Winner!'); }, 1000);\n\t\t\t} else {\n\t\t\t\t\/\/ If there is another round, reset all the values and increment the round number.\n\t\t\t\tthis.color = this._generateRoundColor();\n\t\t\t\tthis.player.score = this.paddle.score = 0;\n\t\t\t\tthis.player.speed += 0.5;\n\t\t\t\tthis.paddle.speed += 1;\n\t\t\t\tthis.ball.speed += 1;\n\t\t\t\tthis.round += 1;\n\t\t\t}\n\t\t}\n\t\t\/\/ Check to see if the paddle\/AI has won the round.\n\t\telse if (this.paddle.score === rounds[this.round]) {\n\t\t\tthis.over = true;\n\t\t\tsetTimeout(function () { Pong.endGameMenu('Game Over!'); }, 1000);\n\t\t}\n\t},\n\t\/\/ Draw the objects to the canvas element\n\tdraw: function () {\n\t\t\/\/ Clear the Canvas\n\t\tthis.context.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\tthis.canvas.width,\n\t\t\tthis.canvas.height\n\t\t);\n\t\t\/\/ Set the fill style to black\n\t\tthis.context.fillStyle = this.color;\n\t\t\/\/ Draw the background\n\t\tthis.context.fillRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\tthis.canvas.width,\n\t\t\tthis.canvas.height\n\t\t);\n\t\t\/\/ Set the fill style to white (For the paddles and the ball)\n\t\tthis.context.fillStyle=\"#ffffff\";\n\t\t\/\/ Draw the Player\n\t\tthis.context.fillRect(\n\t\t\tthis.player.x,\n\t\t\tthis.player.y,\n\t\t\tthis.player.width,\n\t\t\tthis.player.height\n\t\t);\n\t\t\/\/ Draw the Paddle\n\t\tthis.context.fillRect(\n\t\t\tthis.paddle.x,\n\t\t\tthis.paddle.y,\n\t\t\tthis.paddle.width,\n\t\t\tthis.paddle.height\n\t\t);\n\t\t\/\/ Draw the Ball\n\t\tif (Pong._turnDelayIsOver.call(this)) {\n\t\t\tthis.context.fillRect(\n\t\t\t\tthis.ball.x,\n\t\t\t\tthis.ball.y,\n\t\t\t\tthis.ball.width,\n\t\t\t\tthis.ball.height\n\t\t\t);\n\t\t}\n\t\t\/\/ Draw the net (Line in the middle)\n\t\tthis.context.beginPath();\n\t\tthis.context.setLineDash([7, 15]);\n\t\tthis.context.moveTo((this.canvas.width \/ 2), this.canvas.height - 140);\n\t\tthis.context.lineTo((this.canvas.width \/ 2), 140);\n\t\tthis.context.lineWidth = 10;\n\t\tthis.context.strokeStyle=\"#ffffff\";\n\t\tthis.context.stroke();\n\t\t\/\/ Set the default canvas font and align it to the center\n\t\tthis.context.font=\"100px Courier New\";\n\t\tthis.context.textAlign = 'center';\n\t\t\/\/ Draw the players score (left)\n\t\tthis.context.fillText(\n\t\t\tthis.player.score.toString(),\n\t\t\t(this.canvas.width \/ 2) - 300,\n\t\t\t200\n\t\t);\n\t\t\/\/ Draw the paddles score (right)\n\t\tthis.context.fillText(\n\t\t\tthis.paddle.score.toString(),\n\t\t\t(this.canvas.width \/ 2) + 300,\n\t\t\t200\n\t\t);\n\t\t\/\/ Change the font size for the center score text\n\t\tthis.context.font=\"30px Courier New\";\n\t\t\/\/ Draw the winning score (center)\n\t\tthis.context.fillText(\n\t\t\t'Round ' + (Pong.round + 1),\n\t\t\t(this.canvas.width \/ 2),\n\t\t\t35\n\t\t);\n\t\t\/\/ Change the font size for the center score value\n\t\tthis.context.font=\"40px Courier\";\n\t\t\/\/ Draw the current round number\n\t\tthis.context.fillText(\n\t\t\trounds[Pong.round] ? rounds[Pong.round] : rounds[Pong.round - 1],\n\t\t\t(this.canvas.width \/ 2),\n\t\t\t100\n\t\t);\n\t},\n\tloop: function () {\n\t\tPong.update();\n\t\tPong.draw();\n\t\t\/\/ If the game is not over, draw the next frame.\n\t\tif (!Pong.over) requestAnimationFrame(Pong.loop);\n\t},\n\tlisten: function () {\n\t\tdocument.addEventListener('keydown', function (key) {\n\t\t\t\/\/ Handle the 'Press any key to begin' function and start the game.\n\t\t\tif (Pong.running === false) {\n\t\t\t\tPong.running = true;\n\t\t\t\twindow.requestAnimationFrame(Pong.loop);\n\t\t\t}\n\t\t\t\/\/ Handle up arrow and w key events\n\t\t\tif (key.keyCode === 38 || key.keyCode === 87) Pong.player.move = DIRECTION.UP;\n\t\t\t\/\/ Handle down arrow and s key events\n\t\t\tif (key.keyCode === 40 || key.keyCode === 83) Pong.player.move = DIRECTION.DOWN;\n\t\t});\n\t\t\/\/ Stop the player from moving when there are no keys being pressed.\n\t\tdocument.addEventListener('keyup', function (key) { Pong.player.move = DIRECTION.IDLE; });\n\t},\n\t\/\/ Reset the ball location, the player turns and set a delay before the next round begins.\n\t_resetTurn: function(victor, loser) {\n\t\tthis.ball = Ball.new.call(this, this.ball.speed);\n\t\tthis.turn = loser;\n\t\tthis.timer = (new Date()).getTime();\n\t\tvictor.score++;\n\t},\n\t\/\/ Wait for a delay to have passed after each turn.\n\t_turnDelayIsOver: function() {\n\t\treturn ((new Date()).getTime() - this.timer >= 1000);\n\t},\n\t\/\/ Select a random color as the background of each level\/round.\n\t_generateRoundColor: function () {\n\t\tvar newColor = colors[Math.floor(Math.random() * colors.length)];\n\t\tif (newColor === this.color) return Pong._generateRoundColor();\n\t\treturn newColor;\n\t}\n};\nvar Pong = Object.assign({}, Game);\nPong.initialize();\n                <\/script><!--kg-card-end: html--><\/p>\n<p><em>(\u06a9\u0644\u06cc\u062f\u0647\u0627\u06cc \u067e\u06cc\u06a9\u0627\u0646 \u0631\u0627 \u0628\u0631\u0627\u06cc \u067e\u062e\u0634 \u0641\u0634\u0627\u0631 \u062f\u0647\u06cc\u062f. \u0627\u06cc\u0646 \u0646\u0633\u062e\u0647 \u0627\u06cc \u0646\u06cc\u0633\u062a \u06a9\u0647 \u0634\u0645\u0627 \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc \u06a9\u0646\u06cc\u062f.)<\/em><\/p>\n<p>\u0631\u0648\u0647\u0627\u0646 \u0627\u06cc\u0646 \u062f\u0648\u0631\u0647 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f \u0648 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 \u0639\u0627\u0644\u06cc \u0628\u0631\u0627\u06cc \u0645\u0628\u062a\u062f\u06cc\u0627\u0646 \u0627\u0633\u062a.  \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0628\u062e\u0634 \u0647\u0627\u06cc \u0627\u06cc\u0646 \u062f\u0648\u0631\u0647 \u0622\u0645\u062f\u0647 \u0627\u0633\u062a:<\/p>\n<ul>\n<li>\u062f\u0633\u062a\u0648\u0631 \u06a9\u0627\u0631 \u062f\u0648\u0631\u0647<\/li>\n<li>\u067e\u0646\u06af \u0633\u0646\u062a\u06cc<\/li>\n<li>\u0632\u0648\u0627\u06cc\u0627\u06cc \u062e\u0644\u0627\u0642\u0627\u0646\u0647<\/li>\n<li>\u0639\u0646\u0635\u0631 Smash<\/li>\n<li>\u0639\u0646\u0635\u0631 \u0641\u0644\u0634<\/li>\n<li>\u0634\u0628\u06cc\u0647 \u0633\u0627\u0632\u06cc \u062a\u0648\u067e<\/li>\n<li>\u0634\u0628\u06cc\u0647 \u0633\u0627\u0632\u06cc \u067e\u0627\u0631\u0648\u06cc\u06cc<\/li>\n<li>\u0639\u0646\u0635\u0631 \u0635\u0641\u062d\u0647 \u067e\u0627\u06cc\u0627\u0646\u06cc<\/li>\n<\/ul>\n<p>\u062f\u0648\u0631\u0647 \u06a9\u0627\u0645\u0644 \u0631\u0627 \u062a\u0645\u0627\u0634\u0627 \u06a9\u0646\u06cc\u062f \u0631\u0648\u06cc \u06a9\u0627\u0646\u0627\u0644 YouTube freeCodeCamp.org (\u062a\u0645\u0627\u0634\u0627 \u06cc\u06a9 \u0633\u0627\u0639\u062a\u0647).<\/p>\n<figure class=\"kg-card kg-embed-card\" data-test-label=\"fitted\">\n<div class=\"fluid-width-video-container\">\n<div style=\"padding-top: 56.17977528089888%;\" class=\"fluid-width-video-wrapper\">\n            <a href=\"https:\/\/www.youtube.com\/watch\u061fv=tS8F7_X2qB0\" target=\"_blank\" rel=\"noopener\">https:\/\/www.youtube.com\/watch\u061fv=tS8F7_X2qB0<\/a>\n          <\/div><\/div>\n<\/figure>\n<\/section>\n<p><br \/>\n<br \/>\u0645\u0646\u062a\u0634\u0631 \u0634\u062f\u0647 \u062f\u0631 1403-01-11 02:18:05<br \/>\n<\/p>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-center kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;center&quot;,&quot;id&quot;:&quot;15316&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;0&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;0&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;5&quot;,&quot;greet&quot;:&quot;\u0627\u0645\u062a\u06cc\u0627\u0632 \u0634\u0645\u0627 \u0628\u0647 \u0627\u06cc\u0646 \u0645\u0637\u0644\u0628&quot;,&quot;legend&quot;:&quot;0\\\/5 (0 \u0631\u0627\u06cc)&quot;,&quot;size&quot;:&quot;30&quot;,&quot;title&quot;:&quot;\u0622\u0645\u0648\u0632\u0634 \u067e\u0627\u06cc\u062a\u0648\u0646 \u0645\u0628\u062a\u062f\u06cc: \u067e\u0648\u0646\u06af&quot;,&quot;width&quot;:&quot;0&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} ({count} \u0631\u0627\u06cc)&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 0px;\">\n            <div class=\"kksr-star\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-left: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 30px; height: 30px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 24px;\">\n            <span class=\"kksr-muted\">\u0627\u0645\u062a\u06cc\u0627\u0632 \u0634\u0645\u0627 \u0628\u0647 \u0627\u06cc\u0646 \u0645\u0637\u0644\u0628<\/span>\n    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p><span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\">\u0632\u0645\u0627\u0646 \u0644\u0627\u0632\u0645 \u0628\u0631\u0627\u06cc \u0645\u0637\u0627\u0644\u0639\u0647: <\/span> <span class=\"rt-time\"> &lt; 1<\/span> <span class=\"rt-label rt-postfix\">\u062f\u0642\u06cc\u0642\u0647<\/span><\/span>\u067e\u0646\u06af \u06cc\u06a9\u06cc \u0627\u0632 \u0627\u0648\u0644\u06cc\u0646 \u0628\u0627\u0632\u06cc \u0647\u0627\u06cc \u0648\u06cc\u062f\u0626\u0648\u06cc\u06cc \u0628\u0648\u062f. \u0648 \u0647\u0645\u0686\u0646\u06cc\u0646 \u0632\u0645\u0627\u0646\u06cc \u06a9\u0647 \u062f\u0631 \u062d\u0627\u0644 \u06cc\u0627\u062f\u06af\u06cc\u0631\u06cc \u06a9\u062f\u0646\u0648\u06cc\u0633\u06cc \u0647\u0633\u062a\u06cc\u062f\u060c \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 \u067e\u0627\u06cc\u062a\u0648\u0646 \u0627\u0648\u0644 (\u06cc\u0627 \u0627\u0648\u0644\u06cc\u0647) \u062e\u0648\u0628 \u0645\u06cc \u0633\u0627\u0632\u062f. \u0645\u0627 \u0641\u0642\u0637 \u06cc\u06a9 \u062f\u0648\u0631\u0647 \u0631\u0627 \u0645\u0646\u062a\u0634\u0631 \u06a9\u0631\u062f\u06cc\u0645 \u0631\u0648\u06cc \u06a9\u0627\u0646\u0627\u0644 YouTube freeCodeCamp.org \u06a9\u0647 \u0628\u0647 \u0634\u0645\u0627 \u06a9\u0645\u06a9 \u0645\u06cc \u06a9\u0646\u062f \u0645\u0647\u0627\u0631\u062a \u0647\u0627\u06cc Python \u0648 Pygame \u062e\u0648\u062f \u0631\u0627 \u0628\u0627 \u0622\u0645\u0648\u0632\u0634 \u0633\u0627\u062e\u062a\u0646 \u0628\u0627\u0632\u06cc \u06a9\u0644\u0627\u0633\u06cc\u06a9 [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":15318,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1743,1686],"tags":[1748,1928,1313,1938,1916,1744,3854,1755,3853,1745],"class_list":["post-15316","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-python","category-ai","tag-python-hosting","tag-python-","tag-1313","tag-1938","tag-1916","tag-1744","tag-3854","tag-1755","tag-3853","tag-1745"],"acf":[],"_links":{"self":[{"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/posts\/15316","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/comments?post=15316"}],"version-history":[{"count":0,"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/posts\/15316\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/media\/15318"}],"wp:attachment":[{"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/media?parent=15316"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/categories?post=15316"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rasanegaar.com\/blog\/wp-json\/wp\/v2\/tags?post=15316"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}