{"id":97903,"date":"2025-02-17T17:32:42","date_gmt":"2025-02-17T14:02:42","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/"},"modified":"2025-02-17T17:32:42","modified_gmt":"2025-02-17T14:02:42","slug":"%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/","title":{"rendered":"\u06a9\u062a\u0627\u0628 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 \u0645\u06cc\u0646\u06cc"},"content":{"rendered":"<div data-article-id=\"2283918\" id=\"article-body\">\n<p>\u0627\u06cc\u0646 \u06a9\u062a\u0627\u0628\u0686\u0647 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0645\u06cc\u0646\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 \u0631\u0627 \u062a\u0634\u0631\u06cc\u062d \u0645\u06cc \u06a9\u0646\u062f. \u0627\u06cc\u0646 \u0628\u0631 \u062f\u0642\u062a \u062a\u0623\u06a9\u06cc\u062f \u0645\u06cc \u06a9\u0646\u062f \u060c \u062a\u0648\u0636\u06cc\u062d\u0627\u062a \u0645\u0641\u0635\u0644\u06cc \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u062f\u0647\u062f \u060c \u0648 \u0634\u0627\u0645\u0644 \u0628\u0631\u0686\u0633\u0628 \u0632\u062f\u0646 \u0627\u062e\u062a\u06cc\u0627\u0631\u06cc\/\u0645\u0648\u0631\u062f \u0646\u06cc\u0627\u0632 \u0628\u0631\u0627\u06cc \u0648\u0636\u0648\u062d \u0627\u0633\u062a.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_84 counter-hierarchy ez-toc-counter-rtl ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">\u0641\u0647\u0631\u0633\u062a \u0645\u0637\u0627\u0644\u0628<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#1_%D8%AF%D8%B1%DA%A9_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D9%87%D8%A7%DB%8C_%D9%85%DB%8C%D9%86%DB%8C_%D8%AA%D9%84%DA%AF%D8%B1%D8%A7%D9%85\" >1. \u062f\u0631\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0645\u06cc\u0646\u06cc \u062a\u0644\u06af\u0631\u0627\u0645<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#2_%D9%BE%DB%8C%D8%B4_%D9%86%DB%8C%D8%A7%D8%B2%D9%87%D8%A7\" >2. \u067e\u06cc\u0634 \u0646\u06cc\u0627\u0632\u0647\u0627<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#3_%D8%AA%D9%86%D8%B8%DB%8C%D9%85_%D9%85%D8%AD%DB%8C%D8%B7_%D8%AA%D9%88%D8%B3%D8%B9%D9%87_%D8%AE%D9%88%D8%AF\" >3. \u062a\u0646\u0638\u06cc\u0645 \u0645\u062d\u06cc\u0637 \u062a\u0648\u0633\u0639\u0647 \u062e\u0648\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#4_%D8%A7%D9%88%D9%84%DB%8C%D9%87_%D8%B3%D8%A7%D8%B2%DB%8C_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D9%88%D8%A8_%D8%AA%D9%84%DA%AF%D8%B1%D8%A7%D9%85_SDK\" >4. \u0627\u0648\u0644\u06cc\u0647 \u0633\u0627\u0632\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u0648\u0628 \u062a\u0644\u06af\u0631\u0627\u0645 SDK<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#5_%D8%A7%D8%AC%D8%B1%D8%A7%DB%8C_%D9%88%DB%8C%DA%98%DA%AF%DB%8C_%D9%87%D8%A7%DB%8C_%D8%A7%D8%B3%D8%A7%D8%B3%DB%8C\" >5. \u0627\u062c\u0631\u0627\u06cc \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u0627\u0633\u0627\u0633\u06cc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#6_%D8%B1%D8%B3%DB%8C%D8%AF%DA%AF%DB%8C_%D8%A8%D9%87_%D8%B1%D9%88%DB%8C%D8%AF%D8%A7%D8%AF%D9%87%D8%A7\" >6. \u0631\u0633\u06cc\u062f\u06af\u06cc \u0628\u0647 \u0631\u0648\u06cc\u062f\u0627\u062f\u0647\u0627<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#7_%D8%A7%D8%B1%D8%B3%D8%A7%D9%84_%D8%AF%D8%A7%D8%AF%D9%87_%D9%87%D8%A7_%D8%A8%D9%87_%D8%B1%D8%A8%D8%A7%D8%AA\" >7. \u0627\u0631\u0633\u0627\u0644 \u062f\u0627\u062f\u0647 \u0647\u0627 \u0628\u0647 \u0631\u0628\u0627\u062a<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#8_%D9%85%D9%84%D8%A7%D8%AD%D8%B8%D8%A7%D8%AA_%D8%A7%D9%85%D9%86%DB%8C%D8%AA%DB%8C\" >8. \u0645\u0644\u0627\u062d\u0638\u0627\u062a \u0627\u0645\u0646\u06cc\u062a\u06cc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#9_%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D9%85%DB%8C%D9%86%DB%8C_%D8%AE%D9%88%D8%AF\" >9. \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0646\u06cc \u062e\u0648\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#%D8%A2%D8%B2%D9%85%D8%A7%DB%8C%D8%B4_%D9%88_%D8%A7%D8%B4%DA%A9%D8%A7%D9%84_%D8%B2%D8%AF%D8%A7%DB%8C%DB%8C\" >\u0622\u0632\u0645\u0627\u06cc\u0634 \u0648 \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#11_%D8%A7%D8%B3%D8%AA%D9%82%D8%B1%D8%A7%D8%B1\" >11. \u0627\u0633\u062a\u0642\u0631\u0627\u0631<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#12_%D9%88%DB%8C%DA%98%DA%AF%DB%8C_%D9%87%D8%A7_%D9%88_%D9%85%D9%84%D8%A7%D8%AD%D8%B8%D8%A7%D8%AA_%D9%BE%DB%8C%D8%B4%D8%B1%D9%81%D8%AA%D9%87\" >12. \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627 \u0648 \u0645\u0644\u0627\u062d\u0638\u0627\u062a \u067e\u06cc\u0634\u0631\u0641\u062a\u0647<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/nabfollower.com\/blog\/%da%a9%d8%aa%d8%a7%d8%a8-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7%db%8c-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-%d9%87%d8%a7%db%8c-%d8%aa%d9%84%da%af%d8%b1%d8%a7%d9%85-%d9%85\/#%D9%85%D9%86%D8%A7%D8%A8%D8%B9\" >\u0645\u0646\u0627\u0628\u0639<\/a><\/li><\/ul><\/nav><\/div>\n<h3><span class=\"ez-toc-section\" id=\"1_%D8%AF%D8%B1%DA%A9_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D9%87%D8%A7%DB%8C_%D9%85%DB%8C%D9%86%DB%8C_%D8%AA%D9%84%DA%AF%D8%B1%D8%A7%D9%85\"><\/span>\n<p>  1. \u062f\u0631\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0645\u06cc\u0646\u06cc \u062a\u0644\u06af\u0631\u0627\u0645<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u062a\u0639\u0631\u06cc\u0641:<\/strong> \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc Telegram Mini \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0648\u0628 \u0647\u0633\u062a\u0646\u062f \u06a9\u0647 \u0645\u0633\u062a\u0642\u06cc\u0645\u0627\u064b \u062f\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 Telegram \u0627\u062c\u0631\u0627 \u0645\u06cc \u0634\u0648\u0646\u062f. \u0622\u0646\u0647\u0627 \u0628\u062f\u0648\u0646 \u0646\u06cc\u0627\u0632 \u0628\u0647 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0628\u0631\u0627\u06cc \u062a\u0631\u06a9 \u0645\u062d\u06cc\u0637 \u062a\u0644\u06af\u0631\u0627\u0645 \u060c \u062a\u062c\u0631\u0628\u0647 \u06a9\u0627\u0631\u0628\u0631\u06cc \u06cc\u06a9\u067e\u0627\u0631\u0686\u0647 \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u062f\u0647\u0646\u062f.<\/li>\n<li>  <strong>\u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u06a9\u0644\u06cc\u062f\u06cc:<\/strong>\n<ul>\n<li>  <strong>\u0627\u062f\u063a\u0627\u0645 \u0628\u0648\u0645\u06cc:<\/strong> \u0627\u062f\u063a\u0627\u0645 \u0639\u0645\u06cc\u0642 \u0628\u0627 \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 \u0645\u0627\u0646\u0646\u062f \u067e\u0631\u062f\u0627\u062e\u062a \u060c \u0645\u062e\u0627\u0637\u0628\u06cc\u0646 \u0648 \u0645\u06a9\u0627\u0646.<\/li>\n<li>  <strong>\u06a9\u0631\u0627\u0633 \u067e\u0644\u062a\u0641\u0631\u0645:<\/strong> \u062f\u0631 \u062a\u0645\u0627\u0645 \u0633\u06cc\u0633\u062a\u0645 \u0639\u0627\u0645\u0644 \u0647\u0627\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 (iOS \u060c Android \u060c Desktop) \u06a9\u0627\u0631 \u0645\u06cc \u06a9\u0646\u062f.<\/li>\n<li>  <strong>\u0627\u06cc\u0645\u0646:<\/strong> \u0627\u0632 \u0632\u06cc\u0631\u0633\u0627\u062e\u062a \u0647\u0627\u06cc \u0627\u0645\u0646 \u062a\u0644\u06af\u0631\u0627\u0645 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u062f.<\/li>\n<li>  <strong>\u0642\u0627\u0628\u0644 \u06a9\u0634\u0641:<\/strong> \u0645\u06cc \u062a\u0648\u0627\u0646 \u0627\u0632 \u0686\u062a \u0647\u0627 \u060c \u0631\u0628\u0627\u062a\u0647\u0627 \u06cc\u0627 \u0645\u0633\u062a\u0642\u06cc\u0645\u0627\u064b \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0634\u062f.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"2_%D9%BE%DB%8C%D8%B4_%D9%86%DB%8C%D8%A7%D8%B2%D9%87%D8%A7\"><\/span>\n<p>  2. \u067e\u06cc\u0634 \u0646\u06cc\u0627\u0632\u0647\u0627<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u0627\u0628\u0632\u0627\u0631:<\/strong> \u06cc\u06a9 \u0645\u062d\u06cc\u0637 \u062a\u0648\u0633\u0639\u0647 \u0648\u0628 (\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644 \u060c \u062f\u0631 \u0645\u0642\u0627\u0628\u0644 \u06a9\u062f \u060c \u0645\u062a\u0646 \u0639\u0627\u0644\u06cc).<\/li>\n<li>  <strong>\u0645\u0647\u0627\u0631\u062a \u0647\u0627:<\/strong>\n<ul>\n<li>  <strong>HTML \u060c CSS \u060c JavaScript\/TypeScript:<\/strong> \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u0648 \u0645\u0646\u0637\u0642 \u0636\u0631\u0648\u0631\u06cc \u0627\u0633\u062a.<\/li>\n<li>  <strong>\u062a\u0648\u0633\u0639\u0647 \u0628\u0627\u0637\u0646 (\u0627\u062e\u062a\u06cc\u0627\u0631\u06cc):<\/strong> \u0627\u06af\u0631 \u0645\u06cc\u0646\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u0634\u0645\u0627 \u0628\u0647 \u0645\u0646\u0637\u0642 \u0633\u0645\u062a \u0633\u0631\u0648\u0631 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u062f \u060c \u0628\u0647 \u06cc\u06a9 \u0632\u0628\u0627\u0646 \u0628\u0627\u0637\u0646 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u06cc\u062f (\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644 \u060c node.js \u060c \u067e\u0627\u06cc\u062a\u0648\u0646 \u060c \u0628\u0631\u0648).<\/li>\n<\/ul>\n<\/li>\n<li>  <strong>\u0631\u0628\u0627\u062a \u062a\u0644\u06af\u0631\u0627\u0645:<\/strong> \u06cc\u06a9 \u0631\u0628\u0627\u062a \u062a\u0644\u06af\u0631\u0627\u0645 \u0628\u0631\u0627\u06cc \u0645\u06cc\u0632\u0628\u0627\u0646\u06cc \u0648 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0646\u06cc \u062e\u0648\u062f \u0644\u0627\u0632\u0645 \u0627\u0633\u062a. \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u06cc\u06a9\u06cc \u0631\u0627 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Botfather \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f (\u0628\u0647 \u06a9\u062a\u0627\u0628\u0686\u0647 \u0642\u0628\u0644\u06cc \u0645\u0631\u0627\u062c\u0639\u0647 \u06a9\u0646\u06cc\u062f).<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"3_%D8%AA%D9%86%D8%B8%DB%8C%D9%85_%D9%85%D8%AD%DB%8C%D8%B7_%D8%AA%D9%88%D8%B3%D8%B9%D9%87_%D8%AE%D9%88%D8%AF\"><\/span>\n<p>  3. \u062a\u0646\u0638\u06cc\u0645 \u0645\u062d\u06cc\u0637 \u062a\u0648\u0633\u0639\u0647 \u062e\u0648\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ol>\n<li>\n<p><strong>\u06cc\u06a9 \u0686\u0627\u0631\u0686\u0648\u0628 \u0631\u0627 \u0627\u0646\u062a\u062e\u0627\u0628 \u06a9\u0646\u06cc\u062f (\u062a\u0648\u0635\u06cc\u0647 \u0645\u06cc \u0634\u0648\u062f):<\/strong> \u062f\u0631 \u062d\u0627\u0644\u06cc \u06a9\u0647 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u06a9\u0648\u0686\u06a9 \u0628\u0627 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0648\u0627\u0646\u06cc\u0644\u06cc \u0628\u0633\u0627\u0632\u06cc\u062f \u060c \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0686\u0627\u0631\u0686\u0648\u0628\u06cc \u0645\u0627\u0646\u0646\u062f React \u060c Vue \u06cc\u0627 Svelte \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0628\u0647 \u0637\u0648\u0631 \u0642\u0627\u0628\u0644 \u062a\u0648\u062c\u0647\u06cc \u06a9\u0627\u0631\u0627\u06cc\u06cc \u0648 \u0642\u0627\u0628\u0644\u06cc\u062a \u062d\u0641\u0638 \u062a\u0648\u0633\u0639\u0647 \u0631\u0627 \u0628\u0647\u0628\u0648\u062f \u0628\u062e\u0634\u062f. React \u0628\u0647 \u062f\u0644\u06cc\u0644 \u0645\u0639\u0645\u0627\u0631\u06cc \u0645\u0628\u062a\u0646\u06cc \u0628\u0631 \u0645\u0624\u0644\u0641\u0647 \u0648 \u0627\u06a9\u0648\u0633\u06cc\u0633\u062a\u0645 \u0628\u0632\u0631\u06af \u060c \u06cc\u06a9 \u0627\u0646\u062a\u062e\u0627\u0628 \u0645\u062d\u06a9\u0645 \u0627\u0633\u062a.<\/p>\n<\/li>\n<li>\n<p><strong>\u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 \u062c\u062f\u06cc\u062f (\u0645\u062b\u0627\u0644 React):<\/strong><\/p>\n<pre class=\"highlight shell\"><code>npx create-react-app my-telegram-miniapp <span class=\"nt\">--template<\/span> typescript\n<span class=\"nb\">cd <\/span>my-telegram-miniapp\n<\/code><\/pre>\n<\/li>\n<li>\n<p><strong>\u0628\u0631\u0646\u0627\u0645\u0647 \u0648\u0628 \u062a\u0644\u06af\u0631\u0627\u0645 SDK \u0631\u0627 \u0646\u0635\u0628 \u06a9\u0646\u06cc\u062f:<\/strong> \u0627\u06cc\u0646 SDK \u062f\u0633\u062a\u0631\u0633\u06cc \u0628\u0647 API \u0645\u06cc\u0646\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 Telegram \u0631\u0627 \u0641\u0631\u0627\u0647\u0645 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<pre class=\"highlight shell\"><code>npm <span class=\"nb\">install<\/span> @twa-dev\/sdk\n<\/code><\/pre>\n<\/li>\n<li>\n<p><strong>\u0646\u0635\u0628 \u06a9\u0631\u062f\u0646 <code>telegram-web-app<\/code> \u0627\u0646\u0648\u0627\u0639:<\/strong><\/p>\n<pre class=\"highlight shell\"><code>npm <span class=\"nb\">install<\/span> <span class=\"nt\">--save-dev<\/span> @types\/telegram-web-app\n<\/code><\/pre>\n<\/li>\n<\/ol>\n<h3><span class=\"ez-toc-section\" id=\"4_%D8%A7%D9%88%D9%84%DB%8C%D9%87_%D8%B3%D8%A7%D8%B2%DB%8C_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D9%88%D8%A8_%D8%AA%D9%84%DA%AF%D8%B1%D8%A7%D9%85_SDK\"><\/span>\n<p>  4. \u0627\u0648\u0644\u06cc\u0647 \u0633\u0627\u0632\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u0648\u0628 \u062a\u0644\u06af\u0631\u0627\u0645 SDK<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u0627\u0647\u0645\u06cc\u062a:<\/strong> \u0642\u0628\u0644 \u0627\u0632 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0647\u0631 \u06cc\u06a9 \u0627\u0632 \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u0622\u0646 \u060c SDK \u0628\u0627\u06cc\u062f \u0627\u0648\u0644\u06cc\u0647 \u0634\u0648\u062f.<\/li>\n<\/ul>\n<ol>\n<li> <strong>SDK \u0631\u0627 \u062f\u0631 \u0645\u0624\u0644\u0641\u0647 \u0627\u0635\u0644\u06cc \u062e\u0648\u062f \u0622\u063a\u0627\u0632 \u06a9\u0646\u06cc\u062f (\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644 \u060c <code>src\/App.tsx<\/code>):<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"k\">import<\/span> <span class=\"nx\">React<\/span><span class=\"p\">,<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">useEffect<\/span> <span class=\"p\">}<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">react<\/span><span class=\"dl\">'<\/span><span class=\"p\">;<\/span>\n<span class=\"k\">import<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">.\/App.css<\/span><span class=\"dl\">'<\/span><span class=\"p\">;<\/span>\n<span class=\"k\">import<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">useTelegram<\/span> <span class=\"p\">}<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">.\/hooks\/useTelegram<\/span><span class=\"dl\">'<\/span><span class=\"p\">;<\/span>\n\n<span class=\"kd\">function<\/span> <span class=\"nf\">App<\/span><span class=\"p\">()<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">tg<\/span><span class=\"p\">,<\/span> <span class=\"nx\">onToggleButton<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">useTelegram<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"nf\">useEffect<\/span><span class=\"p\">(()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nf\">ready<\/span><span class=\"p\">();<\/span>\n  <span class=\"p\">},<\/span> <span class=\"p\">[<\/span><span class=\"nx\">tg<\/span><span class=\"p\">]);<\/span>\n\n  <span class=\"k\">return <\/span><span class=\"p\">(<\/span>\n    <span class=\"o\">&lt;<\/span><span class=\"nx\">div<\/span> <span class=\"nx\">className<\/span><span class=\"o\">=<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">App<\/span><span class=\"dl\">\"<\/span><span class=\"o\">&gt;<\/span>\n      <span class=\"nx\">Content<\/span>\n    <span class=\"o\">&lt;<\/span><span class=\"sr\">\/div<\/span><span class=\"err\">&gt;\n<\/span>  <span class=\"p\">);<\/span>\n<span class=\"p\">}<\/span>\n\n<span class=\"k\">export<\/span> <span class=\"k\">default<\/span> <span class=\"nx\">App<\/span><span class=\"p\">;<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"c1\">\/\/ src\/hooks\/useTelegram.ts<\/span>\n<span class=\"k\">import<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">useEffect<\/span><span class=\"p\">,<\/span> <span class=\"nx\">useState<\/span> <span class=\"p\">}<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">react<\/span><span class=\"dl\">'<\/span><span class=\"p\">;<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">tg<\/span> <span class=\"o\">=<\/span> <span class=\"nb\">window<\/span><span class=\"p\">.<\/span><span class=\"nx\">Telegram<\/span><span class=\"p\">.<\/span><span class=\"nx\">WebApp<\/span><span class=\"p\">;<\/span>\n\n<span class=\"k\">export<\/span> <span class=\"kd\">function<\/span> <span class=\"nf\">useTelegram<\/span><span class=\"p\">()<\/span> <span class=\"p\">{<\/span>\n\n    <span class=\"kd\">const<\/span> <span class=\"nx\">onClose<\/span> <span class=\"o\">=<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n        <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nf\">close<\/span><span class=\"p\">()<\/span>\n    <span class=\"p\">}<\/span>\n\n    <span class=\"kd\">const<\/span> <span class=\"nx\">onToggleButton<\/span> <span class=\"o\">=<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n        <span class=\"k\">if<\/span><span class=\"p\">(<\/span><span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nx\">MainButton<\/span><span class=\"p\">.<\/span><span class=\"nx\">isVisible<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n            <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nx\">MainButton<\/span><span class=\"p\">.<\/span><span class=\"nf\">hide<\/span><span class=\"p\">();<\/span>\n        <span class=\"p\">}<\/span> <span class=\"k\">else<\/span> <span class=\"p\">{<\/span>\n            <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nx\">MainButton<\/span><span class=\"p\">.<\/span><span class=\"nf\">show<\/span><span class=\"p\">();<\/span>\n        <span class=\"p\">}<\/span>\n    <span class=\"p\">}<\/span>\n\n    <span class=\"k\">return<\/span> <span class=\"p\">{<\/span>\n        <span class=\"nx\">tg<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">onClose<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">onToggleButton<\/span><span class=\"p\">,<\/span>\n        <span class=\"na\">user<\/span><span class=\"p\">:<\/span> <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nx\">initDataUnsafe<\/span><span class=\"p\">?.<\/span><span class=\"nx\">user<\/span><span class=\"p\">,<\/span>\n        <span class=\"na\">queryId<\/span><span class=\"p\">:<\/span> <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nx\">initDataUnsafe<\/span><span class=\"p\">?.<\/span><span class=\"nx\">query_id<\/span><span class=\"p\">,<\/span>\n    <span class=\"p\">}<\/span>\n<span class=\"p\">}<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<ol>\n<li> <strong>\u062a\u0648\u0636\u06cc\u062d:<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>*   **`window.Telegram.WebApp`:** This global object is provided by Telegram when the Mini App is running within the Telegram environment.\n*   **`tg.ready()`:**  This function signals to Telegram that your Mini App is ready to be displayed.  It's crucial to call this early in your app's lifecycle.\n*   **`useEffect`:**  The `useEffect` hook ensures that `tg.ready()` is called only once after the component mounts.\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"5_%D8%A7%D8%AC%D8%B1%D8%A7%DB%8C_%D9%88%DB%8C%DA%98%DA%AF%DB%8C_%D9%87%D8%A7%DB%8C_%D8%A7%D8%B3%D8%A7%D8%B3%DB%8C\"><\/span>\n<p>  5. \u0627\u062c\u0631\u0627\u06cc \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u0627\u0633\u0627\u0633\u06cc<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u0647\u062f\u0641:<\/strong> \u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627\u06cc \u0627\u0635\u0644\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u0631\u0627 \u0646\u0634\u0627\u0646 \u062f\u0647\u06cc\u062f.<\/li>\n<\/ul>\n<ol>\n<li> <strong>\u062a\u0646\u0638\u06cc\u0645 \u0631\u0646\u06af \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647:<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"nf\">useEffect<\/span><span class=\"p\">(()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nf\">setBackgroundColor<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">#f0f0f0<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n<span class=\"p\">},<\/span> <span class=\"p\">[<\/span><span class=\"nx\">tg<\/span><span class=\"p\">]);<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<ol>\n<li> <strong>\u0646\u0645\u0627\u06cc\u0634 \u0648 \u067e\u0646\u0647\u0627\u0646 \u06a9\u0631\u062f\u0646 \u062f\u06a9\u0645\u0647 \u0627\u0635\u0644\u06cc:<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"nf\">useEffect<\/span><span class=\"p\">(()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nx\">MainButton<\/span><span class=\"p\">.<\/span><span class=\"nf\">setText<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">Close<\/span><span class=\"dl\">'<\/span><span class=\"p\">)<\/span>\n    <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nx\">MainButton<\/span><span class=\"p\">.<\/span><span class=\"nf\">onClick<\/span><span class=\"p\">(<\/span><span class=\"nx\">onClose<\/span><span class=\"p\">)<\/span>\n<span class=\"p\">},<\/span> <span class=\"p\">[<\/span><span class=\"nx\">tg<\/span><span class=\"p\">])<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<ol>\n<li> <strong>\u062f\u0633\u062a\u0631\u0633\u06cc \u0628\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u06a9\u0627\u0631\u0628\u0631:<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">user<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">useTelegram<\/span><span class=\"p\">();<\/span>\n\n<span class=\"c1\">\/\/ ...<\/span>\n\n<span class=\"p\">{<\/span><span class=\"nx\">user<\/span><span class=\"p\">?.<\/span><span class=\"nx\">id<\/span><span class=\"p\">}<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<ol>\n<li><strong>\u062a\u0648\u0636\u06cc\u062d:<\/strong><\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>*   **`tg.setBackgroundColor()`:** Sets the background color of the Mini App.\n*   **`tg.MainButton`:**  Provides access to the main button at the bottom of the Mini App.  You can customize its text, color, and click handler.\n*   **`tg.initDataUnsafe.user`:** Contains information about the current user (ID, first name, last name, username).  **Important:** This data is *unsafe* because it's not cryptographically verified.  For sensitive operations, you should verify the data using the `initData` property (see Security Considerations).\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"6_%D8%B1%D8%B3%DB%8C%D8%AF%DA%AF%DB%8C_%D8%A8%D9%87_%D8%B1%D9%88%DB%8C%D8%AF%D8%A7%D8%AF%D9%87%D8%A7\"><\/span>\n<p>  6. \u0631\u0633\u06cc\u062f\u06af\u06cc \u0628\u0647 \u0631\u0648\u06cc\u062f\u0627\u062f\u0647\u0627<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u0627\u0647\u0645\u06cc\u062a:<\/strong> \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0645\u06cc\u0646\u06cc \u0645\u06cc \u062a\u0648\u0627\u0646\u0646\u062f \u0628\u0647 \u0631\u0648\u06cc\u062f\u0627\u062f\u0647\u0627\u06cc \u0645\u062e\u062a\u0644\u0641\u06cc \u06a9\u0647 \u062a\u0648\u0633\u0637 \u06a9\u0627\u0631\u0628\u0631 \u06cc\u0627 \u062a\u0644\u06af\u0631\u0627\u0645 \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc \u0634\u0648\u062f \u067e\u0627\u0633\u062e \u062f\u0647\u0646\u062f.<\/li>\n<\/ul>\n<ol>\n<li>\n<strong>\u06af\u0648\u0634 \u062f\u0627\u062f\u0646 \u0628\u0647 <code>themeChanged<\/code> \u0631\u0648\u06cc\u062f\u0627\u062f:<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"nf\">useEffect<\/span><span class=\"p\">(()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nf\">onEvent<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">themeChanged<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"kd\">function<\/span><span class=\"p\">(){<\/span>\n        <span class=\"nb\">document<\/span><span class=\"p\">.<\/span><span class=\"nx\">body<\/span><span class=\"p\">.<\/span><span class=\"nx\">style<\/span><span class=\"p\">.<\/span><span class=\"nx\">backgroundColor<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nx\">themeParams<\/span><span class=\"p\">.<\/span><span class=\"nx\">bg_color<\/span><span class=\"p\">;<\/span>\n    <span class=\"p\">})<\/span>\n<span class=\"p\">},<\/span> <span class=\"p\">[<\/span><span class=\"nx\">tg<\/span><span class=\"p\">])<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<ol>\n<li><strong>\u062a\u0648\u0636\u06cc\u062d:<\/strong><\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>*   **`tg.onEvent()`:**  Registers a callback function to be executed when a specific event occurs.\n*   **`themeChanged`:**  This event is triggered when the user changes the Telegram theme (e.g., from light to dark mode).\n*   **`tg.themeParams`:**  Provides access to the current theme parameters (e.g., background color, text color).\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"7_%D8%A7%D8%B1%D8%B3%D8%A7%D9%84_%D8%AF%D8%A7%D8%AF%D9%87_%D9%87%D8%A7_%D8%A8%D9%87_%D8%B1%D8%A8%D8%A7%D8%AA\"><\/span>\n<p>  7. \u0627\u0631\u0633\u0627\u0644 \u062f\u0627\u062f\u0647 \u0647\u0627 \u0628\u0647 \u0631\u0628\u0627\u062a<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u0645\u06a9\u0627\u0646\u06cc\u0633\u0645:<\/strong> \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0645\u06cc\u0646\u06cc \u0645\u06cc \u062a\u0648\u0627\u0646\u0646\u062f \u062f\u0627\u062f\u0647 \u0647\u0627 \u0631\u0627 \u0628\u0647 \u0631\u0628\u0627\u062a \u0647\u0627\u06cc\u06cc \u06a9\u0647 \u0622\u0646\u0647\u0627 \u0631\u0627 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0631\u062f\u0647 \u0627\u0633\u062a \u060c \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u0646\u062f.<\/li>\n<\/ul>\n<ol>\n<li>\n<strong>\u0627\u0631\u0633\u0627\u0644 \u062f\u0627\u062f\u0647 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 <code>tg.sendData()<\/code>:<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"kd\">const<\/span> <span class=\"nx\">sendDataToBot<\/span> <span class=\"o\">=<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">tg<\/span><span class=\"p\">.<\/span><span class=\"nf\">sendData<\/span><span class=\"p\">(<\/span><span class=\"nx\">JSON<\/span><span class=\"p\">.<\/span><span class=\"nf\">stringify<\/span><span class=\"p\">({<\/span> <span class=\"na\">message<\/span><span class=\"p\">:<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">Hello from the Mini App!<\/span><span class=\"dl\">'<\/span> <span class=\"p\">}));<\/span>\n<span class=\"p\">};<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<ol>\n<li>\n<strong>\u0631\u0633\u06cc\u062f\u06af\u06cc \u0628\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627 \u062f\u0631 \u0631\u0628\u0627\u062a (Node.js \u0645\u062b\u0627\u0644):<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"nx\">bot<\/span><span class=\"p\">.<\/span><span class=\"nf\">on<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">message<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">msg<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">msg<\/span><span class=\"p\">.<\/span><span class=\"nx\">web_app_data<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"kd\">const<\/span> <span class=\"nx\">data<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">JSON<\/span><span class=\"p\">.<\/span><span class=\"nf\">parse<\/span><span class=\"p\">(<\/span><span class=\"nx\">msg<\/span><span class=\"p\">.<\/span><span class=\"nx\">web_app_data<\/span><span class=\"p\">.<\/span><span class=\"nx\">data<\/span><span class=\"p\">);<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">Received data from Mini App:<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"nx\">data<\/span><span class=\"p\">);<\/span>\n    <span class=\"nx\">bot<\/span><span class=\"p\">.<\/span><span class=\"nf\">sendMessage<\/span><span class=\"p\">(<\/span><span class=\"nx\">msg<\/span><span class=\"p\">.<\/span><span class=\"nx\">chat<\/span><span class=\"p\">.<\/span><span class=\"nx\">id<\/span><span class=\"p\">,<\/span> <span class=\"s2\">`You sent: <\/span><span class=\"p\">${<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">message<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"p\">);<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">});<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<ol>\n<li><strong>\u062a\u0648\u0636\u06cc\u062d:<\/strong><\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>*   **`tg.sendData()`:** Sends a string of data back to the bot.  It's common to serialize the data as JSON.\n*   **`msg.web_app_data`:**  In your bot's message handler, check for the `web_app_data` property.  This contains the data sent from the Mini App.\n*   **`msg.web_app_data.data`:**  The actual data string sent by the Mini App.\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"8_%D9%85%D9%84%D8%A7%D8%AD%D8%B8%D8%A7%D8%AA_%D8%A7%D9%85%D9%86%DB%8C%D8%AA%DB%8C\"><\/span>\n<p>  8. \u0645\u0644\u0627\u062d\u0638\u0627\u062a \u0627\u0645\u0646\u06cc\u062a\u06cc<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u062a\u0623\u06cc\u06cc\u062f \u062f\u0627\u062f\u0647 \u0647\u0627:<\/strong> \u0647\u0645\u06cc\u0634\u0647 \u062a\u0623\u06cc\u06cc\u062f \u06a9\u0646\u06cc\u062f <code>initData<\/code> \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0646\u0634\u0627\u0646\u0647 \u0631\u0628\u0627\u062a \u0628\u0631\u0627\u06cc \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u0627\u0632 \u062f\u0633\u062a\u06a9\u0627\u0631\u06cc \u062f\u0627\u062f\u0647 \u0647\u0627.<\/li>\n<li>  <strong>\u0636\u062f \u0639\u0641\u0648\u0646\u06cc \u0648\u0631\u0648\u062f\u06cc:<\/strong> \u0628\u0631\u0627\u06cc \u062c\u0644\u0648\u06af\u06cc\u0631\u06cc \u0627\u0632 \u062d\u0645\u0644\u0627\u062a \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u062f\u0631 \u0633\u0627\u06cc\u062a (XSS) \u060c \u0648\u0631\u0648\u062f\u06cc \u06a9\u0627\u0631\u0628\u0631 \u0631\u0627 \u0636\u062f \u0639\u0641\u0648\u0646\u06cc \u06a9\u0646\u06cc\u062f.<\/li>\n<li>  <strong>https:<\/strong>  \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0646\u06cc \u0634\u0645\u0627 <em>\u0628\u0627\u06cc\u062f<\/em> \u0627\u0632 \u0637\u0631\u06cc\u0642 https \u0633\u0631\u0648 \u0634\u0648\u062f.<\/li>\n<\/ul>\n<ol>\n<li>\n<strong>\u062a\u0623\u06cc\u06cc\u062f <code>initData<\/code> (\u0645\u062b\u0627\u0644 \u0633\u0627\u062f\u0647 &#8211; node.js):<\/strong>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"k\">import<\/span> <span class=\"nx\">crypto<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">crypto<\/span><span class=\"dl\">'<\/span><span class=\"p\">;<\/span>\n\n<span class=\"kd\">function<\/span> <span class=\"nf\">verifyTelegramWebAppInitData<\/span><span class=\"p\">(<\/span><span class=\"nx\">initData<\/span><span class=\"p\">:<\/span> <span class=\"kr\">string<\/span><span class=\"p\">,<\/span> <span class=\"nx\">botToken<\/span><span class=\"p\">:<\/span> <span class=\"kr\">string<\/span><span class=\"p\">):<\/span> <span class=\"nx\">boolean<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">secretKey<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">crypto<\/span>\n    <span class=\"p\">.<\/span><span class=\"nf\">createHmac<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">sha256<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">WebAppData<\/span><span class=\"dl\">'<\/span><span class=\"p\">)<\/span>\n    <span class=\"p\">.<\/span><span class=\"nf\">update<\/span><span class=\"p\">(<\/span><span class=\"nx\">botToken<\/span><span class=\"p\">)<\/span>\n    <span class=\"p\">.<\/span><span class=\"nf\">digest<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"kd\">const<\/span> <span class=\"nx\">dataCheckString<\/span> <span class=\"o\">=<\/span> <span class=\"k\">new<\/span> <span class=\"nc\">URLSearchParams<\/span><span class=\"p\">(<\/span><span class=\"nx\">initData<\/span><span class=\"p\">).<\/span><span class=\"nf\">sort<\/span><span class=\"p\">().<\/span><span class=\"nf\">toString<\/span><span class=\"p\">();<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">hmac<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">crypto<\/span>\n    <span class=\"p\">.<\/span><span class=\"nf\">createHmac<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">sha256<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"nx\">secretKey<\/span><span class=\"p\">)<\/span>\n    <span class=\"p\">.<\/span><span class=\"nf\">update<\/span><span class=\"p\">(<\/span><span class=\"nx\">dataCheckString<\/span><span class=\"p\">)<\/span>\n    <span class=\"p\">.<\/span><span class=\"nf\">digest<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">hex<\/span><span class=\"dl\">'<\/span><span class=\"p\">);<\/span>\n\n  <span class=\"kd\">const<\/span> <span class=\"nx\">expectedHash<\/span> <span class=\"o\">=<\/span> <span class=\"k\">new<\/span> <span class=\"nc\">URLSearchParams<\/span><span class=\"p\">(<\/span><span class=\"nx\">initData<\/span><span class=\"p\">).<\/span><span class=\"nf\">get<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">hash<\/span><span class=\"dl\">'<\/span><span class=\"p\">);<\/span>\n\n  <span class=\"k\">return<\/span> <span class=\"nx\">hmac<\/span> <span class=\"o\">===<\/span> <span class=\"nx\">expectedHash<\/span><span class=\"p\">;<\/span>\n<span class=\"p\">}<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"9_%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D9%85%DB%8C%D9%86%DB%8C_%D8%AE%D9%88%D8%AF\"><\/span>\n<p>  9. \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0646\u06cc \u062e\u0648\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ol>\n<li>\n<p><strong>\u06cc\u06a9 \u062f\u0633\u062a\u0648\u0631 \u0631\u0628\u0627\u062a \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f:<\/strong> \u0627\u0632 Botfather \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u062f\u0633\u062a\u0648\u0631 \u06a9\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0646\u06cc \u0634\u0645\u0627 \u0631\u0627 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0645\u06cc \u06a9\u0646\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f (\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644 \u060c <code>\/webapp<\/code>).<\/p>\n<\/li>\n<li>\n<p><strong>\u062f\u0633\u062a\u0648\u0631 \u0631\u0627 \u062f\u0631 \u0631\u0628\u0627\u062a \u062e\u0648\u062f \u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc \u06a9\u0646\u06cc\u062f:<\/strong><\/p>\n<\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight typescript\"><code><span class=\"nx\">bot<\/span><span class=\"p\">.<\/span><span class=\"nf\">onText<\/span><span class=\"p\">(<\/span><span class=\"sr\">\/<\/span><span class=\"se\">\\\/<\/span><span class=\"sr\">webapp\/<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">msg<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">chatId<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">msg<\/span><span class=\"p\">.<\/span><span class=\"nx\">chat<\/span><span class=\"p\">.<\/span><span class=\"nx\">id<\/span><span class=\"p\">;<\/span>\n  <span class=\"nx\">bot<\/span><span class=\"p\">.<\/span><span class=\"nf\">sendWebApp<\/span><span class=\"p\">(<\/span><span class=\"nx\">chatId<\/span><span class=\"p\">,<\/span> <span class=\"p\">{<\/span>\n    <span class=\"na\">url<\/span><span class=\"p\">:<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">YOUR_MINI_APP_URL<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span>\n  <span class=\"p\">});<\/span>\n<span class=\"p\">});<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<ol>\n<li><strong>\u062a\u0648\u0636\u06cc\u062d:<\/strong><\/li>\n<\/ol>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>*   <strong><code>bot.sendWebApp()<\/code>:<\/strong>  Sends a message with a button that launches the Mini App.\n\n<ul>\n<li>  <strong><code>url<\/code>:<\/strong>  The URL of your deployed Mini App.\n<\/li>\n<\/ul><\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"%D8%A2%D8%B2%D9%85%D8%A7%DB%8C%D8%B4_%D9%88_%D8%A7%D8%B4%DA%A9%D8%A7%D9%84_%D8%B2%D8%AF%D8%A7%DB%8C%DB%8C\"><\/span>\n<ol>\n<li>\u0622\u0632\u0645\u0627\u06cc\u0634 \u0648 \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc\n<\/li>\n<\/ol>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u062f\u0633\u06a9 \u062a\u0627\u067e \u062a\u0644\u06af\u0631\u0627\u0645:<\/strong> \u0628\u0631\u0627\u06cc \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc \u0622\u0633\u0627\u0646 \u062a\u0631 \u0627\u0632 \u062f\u0633\u06a9 \u062a\u0627\u067e \u062a\u0644\u06af\u0631\u0627\u0645 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f. \u0627\u0628\u0632\u0627\u0631\u0647\u0627\u06cc \u062a\u0648\u0633\u0639\u0647 \u062f\u0647\u0646\u062f\u0647 (\u0645\u0639\u0645\u0648\u0644\u0627\u064b \u0628\u0627 \u0641\u0634\u0627\u0631 \u062f\u0627\u062f\u0646 F12) \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u062a\u0627 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0647\u0627\u06cc \u06a9\u0646\u0633\u0648\u0644 \u0648 \u0634\u0628\u06a9\u0647 \u0645\u06cc\u0646\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u0631\u0627 \u0628\u0627\u0632\u0631\u0633\u06cc \u06a9\u0646\u06cc\u062f.<\/li>\n<li>  <strong>\u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc \u0627\u0632 \u0631\u0627\u0647 \u062f\u0648\u0631 (Android):<\/strong>  \u0627\u0632 \u0648\u06cc\u0698\u06af\u06cc \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc \u0627\u0632 \u0631\u0627\u0647 \u062f\u0648\u0631 Chrome \u0628\u0631\u0627\u06cc \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 Mini \u062e\u0648\u062f \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0628\u0631 \u0631\u0648\u06cc \u06cc\u06a9 \u062f\u0633\u062a\u06af\u0627\u0647 Android \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f.<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"11_%D8%A7%D8%B3%D8%AA%D9%82%D8%B1%D8%A7%D8%B1\"><\/span>\n<p>  11. \u0627\u0633\u062a\u0642\u0631\u0627\u0631<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u0633\u06cc\u0633\u062a\u0645 \u0639\u0627\u0645\u0644 \u0647\u0627:<\/strong> \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0646\u06cc \u062e\u0648\u062f \u0631\u0627 \u0628\u0647 \u0647\u0631 \u0628\u0633\u062a\u0631 \u0645\u06cc\u0632\u0628\u0627\u0646\u06cc \u0648\u0628 \u06a9\u0647 \u0627\u0632 HTTPS \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0645\u06cc \u06a9\u0646\u062f \u060c \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u06cc\u062f (\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644 \u060c NetLify \u060c Vercel \u060c AWS S3 \u060c Google Cloud Storage).<\/li>\n<li>  <strong>\u0627\u062f\u063a\u0627\u0645 \u0645\u062f\u0627\u0648\u0645\/\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u0645\u062f\u0627\u0648\u0645 (CI\/CD):<\/strong>  \u0641\u0631\u0622\u06cc\u0646\u062f \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u0631\u0627 \u062e\u0648\u062f\u06a9\u0627\u0631 \u06a9\u0646\u06cc\u062f.<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"12_%D9%88%DB%8C%DA%98%DA%AF%DB%8C_%D9%87%D8%A7_%D9%88_%D9%85%D9%84%D8%A7%D8%AD%D8%B8%D8%A7%D8%AA_%D9%BE%DB%8C%D8%B4%D8%B1%D9%81%D8%AA%D9%87\"><\/span>\n<p>  12. \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627 \u0648 \u0645\u0644\u0627\u062d\u0638\u0627\u062a \u067e\u06cc\u0634\u0631\u0641\u062a\u0647<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>  <strong>\u067e\u0631\u062f\u0627\u062e\u062a \u0647\u0627:<\/strong> \u067e\u0631\u062f\u0627\u062e\u062a \u0647\u0627\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 \u0631\u0627 \u062f\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0646\u06cc \u062e\u0648\u062f \u0627\u062f\u063a\u0627\u0645 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>  <strong>\u0645\u06a9\u0627\u0646:<\/strong> \u0628\u0647 \u0645\u06a9\u0627\u0646 \u06a9\u0627\u0631\u0628\u0631 (\u0628\u0627 \u0627\u062c\u0627\u0632\u0647 \u0622\u0646\u0647\u0627) \u062f\u0633\u062a\u0631\u0633\u06cc \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>  <strong>\u0628\u0627\u0632\u062e\u0648\u0631\u062f \u0647\u0627\u067e\u062a\u06cc\u06a9:<\/strong> \u0628\u0631\u0627\u06cc \u0627\u0631\u062a\u0642\u0627\u0621 \u062a\u062c\u0631\u0628\u0647 \u06a9\u0627\u0631\u0628\u0631 \u060c \u0628\u0627\u0632\u062e\u0648\u0631\u062f Haptic \u0627\u0631\u0627\u0626\u0647 \u062f\u0647\u06cc\u062f.<\/li>\n<li>  <strong>\u0633\u0641\u0627\u0631\u0634\u06cc \u0633\u0627\u0632\u06cc \u0645\u0648\u0636\u0648\u0639:<\/strong>  \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0646\u06cc \u062e\u0648\u062f \u0631\u0627 \u0628\u0627 \u0645\u0648\u0636\u0648\u0639 \u062a\u0644\u06af\u0631\u0627\u0645 \u06a9\u0627\u0631\u0628\u0631 \u062a\u0637\u0628\u06cc\u0642 \u062f\u0647\u06cc\u062f.<\/li>\n<li>  <strong>\u0630\u062e\u06cc\u0631\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627:<\/strong>  \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0631\u062f\u0646 <code>localStorage<\/code> \u06cc\u0627 <code>sessionStorage<\/code> \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0633\u0645\u062a \u0645\u0634\u062a\u0631\u06cc.<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"%D9%85%D9%86%D8%A7%D8%A8%D8%B9\"><\/span>\n<p>  \u0645\u0646\u0627\u0628\u0639<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0627\u06cc\u0646 \u06a9\u062a\u0627\u0628 \u0631\u0627\u0647\u0646\u0645\u0627 \u06cc\u06a9 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u062c\u0627\u0645\u0639 \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0645\u06cc\u0646\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u062f\u0647\u062f. \u0628\u0647 \u06cc\u0627\u062f \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f \u06a9\u0647 \u0628\u0631\u0627\u06cc \u0628\u0647 \u0631\u0648\u0632\u062a\u0631\u06cc\u0646 \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0648 \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u067e\u06cc\u0634\u0631\u0641\u062a\u0647 \u0628\u0627 \u0645\u0633\u062a\u0646\u062f\u0627\u062a \u0631\u0633\u0645\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 \u0645\u0634\u0648\u0631\u062a \u06a9\u0646\u06cc\u062f. \u0645\u0648\u0641\u0642 \u0628\u0627\u0634\u06cc\u062f!<\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u0627\u06cc\u0646 \u06a9\u062a\u0627\u0628\u0686\u0647 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0645\u06cc\u0646\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 \u0631\u0627 \u062a\u0634\u0631\u06cc\u062d \u0645\u06cc \u06a9\u0646\u062f. \u0627\u06cc\u0646 \u0628\u0631 \u062f\u0642\u062a \u062a\u0623\u06a9\u06cc\u062f \u0645\u06cc \u06a9\u0646\u062f \u060c \u062a\u0648\u0636\u06cc\u062d\u0627\u062a \u0645\u0641\u0635\u0644\u06cc \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u062f\u0647\u062f \u060c \u0648 \u0634\u0627\u0645\u0644 \u0628\u0631\u0686\u0633\u0628 \u0632\u062f\u0646 \u0627\u062e\u062a\u06cc\u0627\u0631\u06cc\/\u0645\u0648\u0631\u062f \u0646\u06cc\u0627\u0632 \u0628\u0631\u0627\u06cc \u0648\u0636\u0648\u062d \u0627\u0633\u062a. 1. \u062f\u0631\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0645\u06cc\u0646\u06cc \u062a\u0644\u06af\u0631\u0627\u0645 \u062a\u0639\u0631\u06cc\u0641: \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc Telegram Mini \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0648\u0628 \u0647\u0633\u062a\u0646\u062f \u06a9\u0647 \u0645\u0633\u062a\u0642\u06cc\u0645\u0627\u064b \u062f\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 Telegram &hellip;<\/p>\n","protected":false},"author":2,"featured_media":97904,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"https:\/\/media2.dev.to\/dynamic\/image\/width=1000,height=500,fit=cover,gravity=auto,format=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxo0vmmoo7vzi7agwue4q.png","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-97903","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/97903","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=97903"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/97903\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media\/97904"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=97903"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=97903"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=97903"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}