استقرار pygames در صفحات GitHub با WebAssembly – PWA آماده است!
من دیر وارد این هکاتون شدم!!
چیزی که من ساختم
GitHub Action برای استقرار هر یک از ساخت بازی های شما با pygames در صفحات GitHub – mobile Friendly و PWA از word go خوانده می شود!
اعتبار تصویر: Wikimedia Commons
ارسال دسته:
تلفن دوستانه
👨💻برای افرادی که می گویند، من فقط می خواهم آن را زنده ببینم، لینک
🎬برای افرادی که می گویند صحبت کافی است – پیوند نمایشی YouTube
🕵️♂️برای افرادی که می گویند، فقط آنچه را که ساخته اید نشان دهید – GitHub Repo Link
اسکرین شات ها
صفحه اصلی
پشتیبانی از انواع دستگاه هایی که مرورگری را اجرا می کنند که از WebAssemly پشتیبانی می کند (اکثر مرورگرهای مدرن این کار را انجام می دهند)!
دستگاه های تست شده
- مانیتور ایسر 34 اینچ
- HP Omen 15″
- Microsoft Surface Go 2 10″
- گوشی هوشمند سامسونگ 6 اینچ
اقدامات GitHub
گیم پلی
سیار
کامپیوتر
شرح
Replicate the Legendary Arcade Space Invaders از سال 1978 که یک بازی shoot’em up آرکید است که توسط Tomohiro Nishikado توسعه یافته است.
بازی را می توان از طریق هر مرورگر وب که از WebAssembly پشتیبانی می کند، بازی کرد.
دستورات برای استفاده
- فلش چپ – کشتی را به سمت چپ حرکت دهید
- فلش راست – کشتی را به سمت راست حرکت دهید
- فضا – یک شلیک شلیک کنید
سطح دشواری را می توان با متغیر DIFFICULTY_LEVEL افزایش داد، مقداری بین 1 تا 10، تعداد گلوله های دشمن شلیک شده به کشتی.
سعی کردم یک فرمان ویژه آتش سریع را ادغام کنید که 100 شلیک مداوم به سمت دشمنان شلیک می کند – هیچ کدام از این حمله فرار نمی کنند.
لینک کد منبع GitHub
https://github.com/Santhoshkumard11/deploy-pygame
deploy-pygame.yml
جایگزین کردن /مهاجمان فضایی/ مسیر موجود در مخزن با نام بازی شما
name: Build Space Invaders with Pygbag
on:
push:
branches:
- main
workflow_dispatch:
jobs:
build-pygbag:
name: Sandy Inspires - Space Invaders Game
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Checkout
run: |
echo "Attempting to install pygbag"
python -m pip install pygbag
echo "Successfully installed pygbag"
echo "Attempting to build the game"
python -m pygbag --build $GITHUB_WORKSPACE/space_invaders/main.py
echo "Successfully build the game and complied to WebAssembly"
- name : "Upload to GitHub pages branch gh-pages"
uses: JamesIves/[email protected]
with:
branch: gh-pages
folder: space_invaders/build/web
مجوز مجاز
مجوز من
اشتباهات رایج
به اشتراک گذاشتن برخی از اشتباهاتی که انجام دادم و راه حل آن را سخت یافتم.
1) تنظیم مجوزهای گردش کار به درستی
- برای اینکه جریانی در مخزن شما بنویسد (ایجاد شعبه یا فشار دادن کد) باید مجوزهای خواندن و نوشتن را فعال کنید. مراحل: 1) به مخزن خود بروید تنظیمات
2) بر روی آن کلیک کنید تب Actions ** در نوار کناری سمت چپ 3) روی **General کلیک کنید
4) برای یافتن تا انتها به پایین اسکرول کنید مجوزهای گردش کار، مجوزهای خواندن و نوشتن را علامت بزنید و روی ذخیره کلیک کنید.
2) استفاده کنید $GITHUB_WORKSPACE متغیر اگر مطمئن نیستید که فایل ها یا پوشه ها را از کجا واکشی می کنید.
در آینده بیشتر اضافه خواهم کرد زیرا با تعداد بیشتری از آنها روبرو می شوم.
زمینه
من همیشه می خواستم بازی بسازم اما هیچ ایده ای در مورد طراحی بازی ندارم، اما با اسکریپت و پایگاه داده پایتون خوب بودم. اخیراً Space Invaders 🧑🚀🚀 را دوباره طراحی کردم و آن را به صورت آنلاین پست کردم، اما بسیاری گفتند که میخواهند آن را امتحان کنند، بنابراین از آنها خواستم دستورالعملهای موجود در فایل README.md را دنبال کنند. با این حال، انجام این کار برای بسیاری دشوار است، بنابراین من میخواستم آن را در وب مستقر کنم تا برای هر کسی که میخواهد آن را بازی کند و بازخورد بدهد، در دسترس باشد. من این هکاتون را دیدم و به این فکر می کردم که آیا امکان استقرار آن از طریق GitHub Actions وجود دارد یا خیر. در کمال تعجب یک راه استقرار ساده برای ساخت و استقرار بازی وجود دارد – صفحات GitHub به نجات من آمدند.
چگونه آن را ساختم
GitHub Actions برای توسعهدهندگانی که نمیخواهند وارد خطوط لوله پیچیده Jenkins شوند، به CI/CD دسترسی پیدا کردهاند، آنها را مستقر و مدیریت میکنند. اما چه کسی به یک CI/CD ساده نیاز دارد که هر بار کار کند. من از GitHub Actions برای استقرار توابع Azure، سرویسهای برنامه و سایر سرویسهای Azure استفاده کردهام، اما این بار میخواهم این فرآیند را حتی بیشتر سادهتر کنم. من می خواستم جریان خودم را بنویسم، بنابراین فقط یکی را امتحان کردم و نتیجه داد – درست مانند جادو. شما واقعا نمی دانید چه اتفاقی می افتد، اما گسترش می یابد، و فقط کار می کند.
من تصور درستی از نحوه کار با صفحات GitHub داشتم اما زیاد آن را کاوش نکردم، اما اکنون از آنجایی که میخواستم بازی را به عنوان یک برنامه وب اجرا کنم، به صفحات GitHub نگاه میکردم تا ببینم آیا میتواند یک بازی را پشتیبانی کند یا خیر. مستقر شود و نه فقط یک برنامه وب ساده.
باز هم در کمال تعجب، تا زمانی که یک فایل index.html با تمام کدهای داخل آن دارید، می توانید برنامه های کاربردی وب را (که برای تولید استفاده نمی شوند) روی آن قرار دهید. من در ابتدا مجبور شدم آن را در Azure Function مستقر کنم، که خوب است و من به سمت استقرار API ها و برنامه های وب ساده می روم، اما همیشه می خواستم کارها را ساده کنم.
و فکر نمیکردم کار کند، اما این کار را انجام داد، من اسکریپت پایتون را به WebAssembly تطبیق دادم و یک index.html ایجاد کرد که آن را به آن فشار دادم. شاخه gh-pages و توانست بازی را به آرامی رندر کند و گیم پلی آن را فوق العاده کند – بدون تاخیر (FPS خوب)، فقط زمانی که بازی را بارگذاری می کند کند است.
برای ساخت این مورد از منابع زیر استفاده کرد
Pygame – پیوند
WebAssembly – پیوند
pygbag – پیوند