ساخت پایگاه داده Fortnite Skins: The Tech Behind Skinzy.gg

به‌عنوان یک طرفدار بزرگ فورتنایت و یک توسعه‌دهنده وب تازه‌کار، همیشه این موضوع را کمی خسته‌کننده می‌دانستم که جایی وجود نداشت که بتوانم تمام پوسته‌های فورتنایت را پیدا و ردیابی کنم. هر بار که اسکین جدیدی از بین می‌رود، در چندین سایت شکار می‌شود، اما من چیزی می‌خواستم که کاوش و کشف لوازم آرایشی فورتنایت را آسان‌تر کند (و این پروژه خوبی برای نوبی مثل من بود).

بنابراین، من Skinzy.gg را ساختم، یک پایگاه داده ساده و کاربرپسند از پوسته های Fortnite که بازیکنان می توانند تمام پوسته ها، احساسات و لوازم آرایشی را در یک مکان کشف، ردیابی و کاوش کنند.

پشته فناوری: ساده نگه داشتن آن

من پشته فناوری را بسیار ساده نگه داشتم. این چیزی است که من استفاده کردم:

• HTML/CSS: این پایه و اساس سایت است. طرح‌بندی تمیز و ساده است، و اطمینان حاصل می‌کند که کاربران می‌توانند به راحتی در پوسته‌ها پیمایش و کاوش کنند.
• جاوا اسکریپت: اینجاست که جادو اتفاق می افتد. من از وانیلی جاوا اسکریپت برای واکشی داده ها از API Fortnite و به روز رسانی پویا سایت استفاده می کنم. بدون بارگیری مجدد صفحه، فقط به‌روزرسانی‌های بی‌درنگ و روان.

هیچ چیز خیلی دیوانه کننده ای نیست، اما برای ارائه آنچه طرفداران Fortnite نیاز دارند بدون پیچیدگی بیش از حد کافی است.

چالش: به روز نگه داشتن همه چیز

پوسته‌های فورتنایت دائماً افت می‌کنند و پیگیری آن‌ها یک کابوس است. داده ها باید تازه باشند، بنابراین من از AJAX برای استخراج داده ها از API Fortnite بدون نیاز به بارگذاری مجدد صفحه استفاده کردم. این باعث می شود که بازیکنان همیشه هنگام بازدید از سایت، آخرین پوسته ها را ببینند.

یکی دیگر از مواردی که باید در نظر می گرفتم حافظه پنهان بود. من نمی‌خواستم هر بار که شخصی سایت را بارگیری می‌کند، تماس‌های غیرضروری API برقرار کنم، بنابراین راه‌حل محلی ذخیره‌سازی را پیاده‌سازی کردم. این داده ها را در مرورگر کاربر ذخیره می کند و باعث می شود همه چیز سریعتر بارگذاری شود و بار روی API کاهش یابد.

جستجو و فیلتر کردن: یافتن مطالب را آسان می کند

یکی از ویژگی هایی که من واقعاً به آن افتخار می کنم، قابلیت جستجو و فیلتر است. من می‌خواستم کاری کنم که کاربران بتوانند دقیقاً آنچه را که به دنبال آن هستند پیدا کنند – چه یک پوسته کمیاب، یک مجموعه خاص یا آخرین نسخه.

من این را با استفاده از روش‌های آرایه پایه جاوا اسکریپت مانند .filter()، .sort() و .map ساختم. این روش‌ها به کاربران اجازه می‌دهند تا جستجوهای خود را بر اساس نادر بودن، تاریخ انتشار یا حتی نوع پوست محدود کنند. همه اینها فوق‌العاده پویا است، بدون نیاز به بارگیری مجدد صفحه، بنابراین کاربران می‌توانند سریعاً پوسته مناسب خود را پیدا کنند.

ساختن آن بیش از یک پایگاه داده

من نمی خواستم Skinzy.gg فقط یک پایگاه داده سرد و خالی باشد. من می‌خواستم جایی باشد که طرفداران فورتنایت بتوانند در آنجا با هم بنشینند، افکار خود را به اشتراک بگذارند و درگیر شوند. بنابراین من یک سیستم نظردهی را به هر صفحه پوست اضافه کردم که در آن بازیکنان می توانند در مورد پوسته های مورد علاقه خود صحبت کنند، نکاتی را به اشتراک بگذارند و در مورد قطره های نادر صحبت کنند.

در حال حاضر، سیستم نظردهی توسط یک باطن Node.js پشتیبانی می‌شود، بنابراین بسیار سبک است. من می‌خواستم مطمئن شوم که سایت اصلی سریع و پاسخ‌گو می‌ماند، اما برخی از ویژگی‌های پویا را نیز می‌خواستم، و این بهترین راه برای رسیدن به آن بود.

بعد چه می شود؟

هسته اصلی Skinzy.gg زنده است، اما من برنامه های بزرگی برای آینده دارم. من می خواهم ویژگی هایی مانند:

• یک سیستم حساب کاربری که در آن بازیکنان می توانند پوسته های متعلق به خود را ردیابی کنند.
• یک ویژگی لیست علاقه‌مندی‌ها تا بازیکنان بتوانند پوسته‌هایی را که می‌خواهند دریافت کنند علامت‌گذاری کنند.
• بازاری برای خرید و فروش پوسته های کمیاب (شاید با مشارکت بازار رسمی Fortnite).

اگر بازیکن یا توسعه دهنده Fortnite هستید، سایت را بررسی کنید و نظر خود را به من بگویید. این هنوز یک کار در حال پیشرفت است، اما من هیجان زده هستم که ببینم به کجا می رسد.

درس های آموخته شده

API ها مشکل هستند: حتی زمانی که API عمومی است، داده ها همیشه ساختار کاملی ندارند. لحظات زیادی وجود داشت که مجبور بودم قبل از نمایش داده ها را تمیز و عادی کنم. این به من چیزهای زیادی در مورد کار با APIهای خارجی و اطمینان از اینکه همه چیز در قالب درست است به من آموخت.

طراحی مهم است: جامعه Fortnite پوسته ها را به دلیل جذابیت بصری آنها دوست دارد، بنابراین سایت باید از نظر بصری به همان اندازه جذاب باشد. من چیزهای زیادی در مورد ساختن طرح هایی یاد گرفتم که هم کاربردی و هم زیبایی شناختی داشته باشند، در حالی که همه چیز را سریع و پاسخگو نگه می دارم.

تلفن همراه ضروری است: فورتنایت در تلفن همراه بسیار بزرگ است، بنابراین مطمئن شدم که سایت روی صفحه نمایش های کوچکتر هموار کار می کند. من روی طراحی واکنش‌گرا و بهینه‌سازی عملکرد تمرکز زیادی کردم تا مطمئن شوم کاربران موبایل بهترین تجربه ممکن را دارند.

TL; DR

من Skinzy.gg را ساختم، یک پایگاه داده ساده پوسته های Fortnite که به بازیکنان امکان می دهد با یک رابط کاربری آسان، پوسته ها را کشف، ردیابی و کاوش کنند. این سایت توسط HTML، CSS، و جاوا اسکریپت، با داده های بلادرنگ استخراج شده از Fortnite API پشتیبانی می شود. کارهای خیلی بیشتری هست که می‌خواهم انجام دهم، مانند افزودن فهرست علاقه‌مندی‌ها و بازار، اما هیجان‌زده هستم که ببینم به کجا می‌رود!