تست سیستم چیه؟ 🤔
تست سیستم که با عنوانین system-level یا system integration هم شناخته میشه، مرحله مهمی در چرخه عمر توسعه نرم افزار هست.
این تست فراتر از تأیید ویژگی های فردی و یک تکنیک بلک باکس هست، به این معنی که تستر ها بر روی عملکرد برنامه از دیدگاه کاربر تمرکز میکنن، نه روی عملکرد پیچیده داخلی (که محدوده آزمایش جعبه سفید هست). هدفش هم اطمینان از اینکه هر نوع ورودی کاربر نتیجه مورد انتظار رو در کل برنامه ایجاد میکنه، هست.
برای اینکه بهتر درکش کنید به این موضوع فکر کنید.
تست سیستم مانند آزمایش تمام چرخ دنده ها در یک ماشین پیچیده هست، که جواب این سوالات رو باید بده: آیا اونا به طور یکپارچه به هم متصل میشن تا خروجی مورد نظر رو ایجاد کنن؟ این فرآیند سخت معمولاً پس از integration testing هست، جایی که ماژول های جداگانه برای سازگاری تست میشن، و قبل از acceptance testing هست.
اما این تست بسیار شبیه به تست E2E هست. اما قبل از اینکه مقایسه کنیم، باید اول بدونیم تست E2E چیه!
در توسعه نرمافزار "end-to-end" (E2E)" نشون دهنده یک رویکرد جامع هست که یک سیستم یا برنامه رو از ابتدا تا انتها، ارزیابی میکنه و تجربه یک کاربر واقعی رو تقلید میکنه. تصور کنید کاربری وارد شده، منوها رو مرور میکنه، اقدامات خاصی رو انجام میده و نتیجه دلخواه رو دریافت میکنه. تست E2E با دقت تمام این حرکات کاربر رو تکرار میکنه و اطمینان میده که تمام اجزای متصل به هم به طور یکپارچه برای ارائه عملکرد مورد انتظار با یکدیگر همکاری میکنن.
اگه بخوام تفاوت این دو تست رو خلاصه بگم:
1⃣ تست سیستم بر بررسی نحوه عملکرد بخشهای جداگانه برنامه مثل چرخ دندههای روغنکاری شده با هم تمرکز داره، درحالی که تست E2E کل ماشین رو بررسی میکنه که آیا تجربه کاربری روان رو در همه عملکردها ارائه میده یا خیر.
2⃣ تست سیستم مثل اینه که از اعضای یک تیم اطمینان حاصل میکنیم که قطعات خود رو به درستی تنظیم کردن و استفاده میکنن. تست E2E بالاتر از همشونه و تضمین میکنه که کل اعضا با هم جمع میشن تا یک اجرای هماهنگ و تاثیرگذار برای مخاطبشون ایجاد کنن.
به صورت کلی این تست یکی از تست هایی هست که بنظر من خیلی مهمه و میتونیم با استفاده ازش، از سلامت و کیفیت اپلیکیشنمون اطمینان بیشتری حاصل کنیم.
برای کسب اطلاعات بیشتر به مقالات زیر مراجعه کنید (مخصوصا دومی)
- Article
- Article
- Article
#test #system_test
@CodeModule
تست سیستم که با عنوانین system-level یا system integration هم شناخته میشه، مرحله مهمی در چرخه عمر توسعه نرم افزار هست.
این تست فراتر از تأیید ویژگی های فردی و یک تکنیک بلک باکس هست، به این معنی که تستر ها بر روی عملکرد برنامه از دیدگاه کاربر تمرکز میکنن، نه روی عملکرد پیچیده داخلی (که محدوده آزمایش جعبه سفید هست). هدفش هم اطمینان از اینکه هر نوع ورودی کاربر نتیجه مورد انتظار رو در کل برنامه ایجاد میکنه، هست.
برای اینکه بهتر درکش کنید به این موضوع فکر کنید.
تست سیستم مانند آزمایش تمام چرخ دنده ها در یک ماشین پیچیده هست، که جواب این سوالات رو باید بده: آیا اونا به طور یکپارچه به هم متصل میشن تا خروجی مورد نظر رو ایجاد کنن؟ این فرآیند سخت معمولاً پس از integration testing هست، جایی که ماژول های جداگانه برای سازگاری تست میشن، و قبل از acceptance testing هست.
اما این تست بسیار شبیه به تست E2E هست. اما قبل از اینکه مقایسه کنیم، باید اول بدونیم تست E2E چیه!
در توسعه نرمافزار "end-to-end" (E2E)" نشون دهنده یک رویکرد جامع هست که یک سیستم یا برنامه رو از ابتدا تا انتها، ارزیابی میکنه و تجربه یک کاربر واقعی رو تقلید میکنه. تصور کنید کاربری وارد شده، منوها رو مرور میکنه، اقدامات خاصی رو انجام میده و نتیجه دلخواه رو دریافت میکنه. تست E2E با دقت تمام این حرکات کاربر رو تکرار میکنه و اطمینان میده که تمام اجزای متصل به هم به طور یکپارچه برای ارائه عملکرد مورد انتظار با یکدیگر همکاری میکنن.
اگه بخوام تفاوت این دو تست رو خلاصه بگم:
به صورت کلی این تست یکی از تست هایی هست که بنظر من خیلی مهمه و میتونیم با استفاده ازش، از سلامت و کیفیت اپلیکیشنمون اطمینان بیشتری حاصل کنیم.
برای کسب اطلاعات بیشتر به مقالات زیر مراجعه کنید (مخصوصا دومی)
- Article
- Article
- Article
#test #system_test
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡9🔥5
مروری بر روانشناسی رنگها 🖼️
رنگها یکی از مهمترین المانهایی هستن که میتونن باعث جذب مخاطب بشن و ما به عنوان دولوپر، بهتره اطلاعاتی راجبشون داشته باشیم. دلیل این حرف هم اینه که ممکنه تو برخی از پروژه ها دیزاینر نداشته باشیم و نحوه دیزاین و خلاقیت به عهده خود دولوپر باشه.
⚪ سفید: از نظر علمی رنگ سفید نمایانگر روشناییه و میتونه چشمان انسان رو به خودش جلب کنه. در زمینه تجارت هم رنگ سفید نمایانگر برابری و عدالته. استفاده گسترده از رنگ سفید، یکی از ویژگیهای طراحی قدرتمند هست.
🔴 قرمز: رنگ قرمز میتونه نمادی از بالارفتن ضربان قلب و میزان دم و باز دم باشه. رنگ قرمز شدت توجه و اشتها رو تحریک می کنه. همچنین قرمز فوریت رو نشان میده، مثلا برای اعلام حراج، یا ایجاد انگیزه برای خریدهای فوری.
🔴 صورتی: صورتی یکی از آرام و ملایمترین و درعینحال متناقضترین رنگها هست. این رنگ موجب آرامش و آسایش میشه.
🔵 آبی: سایههایی نرمی از رنگ آبی میتونه باعث آرامش و اعتماد باشه. اما درست برعکس در حالت پر رنگ میتونه تاثیر هیجانی روی ذهن داشته باشه. رنگ آبی میتونه حالت فکر کردن رو بهتر نشون بده.
🟢 سبز: رنگ سبز طبیعت رو به یادمون میاره و احساس صلح، امید، اعتماد و آرامش رو در ما ایجاد میکنه. این رنگ در میان برند های مربوط با محیط زیست، صنایع غذایی، کالاهای خانگی، تکنولوژی و امور مالی محبوب تر هست و باعث آرامش میشه.
🟡 زرد: رنگ زرد رنگیه که میتونه جلب توجه کنه. زرد نشوندهنده نیروی جوانی، شادابی و خوشبینی هست و عموما برای جلب رضایت مشتری استفاده میشه.
🟠 نارنجی: نارنجی برای تحریک هیجان و شور و شوق مفیده. نارنجی میتونه تاثیرگذار و راهی برای برقراری ارتباط باشه. با اینکه این رنگ کمتر از قرمز استفاده میشه، اما همچنان یک پانچ پر انرژی داره.
🟣 بنفش: بنفش ثروت رو بدنبال داره. این مورد میتونه حس تفکر و ذهنیت رو شبیه سازی کنه. بنفش تلفیقی از آبی و انرژی رنگ قرمزه و فعالیت های مغزی رو که در رابطه با حل کردن مشکل هست، فعال می کنه.
🟤 قهوهای: قهوهای مضمون آرامش و صلح ، سازگاری، اعتبار و حتی حس خستگی رو القا میکنه. قهوهای کاربردهای گوناگونی در سایت داره مثلاً برای بکگراند طرح، بهعنوان رنگ تأکید کننده و برای رنگ متون استفاده میشه.
⚫ سیاه: قدرت و سلطه همواره همراه با رنگ سیاه میاد. رنگ سیاه میتونه در طراحی سایت باعث به وجود آوردن حس تفاوت و خاص بودن، تجملات و زرق و برق بشه.
در کل وقتی وبسایتتون رو طراحی میکنید، رنگها نباید یک بحث خودسرانه باشه. در صورتی که انتخاب کردن رنگها با دقت انجام بشه، میتونیم بهتر جذب مخاطب کنیم و پیشرفت سریع تری داشته باشیم.
#colors
@CodeModule
رنگها یکی از مهمترین المانهایی هستن که میتونن باعث جذب مخاطب بشن و ما به عنوان دولوپر، بهتره اطلاعاتی راجبشون داشته باشیم. دلیل این حرف هم اینه که ممکنه تو برخی از پروژه ها دیزاینر نداشته باشیم و نحوه دیزاین و خلاقیت به عهده خود دولوپر باشه.
⚪ سفید: از نظر علمی رنگ سفید نمایانگر روشناییه و میتونه چشمان انسان رو به خودش جلب کنه. در زمینه تجارت هم رنگ سفید نمایانگر برابری و عدالته. استفاده گسترده از رنگ سفید، یکی از ویژگیهای طراحی قدرتمند هست.
🔴 قرمز: رنگ قرمز میتونه نمادی از بالارفتن ضربان قلب و میزان دم و باز دم باشه. رنگ قرمز شدت توجه و اشتها رو تحریک می کنه. همچنین قرمز فوریت رو نشان میده، مثلا برای اعلام حراج، یا ایجاد انگیزه برای خریدهای فوری.
🔵 آبی: سایههایی نرمی از رنگ آبی میتونه باعث آرامش و اعتماد باشه. اما درست برعکس در حالت پر رنگ میتونه تاثیر هیجانی روی ذهن داشته باشه. رنگ آبی میتونه حالت فکر کردن رو بهتر نشون بده.
🟢 سبز: رنگ سبز طبیعت رو به یادمون میاره و احساس صلح، امید، اعتماد و آرامش رو در ما ایجاد میکنه. این رنگ در میان برند های مربوط با محیط زیست، صنایع غذایی، کالاهای خانگی، تکنولوژی و امور مالی محبوب تر هست و باعث آرامش میشه.
🟡 زرد: رنگ زرد رنگیه که میتونه جلب توجه کنه. زرد نشوندهنده نیروی جوانی، شادابی و خوشبینی هست و عموما برای جلب رضایت مشتری استفاده میشه.
🟠 نارنجی: نارنجی برای تحریک هیجان و شور و شوق مفیده. نارنجی میتونه تاثیرگذار و راهی برای برقراری ارتباط باشه. با اینکه این رنگ کمتر از قرمز استفاده میشه، اما همچنان یک پانچ پر انرژی داره.
🟣 بنفش: بنفش ثروت رو بدنبال داره. این مورد میتونه حس تفکر و ذهنیت رو شبیه سازی کنه. بنفش تلفیقی از آبی و انرژی رنگ قرمزه و فعالیت های مغزی رو که در رابطه با حل کردن مشکل هست، فعال می کنه.
🟤 قهوهای: قهوهای مضمون آرامش و صلح ، سازگاری، اعتبار و حتی حس خستگی رو القا میکنه. قهوهای کاربردهای گوناگونی در سایت داره مثلاً برای بکگراند طرح، بهعنوان رنگ تأکید کننده و برای رنگ متون استفاده میشه.
⚫ سیاه: قدرت و سلطه همواره همراه با رنگ سیاه میاد. رنگ سیاه میتونه در طراحی سایت باعث به وجود آوردن حس تفاوت و خاص بودن، تجملات و زرق و برق بشه.
در کل وقتی وبسایتتون رو طراحی میکنید، رنگها نباید یک بحث خودسرانه باشه. در صورتی که انتخاب کردن رنگها با دقت انجام بشه، میتونیم بهتر جذب مخاطب کنیم و پیشرفت سریع تری داشته باشیم.
#colors
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥17⚡3
امتیازات یادگیری docker برای فرانت دولوپر ها 🙋♂️
همونطور که داخل میتینگ سفر در رودمپ فرانت اند صحبت کردیم، یادگیری docker یک مهارت اجباری برای رودمپ فرانت اند نیست، اما یادگیری اون امتیازات و مزایایی برای فرانت دولوپر داره که میتونه هم داخل استخدام، هم داخل فرایند توسعه نرم افزار بهش کمک بکنه.
✅ در این پست میخوایم به این امتیازات و مزایا بپردازیم و برسیشون کنیم:
1️⃣ محیطهای توسعه یکسان: داکر به شما این امکان رو میده که محیطهای توسعه، تست و تولید رو یکسان کنید. این موضوع باعث کاهش مشکلات ناشی از "کار روی ماشین" میشه.
2️⃣ جداسازی دپندنسی ها: با استفاده از داکر، میتونید وابستگیهای پروژههای مختلف رو جدا کنید. این موضوع به جلوگیری از تداخل نسخهها و مشکلات مشابه روی پروژه کمک میکنه.
3️⃣ آسانی در دیپلوی: با ایجاد کانتینرهای داکر، میتونید به راحتی پروژه هاتون رو در محیطهای مختلف دیپلوی کنید، بدون نگرانی از مشکلات محیطی.
4️⃣ توسعهی سریعتر: داکر به شما این امکان رو میده که به سرعت محیطهای جدیدی رو برای تست ویژگیهای جدید ایجاد کنید و به راحتی اونارو حذف کنید.
5️⃣ مدیریت آسانتر: با استفاده از داکر، میتونید پروژه هاتون رو به راحتی مدیریت کنید و به سادگی اونارو آپدیت یا scalable کنید.
6️⃣ همکاری بهتر: داکر میتونه به تیمها کمک کنه تا به راحتی با هم همکاری کنن، چون همه اعضای تیم میتونن از یک محیط یکسان استفاده کنن.
7️⃣ امکان استفاده از CI/CD: داکر به راحتی با ابزارهای CI/CD ادغام میشه، که میتونه باعث تسریع در فرآیند توسعه و استقرار بشه.
8️⃣ تاثیر امتیازی در رزومه :وجود داکر در رزومه شما میتونه نشون دهنده فعال بودنتون در صنعت نرم افزار، به صورت تخصصی تر باشه که از دیدگاه شرکت ها و کارفرما ها میتونه یک مثبت به رزومه شما اضافه کنه.
با توجه به این مزایا، یادگیری داکر برای فرانتاند دولوپرها میتونه یک سرمایهگذاری ارزشمند باشه که به افزایش کارایی و کیفیت کار کمک میکنه🏖️
#docker #frontend
@CodeModule
همونطور که داخل میتینگ سفر در رودمپ فرانت اند صحبت کردیم، یادگیری docker یک مهارت اجباری برای رودمپ فرانت اند نیست، اما یادگیری اون امتیازات و مزایایی برای فرانت دولوپر داره که میتونه هم داخل استخدام، هم داخل فرایند توسعه نرم افزار بهش کمک بکنه.
با توجه به این مزایا، یادگیری داکر برای فرانتاند دولوپرها میتونه یک سرمایهگذاری ارزشمند باشه که به افزایش کارایی و کیفیت کار کمک میکنه
#docker #frontend
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥10👌3⚡2
با WunderGraph تازه نفس آشنا بشید! 🪐
WunderGraph یک پکیج تقریبا جدیده که فرآیند ساخت برنامه های فول استک رو با API های قدرتمند ساده میکنه. این پکیج یک راه حل همه کاره برای مدیریت API های بک اند و ادغام کردنشون با front-end، ارائه میده. WunderGraph از فناوریهایی مثل GraphQL REST و gRPC استفاده میکنه.
از این پکیج چه استفاده ای میشه؟
WunderGraph برای کمک به دولوپر ها طراحی شده تا برنامه های مدرن رو به سرعت و کارآمد ایجاد کنن. بسیاری از جنبه های مدیریت API از جمله ساخت اسکیما و احراز هویت رو خودکار میکنه. با WunderGraph دولوپر ها میتونن بدون زحمت چندین API رو ادغام کنن و همچنین این پکیج از real-time data پشتیبانی میکنه.
یکی از ویژگیهای برجسته WunderGraph، توانایی اون در تولید TypeScript SDK برای برنامههای فرانت هست که type-safty رو تضمین میکنه و خطر ارور های رانتایم رو کاهش میده. همچنین یک API Gateway داخلی ارائه میکنه که امنیت، محدودیت و سایر نگرانیها رو مدیریت میکنه.
WunderGraph یک ابزار قدرتمند برای دولوپر های Node.js هست که به دنبال ساخت برنامه های قوی و مقیاس پذیر هستن. WunderGraph با سادهسازی پیچیدگیها، یکپارچهسازی و مدیریت API، به دولوپر ها این امکان رو میده تا با حفظ استانداردهای بالا امنیت و عملکرد، روند توسعه خود رو تسریع ببخشن. برای کسب اطلاعات بیشتر به داکیومنتش مراجعه کنید.
#wundergraph
@CodeModule
WunderGraph یک پکیج تقریبا جدیده که فرآیند ساخت برنامه های فول استک رو با API های قدرتمند ساده میکنه. این پکیج یک راه حل همه کاره برای مدیریت API های بک اند و ادغام کردنشون با front-end، ارائه میده. WunderGraph از فناوریهایی مثل GraphQL REST و gRPC استفاده میکنه.
از این پکیج چه استفاده ای میشه؟
WunderGraph برای کمک به دولوپر ها طراحی شده تا برنامه های مدرن رو به سرعت و کارآمد ایجاد کنن. بسیاری از جنبه های مدیریت API از جمله ساخت اسکیما و احراز هویت رو خودکار میکنه. با WunderGraph دولوپر ها میتونن بدون زحمت چندین API رو ادغام کنن و همچنین این پکیج از real-time data پشتیبانی میکنه.
یکی از ویژگیهای برجسته WunderGraph، توانایی اون در تولید TypeScript SDK برای برنامههای فرانت هست که type-safty رو تضمین میکنه و خطر ارور های رانتایم رو کاهش میده. همچنین یک API Gateway داخلی ارائه میکنه که امنیت، محدودیت و سایر نگرانیها رو مدیریت میکنه.
WunderGraph یک ابزار قدرتمند برای دولوپر های Node.js هست که به دنبال ساخت برنامه های قوی و مقیاس پذیر هستن. WunderGraph با سادهسازی پیچیدگیها، یکپارچهسازی و مدیریت API، به دولوپر ها این امکان رو میده تا با حفظ استانداردهای بالا امنیت و عملکرد، روند توسعه خود رو تسریع ببخشن. برای کسب اطلاعات بیشتر به داکیومنتش مراجعه کنید.
#wundergraph
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥11💔1
دنبال نمونه پروژه برای تمرینی؟ 🤔
ریپازیتوری 50projects50days مجموعهای از ۵۰ پروژهی کوچیک و کاربردیه که به منظور تمرین و تقویت مهارتهای HTML، CSS و JavaScript طراحی شده. پیشنهاد میکنم حتما یه سر بزنید.
🌐 Repository
#repository
@CodeModule
ریپازیتوری 50projects50days مجموعهای از ۵۰ پروژهی کوچیک و کاربردیه که به منظور تمرین و تقویت مهارتهای HTML، CSS و JavaScript طراحی شده. پیشنهاد میکنم حتما یه سر بزنید.
#repository
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
GitHub
GitHub - bradtraversy/50projects50days: 50+ mini web projects using HTML, CSS & JS
50+ mini web projects using HTML, CSS & JS. Contribute to bradtraversy/50projects50days development by creating an account on GitHub.
🔥12😁2
با رقیب جدید Next.js آشنا بشید! 💀
در بین فریمورک های توانمند جهت توسعه پروژه های فول استک، RedwoodJS به عنوان یک فریمورک نسبتا جدید و با یک چارچوب منسجم، شکاف بین بک اند و فرانت اند رو کمتر میکنه. RedwoodJS که با تمرکز بر تجربه و بهرهوری دولوپر ها توسعه داده شده، بهطور یکپارچه با فناوریهای محبوبی مثل React، GraphQL و Prisma ترکیب میشه تا توسعه پروژه هارو سادهتر کنه.
ویژگی های محبوب این فریمورک چیه؟
1⃣ یکپارچه سازی Full-Stack: یک ساختار "monorepo" رو ارائه میده که هم کد فرانت اند و هم کد بک اند رو در یک ریپازیتوری واحد نگه میداره. این رویکرد استقرار و نسخهسازی رو ساده میکنه و در عین حال یکپارچگی در سراسر برنامه رو تشویق میکنه.
2⃣ GraphQL API: این فریمورک از GraphQL برای query و دستکاری داده ها استفاده میکنه که امکان تعامل داده های انعطاف پذیر و کارآمد رو، فراهم میکنه. این با پشتیبانی داخلی Redwood برای تولید و مدیریت اسکیما های GraphQL تکمیل میشه.
3⃣ Prisma ORM: برای مدیریت دیتابیس، Prisma رو یکپارچه میکنه.
به صورت کلی RedwoodJS به عنوان یک فریمورک قدرتمند برای دولوپر هایی که به دنبال ساده سازی توسعه full-stack هستن، با تأکید بر بهره وری و قابلیت نگهداری برجسته هست. با ترکیب React، GraphQL و Prisma در یک بسته منسجم، فرآیند توسعه رو ساده کرده و از بهترین شیوه ها استفاده میکنه. برای کسب اطلاعات بیشتر به داکیومنتش مراجعه کنید.
#redwoodjs
@CodeModule
در بین فریمورک های توانمند جهت توسعه پروژه های فول استک، RedwoodJS به عنوان یک فریمورک نسبتا جدید و با یک چارچوب منسجم، شکاف بین بک اند و فرانت اند رو کمتر میکنه. RedwoodJS که با تمرکز بر تجربه و بهرهوری دولوپر ها توسعه داده شده، بهطور یکپارچه با فناوریهای محبوبی مثل React، GraphQL و Prisma ترکیب میشه تا توسعه پروژه هارو سادهتر کنه.
ویژگی های محبوب این فریمورک چیه؟
به صورت کلی RedwoodJS به عنوان یک فریمورک قدرتمند برای دولوپر هایی که به دنبال ساده سازی توسعه full-stack هستن، با تأکید بر بهره وری و قابلیت نگهداری برجسته هست. با ترکیب React، GraphQL و Prisma در یک بسته منسجم، فرآیند توسعه رو ساده کرده و از بهترین شیوه ها استفاده میکنه. برای کسب اطلاعات بیشتر به داکیومنتش مراجعه کنید.
#redwoodjs
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥12⚡2
واحد های اندازه گیری svh , dvh , vh و تفاوت هاشون در css 🔵
🔵 در CSS، واحدهای اندازهگیری
1️⃣ vh (Viewport Height) :
این واحد به معنای 1 درصد از ارتفاع نمای دید (viewport) هست. به عنوان مثال، 100vh برابر با 100 درصد از ارتفاع نمای دیده.و اگر کاربر اندازه پنجره مرورگر رو تغییر بده، اندازههای مبتنی بر
2️⃣ dvh (Dynamic Viewport Height) :
این واحد مشابه
3️⃣ svh (Small Viewport Height) :
این واحد هم به ارتفاع نمای دید مربوط میشه، اما به ارتفاع کوچکترین حالت نمای دید اشاره داره. این به این معناست که
‼️ تفاوتهای این واحد های اندازه گیری :
تغییرات داینامیک:
✅ و برای طراحیهای واکنشگرا و بهینهسازی تجربه کاربری در دستگاههای موبایل، استفاده از
این واحدها به شما کمک میکنن تا تجربه کاربری بهتری رو در دستگاههای مختلف فراهم کنید.
#css #styling
@CodeModule
dvh
، svh
و vh
به ترتیب به معنای "درصد ارتفاع نمای دید" (viewport height) هستن، اما هر کدوم کاربرد و رفتار خاص خودشون رو دارن.این واحد به معنای 1 درصد از ارتفاع نمای دید (viewport) هست. به عنوان مثال، 100vh برابر با 100 درصد از ارتفاع نمای دیده.و اگر کاربر اندازه پنجره مرورگر رو تغییر بده، اندازههای مبتنی بر
vh
نیز به طور اتوماتیک تغییر میکنه.این واحد مشابه
vh
هست، اما به طور خاص برای نمای داینامیک طراحی شده. به این معنی که dvh
به تغییرات ارتفاع نمای دید در حین نمایش محتوای پویا (مثل کیبورد موبایل) حساسه. به عنوان مثال، اگر کیبورد در دستگاههای موبایل باز بشه، dvh
ممکنه کمتر از vh
باشه چون ارتفاع قابل مشاهده کاهش پیدا میکنه.این واحد هم به ارتفاع نمای دید مربوط میشه، اما به ارتفاع کوچکترین حالت نمای دید اشاره داره. این به این معناست که
svh
همیشه برابر با کمترین ارتفاع نمای دیده که میتونه در هر زمان وجود داشته باشه. به عنوان مثال، اگه کاربر کیبورد رو باز کنه، svh
ممکنه به اندازهای کاهش پیدا کنه که فقط ارتفاع کوچکترین حالت رو نشون بده.تغییرات داینامیک:
dvh
و svh
به تغییرات دینامیک در صفحه (مثل باز شدن کیبورد) حساستر هستند، در حالی که vh
ثابته.dvh
و svh
میتونه مفیدتر باشه.این واحدها به شما کمک میکنن تا تجربه کاربری بهتری رو در دستگاههای مختلف فراهم کنید.
#css #styling
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥20⚡5
چقدر از Turbo Repo اطلاعات دارید؟ 🤔
Turbo Repo یک ابزار مدرن و قدرتمند برای مدیریت و توسعه چندین پروژه در یک مخزن مشترک (Monorepo) هست. با استفاده از Turbo Repo میتونید پروژههای مختلفی مثل فرانتاند، بکاند، و بستههای مشترک رو در یک ساختار Monorepo قرار بدید و بهطور همزمان روی اونها کار کنید.
ویژگیها و مزایای Turbo Repo⬇️
🔵 مدیریت بهینه وابستگیها: Turbo Repo با مدیریت خودکار وابستگیها بین پروژهها، اطمینان میده که تنها بخشهایی تغییر داده شدن دوباره ساخته بشن. این ویژگی میتونه زمان بیلد رو به شدت کاهش بده.
🔵 کَش کردن بیلدها: یکی از ویژگیهای برجسته Turbo Repo استفاده از کش هوشمند برای ذخیره و بازیابی نتایج بیلد هست. این کار باعث میشه در صورت تغییرات کوچک در کد، نیازی به بیلد کامل پروژه نباشه و فرآیند سریعتر انجام بشه.
🔵 پشتیبانی از ابزارهای مختلف: Turbo Repo با بسیاری از ابزارهای توسعه مثل Webpack، Babel، و TypeScript به خوبی کار میکنه و قابلیت ادغام با CI/CD های مختلف رو داره.
🔵 کار تیمی: با استفاده از Turbo Repo، تیمها میتونن به صورت همزمان روی چندین پروژه کار کنن و تغییرات رو به صورت هماهنگ در مخزن Monorepo مدیریت کنن.
🔵 مونوریپوهای مقیاسپذیر: Turbo Repo به دولوپرا کمک میکنه تا یک Monorepo بزرگ و پیچیده رو با کارایی بالا مدیریت کنن. این ابزار بهخصوص برای تیمهایی که روی پروژههای بزرگ و چند بخشی کار میکنن، مفیده.
به طور کلی Turbo Repo یک ابزار قدرتمند هست که میتونه به تیمها در مدیریت پیچیدگیهای پروژههای بزرگ کمک کنه و دولوپرا رو قادر میسازه، تا با کارایی بیشتر و بهینهتری کد نویسی کنن. برای کسب اطلاعات بیشتر به داکیومنتش مراجعه کنید.
Document🌐
#turboRepo
@CodeModule
Turbo Repo یک ابزار مدرن و قدرتمند برای مدیریت و توسعه چندین پروژه در یک مخزن مشترک (Monorepo) هست. با استفاده از Turbo Repo میتونید پروژههای مختلفی مثل فرانتاند، بکاند، و بستههای مشترک رو در یک ساختار Monorepo قرار بدید و بهطور همزمان روی اونها کار کنید.
ویژگیها و مزایای Turbo Repo
به طور کلی Turbo Repo یک ابزار قدرتمند هست که میتونه به تیمها در مدیریت پیچیدگیهای پروژههای بزرگ کمک کنه و دولوپرا رو قادر میسازه، تا با کارایی بیشتر و بهینهتری کد نویسی کنن. برای کسب اطلاعات بیشتر به داکیومنتش مراجعه کنید.
Document
#turboRepo
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥11
با ماژول Readline ورودی هارو مدیریت کن! 😐
ماژول «readline» در Node.js یک ابزار قدرتمند و همه کاره هست که فرایند خوندن ورودی، مثل ورودی استاندارد فرآیند ها («process.stdin») رو مدیریت میکنه. این ماژول یک رابط برای خوندن دادهها در یک خط و زمان فراهم میکنه و اون رو برای ساخت برنامههای کامندلاین، درخواستهای تعاملی و سایر برنامههای ورودی محور بسیار مفید میکنه.
چطور از این ماژول استفاده کنیم؟🤔
یکی از رایج ترین استفاده ها از ماژول readline، اینه که پرامت های کاربر رو مدیریت کنه و این کار رو میشه با استفاده از متد "question" انجام داد.
در این مثال، برنامه از کاربر اسمش رو میپرسه و سپس به او سلام میکنه. متد «rl.close()» برای بستن رابط پس از تکمیل فراخوانی میشه.
یا مثلا ما یک فایل داریم و میخوایم خط به خط اون رو بررسی کنیم.
میتونیم با استفاده از متد "createInterface" این کار رو انجام بدیم:
ما در مثال بالا خط به خط فایل داده شده رو بررسی میکنیم که آیا، «keyword» داده شده در فایل هست یا خیر.
به صورت کلی با استفاده از ماژول «readline»، دولوپر ها میتونن به راحتی ورودی کاربر رو مدیریت کنن، دادهها رو validate کنن، و تجربیات تعاملی رو مستقیماً از کامند لاین ایجاد کنن. برای کسب اطلاعات بیشتر به داکیومنت این ماژول مراجعه کنید.
#nodejs
@CodeModule
ماژول «readline» در Node.js یک ابزار قدرتمند و همه کاره هست که فرایند خوندن ورودی، مثل ورودی استاندارد فرآیند ها («process.stdin») رو مدیریت میکنه. این ماژول یک رابط برای خوندن دادهها در یک خط و زمان فراهم میکنه و اون رو برای ساخت برنامههای کامندلاین، درخواستهای تعاملی و سایر برنامههای ورودی محور بسیار مفید میکنه.
چطور از این ماژول استفاده کنیم؟
یکی از رایج ترین استفاده ها از ماژول readline، اینه که پرامت های کاربر رو مدیریت کنه و این کار رو میشه با استفاده از متد "question" انجام داد.
rl.question('What is your name? ', (answer) => {
console.log(`Hello, ${answer}!`);
rl.close();
});
در این مثال، برنامه از کاربر اسمش رو میپرسه و سپس به او سلام میکنه. متد «rl.close()» برای بستن رابط پس از تکمیل فراخوانی میشه.
یا مثلا ما یک فایل داریم و میخوایم خط به خط اون رو بررسی کنیم.
میتونیم با استفاده از متد "createInterface" این کار رو انجام بدیم:
let f = false;
const stream = fs.createReadStream(filePath, { encoding: 'utf8' });
const rl = createInterface({ input: stream });
rl.on('line', (line) => {
if (f) {
return;
}
if (line.includes(keyword)) {
f = true;
rl.close();
stream.destroy();
resolve(true);
}
});
ما در مثال بالا خط به خط فایل داده شده رو بررسی میکنیم که آیا، «keyword» داده شده در فایل هست یا خیر.
به صورت کلی با استفاده از ماژول «readline»، دولوپر ها میتونن به راحتی ورودی کاربر رو مدیریت کنن، دادهها رو validate کنن، و تجربیات تعاملی رو مستقیماً از کامند لاین ایجاد کنن. برای کسب اطلاعات بیشتر به داکیومنت این ماژول مراجعه کنید.
#nodejs
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡9🔥2
دورهمی های کدماژول، قسمت هفتم
موضوع: بیتکوین و بلاکچین💰
مهمان گفتگو: آقای کیهان علیزاده
زمان برگزاری: پنجشنبه (یکم شهریور)، ساعت ۱۰
فردا شب ساعت 10 این گفتگو و دورهمی رو از دست ندید(لینک میت رأس ساعت قرار میگیره)
@CodeModule
موضوع: بیتکوین و بلاکچین
مهمان گفتگو: آقای کیهان علیزاده
زمان برگزاری: پنجشنبه (یکم شهریور)، ساعت ۱۰
بیتکوین و بلاکچین، همیشه در شبکه های اجتماعی و اینترنت این واژگان رو شنیدیم و معمولا بیشتر با مطالبی مربوط به قیمت و بازار همراه بوده. توی این میتینگ کمی فنی تر و عمیق تر به تکنولوژی بلاکچین، نحوه عملکردش و مشکلاتی که حل میکنه با محوریت بیتکوین میپردازیم، و تمام ابهامات شما رو بر طرف میکنیم.
فردا شب ساعت 10 این گفتگو و دورهمی رو از دست ندید(لینک میت رأس ساعت قرار میگیره)
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
2🔥14❤🔥3
با کتابخانه Ammo.js آشنا بشید 😎
Ammo.js یک کتابخانه فیزیک سهبعدیه که به زبان جاوااسکریپت نوشته شده و بر اساس Bullet Physics Engine، که یک موتور فیزیک مشهور و قدرتمنده، توسعه داده شده.
این کتابخانه به دولوپرا این امکان رو میده که فیزیک واقعگرایانه رو به بازیها و برنامههای سهبعدی شون اضافه کنن. Ammo.js به ویژه برای پروژههای وب و بازیهای تحت وب طراحی شده و به راحتی میتونه با کتابخانههایی مثل Three.js و Babylon.js ترکیب بشه.
ویژگیهای خاص کتابخانه Ammo.js⬇️
◀️ فیزیک واقعگرایانه: Ammo.js از الگوریتمهای پیشرفتهای برای شبیهسازی فیزیک استفاده میکنه که شامل برخوردها، گرانش، و داینامیک اجسامه.
◀️ پشتیبانی از اشکال مختلف: این کتابخانه میتونه با اشکال هندسی مختلف (مثل مکعب، کره، و ...) کار کنه و همچنین از اشکال پیچیدهتر هم پشتیبانی میکنه.
◀️ سیستم برخورد: Ammo.js دارای یک سیستم برخورد قویه که میتونه چندین جسم رو به طور همزمان مدیریت کنه و برخوردهارو به دقت شبیهسازی کنه.
◀️ داینامیک اجسام: این کتابخانه امکان شبیهسازی داینامیک اجسام سخت و نرم رو فراهم میکنه، به طوری که میشه رفتارهای مختلفی رو برای اجسام مختلف تعریف کرد.
◀️ سازگاری با وب: Ammo.js به راحتی با مرورگرها کار میکنه و میتونه در پروژههای تحت وب بدون نیاز به نصب نرمافزار اضافی استفاده شه.
◀️ توسعهی بازیهای سهبعدی: در کنار کتابخانههایی مثل Three.js میتونه برای ایجاد بازیهای سهبعدی با فیزیک واقعگرایانه مورد استفاده قرار بگیره.
کتابخانه Ammo.js با ویژگیهایی مثل شبیهسازی دقیق برخوردها، پشتیبانی از انواع اشکال، و قابلیت ادغام آسون با باقی کتابخانهها، گزینهای عالی برای ایجاد بازیها و برنامههای تعاملیه. با توجه به مزایای متعددش، از جمله عملکرد بالا و پشتیبانی از جامعه، Ammo.js میتونه به عنوان یک انتخاب مناسب برای هر توسعهدهندهای که به دنبال افزودن فیزیک به پروژههای خود هست، در نظر گرفته بشه.
برای یادگیری این کتابخانه میتونید به داکیومنتش مراجعه کنید.
Document🌕
#js #library
@CodeModule
Ammo.js یک کتابخانه فیزیک سهبعدیه که به زبان جاوااسکریپت نوشته شده و بر اساس Bullet Physics Engine، که یک موتور فیزیک مشهور و قدرتمنده، توسعه داده شده.
این کتابخانه به دولوپرا این امکان رو میده که فیزیک واقعگرایانه رو به بازیها و برنامههای سهبعدی شون اضافه کنن. Ammo.js به ویژه برای پروژههای وب و بازیهای تحت وب طراحی شده و به راحتی میتونه با کتابخانههایی مثل Three.js و Babylon.js ترکیب بشه.
ویژگیهای خاص کتابخانه Ammo.js
کتابخانه Ammo.js با ویژگیهایی مثل شبیهسازی دقیق برخوردها، پشتیبانی از انواع اشکال، و قابلیت ادغام آسون با باقی کتابخانهها، گزینهای عالی برای ایجاد بازیها و برنامههای تعاملیه. با توجه به مزایای متعددش، از جمله عملکرد بالا و پشتیبانی از جامعه، Ammo.js میتونه به عنوان یک انتخاب مناسب برای هر توسعهدهندهای که به دنبال افزودن فیزیک به پروژههای خود هست، در نظر گرفته بشه.
برای یادگیری این کتابخانه میتونید به داکیومنتش مراجعه کنید.
Document
#js #library
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥16⚡5
با Drizzle ORM آشنا بشید! 🦦
Drizzle ORM یک ORM سبک و ایمن برای Node.js و TypeScript هست که در جامعه دولوپر ها، به سرعت درحال محبوب شدنه. این ORM برای ارائه یک تجربه یکپارچه طراحی شده و به دلیل سادگی، عملکرد و تمرکز قوی بر روی یکپارچه سازی TypeScript، متمایز هست.
ویژگیها و امکانات Drizzle ORM⬇️
تایپاسکریپت-محور: Drizzle ORM به طور کامل از تایپاسکریپت پشتیبانی میکنه. این ویژگی به دولوپرا کمک میکنه تا در زمان توسعه، خطاهای تایپی و منطقی رو به حداقل برسونن.
انعطافپذیری و سادهسازی: این ORM با تمرکز بر سادگی طراحی شده و به دولوپرا این امکان رو میده تا به راحتی با پایگاههای داده کار کننن، بدون اینکه نیاز به یادگیری دستورات پیچیده SQL یا مفاهیم پیچیده ORM داشته باشن.
پشتیبانی از چندین پایگاه داده: Drizzle ORM از چندین سیستم مدیریت پایگاه داده SQL محبوب مثل PostgreSQL، MySQL، SQLite و ... پشتیبانی میکنه.
کارایی بالا: Drizzle ORM به دلیل سادگی و بهینهسازیهای داخلیش، عملکرد بسیار بالایی داره و برای برنامههای بزرگ و کوچیک مناسب هست.
کاملاً اوپنسورس: Drizzle ORM یک پروژه اوپنسورسه و توسط جامعه دولوپرا پشتیبانی و توسعه داده میشه.
این ویژگیها Drizzle ORM رو به یک گزینه جذاب برای دولوپرایی تبدیل میکنه که به دنبال یک ORM سبک و تایپاسکریپت-محور برای پروژههای خود هستن. برای کسب اطلاعات بیشتر به داکیومنتش مراجعه کنید.
#drizzle
@CodeModule
Drizzle ORM یک ORM سبک و ایمن برای Node.js و TypeScript هست که در جامعه دولوپر ها، به سرعت درحال محبوب شدنه. این ORM برای ارائه یک تجربه یکپارچه طراحی شده و به دلیل سادگی، عملکرد و تمرکز قوی بر روی یکپارچه سازی TypeScript، متمایز هست.
ویژگیها و امکانات Drizzle ORM
تایپاسکریپت-محور: Drizzle ORM به طور کامل از تایپاسکریپت پشتیبانی میکنه. این ویژگی به دولوپرا کمک میکنه تا در زمان توسعه، خطاهای تایپی و منطقی رو به حداقل برسونن.
انعطافپذیری و سادهسازی: این ORM با تمرکز بر سادگی طراحی شده و به دولوپرا این امکان رو میده تا به راحتی با پایگاههای داده کار کننن، بدون اینکه نیاز به یادگیری دستورات پیچیده SQL یا مفاهیم پیچیده ORM داشته باشن.
پشتیبانی از چندین پایگاه داده: Drizzle ORM از چندین سیستم مدیریت پایگاه داده SQL محبوب مثل PostgreSQL، MySQL، SQLite و ... پشتیبانی میکنه.
کارایی بالا: Drizzle ORM به دلیل سادگی و بهینهسازیهای داخلیش، عملکرد بسیار بالایی داره و برای برنامههای بزرگ و کوچیک مناسب هست.
کاملاً اوپنسورس: Drizzle ORM یک پروژه اوپنسورسه و توسط جامعه دولوپرا پشتیبانی و توسعه داده میشه.
این ویژگیها Drizzle ORM رو به یک گزینه جذاب برای دولوپرایی تبدیل میکنه که به دنبال یک ORM سبک و تایپاسکریپت-محور برای پروژههای خود هستن. برای کسب اطلاعات بیشتر به داکیومنتش مراجعه کنید.
#drizzle
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥12⚡3
خروجی کد بالا؟😄
Anonymous Quiz
6%
7
9%
8
20%
10
28%
11
36%
نمیدونم، رو آیکون لامپ کلیک میکنم تا متوجه بشم💡
⚡13🔥2
درود
میخواستم یه Matlab خدمتتون عرض کنم🦦
من این زندگی Ruby شما نمیخوام. شاید فکر کنید من Sql هستم ولی نه من میخوام توی دلتون Java کنم و به خاطر شما با همه Django دعوا کنم.
بقیه Go میخورن دخالت کنن و باور کنید Rust میگم.
قبول کنید لطفا به Python میوفتم :))
#fun
@CodeModule
میخواستم یه Matlab خدمتتون عرض کنم
من این زندگی Ruby شما نمیخوام. شاید فکر کنید من Sql هستم ولی نه من میخوام توی دلتون Java کنم و به خاطر شما با همه Django دعوا کنم.
بقیه Go میخورن دخالت کنن و باور کنید Rust میگم.
قبول کنید لطفا به Python میوفتم :))
چیزی نگید یه برنامه نویس عاشق شده ... 🚶🏻
#fun
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
😁27👌3
Array indexing چیست؟🚀
Array indexing تکنیکیه که برای دسترسی به المنت ها در یک آرایه بر اساس موقعیت یا ایندکس اونها استفاده میشه. همونطور که میدونید هر المنت در یک آرایه با ایندکس خود مشخص میشه که نشون دهنده موقعیت اون نسبت به المنت اول هست. ایندکسینگ امکان دسترسی موثر و مستقیم به هر المنت در آرایه رو فراهم میکنه که برای کارهای محاسباتی مختلف ضروری هست. به عنوان مثال یک آرایه یک بعدی رو در نظر بگیرید:
در این آرایه 5 عنصر وجود داره که در مکان های حافظه به هم پیوسته ذخیره میشن. ایندکس المنت اول 0، المنت دوم 1 و... هست. و همونطور که میدونید برای دسترسی مثلا به المنت سوم آرایه باید اینکار رو انجام بدیم:
از اونجا که ایندکسینگ از صفر شروع میشه در واقع ایندکس دوم به المنت سوم اشاره داره. اما میدونستید میشه هر کدوم از این هارو محاسبه کرد؟
موقعیت هر المنت در یک آرایه یک بعدی رو میشه با استفاده از یک فرمول ساده محاسبه کرد. این فرمول آدرس پایه آرایه، ایندکس المنت و اندازه هر المنت در حافظه رو محاسبه میکنه( توجه داشته باشید فقط برای آرایه های یک بعدی جوابه)
به عنوان مثال، اگر آدرس پایه آرایهA هزار باشه و هر عدد صحیح 4 بایت حافظه اشغال کنه، آدرس المنت در ایندکس دوم میشه:
بنابراین، المنت در ایندکس 2 در حافظه به آدرس 1008 ذخیره میشه.
محاسبه آدرس المنت چند بعدی⬇️
اما این ها برای آرایه های یک بعدی بود و برای آرایه های چند بعدی مساعل پیچیده تر میشه، چون باید چندین ایندکس رو در نظر بگیرید. با این حال، فرآیند رو میشه به صورت انتراعی توضیح داد. به عنوان مثال فرمول کلی ما در آرایه های یک بعدی اینه: ( فرمول بالایی هم هست اما این جامع تره)
به صورت خلاصه معنی این فرمول یعنی این:
- B: آدرس پایه آرایه است.
- W: اندازه هر المنت در بایت.
- i: ایندکس المنت.
- L_B(lower bound): به کوچکترین یا مقدار ایندکس اولیه ای که المنت آرایه از اون ایندکس شروع میشه اشاره داره. ( به صورت دیفالت 0 هست که در نظر گرفته نمیشه)
#array
@CodeModule
Array indexing تکنیکیه که برای دسترسی به المنت ها در یک آرایه بر اساس موقعیت یا ایندکس اونها استفاده میشه. همونطور که میدونید هر المنت در یک آرایه با ایندکس خود مشخص میشه که نشون دهنده موقعیت اون نسبت به المنت اول هست. ایندکسینگ امکان دسترسی موثر و مستقیم به هر المنت در آرایه رو فراهم میکنه که برای کارهای محاسباتی مختلف ضروری هست. به عنوان مثال یک آرایه یک بعدی رو در نظر بگیرید:
int A[5] ={10, 20, 30, 40, 50}
در این آرایه 5 عنصر وجود داره که در مکان های حافظه به هم پیوسته ذخیره میشن. ایندکس المنت اول 0، المنت دوم 1 و... هست. و همونطور که میدونید برای دسترسی مثلا به المنت سوم آرایه باید اینکار رو انجام بدیم:
A[2] = 30;
از اونجا که ایندکسینگ از صفر شروع میشه در واقع ایندکس دوم به المنت سوم اشاره داره. اما میدونستید میشه هر کدوم از این هارو محاسبه کرد؟
موقعیت هر المنت در یک آرایه یک بعدی رو میشه با استفاده از یک فرمول ساده محاسبه کرد. این فرمول آدرس پایه آرایه، ایندکس المنت و اندازه هر المنت در حافظه رو محاسبه میکنه( توجه داشته باشید فقط برای آرایه های یک بعدی جوابه)
Address of A[i] = Base Address + (i * Size of each element)
به عنوان مثال، اگر آدرس پایه آرایهA هزار باشه و هر عدد صحیح 4 بایت حافظه اشغال کنه، آدرس المنت در ایندکس دوم میشه:
Address of A[2] = 1000 + (2 * 4) = 1008
بنابراین، المنت در ایندکس 2 در حافظه به آدرس 1008 ذخیره میشه.
محاسبه آدرس المنت چند بعدی
اما این ها برای آرایه های یک بعدی بود و برای آرایه های چند بعدی مساعل پیچیده تر میشه، چون باید چندین ایندکس رو در نظر بگیرید. با این حال، فرآیند رو میشه به صورت انتراعی توضیح داد. به عنوان مثال فرمول کلی ما در آرایه های یک بعدی اینه: ( فرمول بالایی هم هست اما این جامع تره)
Address of A[i] = B + W * (i - L_B)
به صورت خلاصه معنی این فرمول یعنی این:
- B: آدرس پایه آرایه است.
- W: اندازه هر المنت در بایت.
- i: ایندکس المنت.
- L_B(lower bound): به کوچکترین یا مقدار ایندکس اولیه ای که المنت آرایه از اون ایندکس شروع میشه اشاره داره. ( به صورت دیفالت 0 هست که در نظر گرفته نمیشه)
برای اینکه پست زیادی طولانی نشه، ادامه مطالب رو در تلگراف برای شما عزیزان آماده کردیم🙂
#array
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥14⚡4
اگه برای تمرین و کدنویسی دنبال ui خاصی میگردید، این طرح فیگما رو به هیچ وجه از دست ندید 💀
🔵 Link
#figma
@CodeModule
#figma
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡19