منابع تازه برای طراحان و توسعه دهندگان وب (اکتبر 2023)

Stacks.js logo

زمان آن رسیده است که یک دور دیگر از منابع تازه برای طراحان و توسعه دهندگان وب همکارمان داشته باشیم. مجموعه این ماه شامل منابع متعددی برای ارتقاء مهارت های خود در توسعه پیشرفته جلویی است.

ما همچنین تعداد انگشت شماری از کتابخانه ها و چارچوب های React.js داریم که می توانند به راحتی قابلیت های جالبی را به سایت های شما اضافه کنند، مانند افزودن موتورهای جستجوی سریع و فرم های نظرسنجی. علاوه بر این، ما ابزارهایی را برای افزایش بهره وری در نظر گرفته ایم. بدون هیچ مقدمه ای، بیایید شروع کنیم.

منابع تازه برای طراحان و توسعه دهندگان وب (سپتامبر 2023)

منابع تازه برای طراحان و توسعه دهندگان وب (سپتامبر 2023)

با جدیدترین منابع توسعه وب ما در این ماه همراه باشید. ادامه مطلب

Stacks.js

پشته ها یک چارچوب توسعه سریع تمام پشته با رویکرد “کنوانسیون روی پیکربندی” است. توسعه برنامه‌های وب و دسکتاپ، APIهای بدون سرور، زیرساخت‌های ابری را ساده می‌کند و مجموعه‌ای از اجزای رابط کاربری را ارائه می‌کند. این با پشته های توسعه وب مدرن مانند Bun، Tauri، UnoCSS، Vite و Vue ساخته شده است.

آرم Stacks.js

SweetAlert2

SweetAlert2 یک کتابخانه جاوا اسکریپت است که برای ایجاد دیالوگ های مدال از نظر بصری جذاب و پاسخگو در برنامه های کاربردی وب طراحی شده است. این امکان سفارشی‌سازی عناوین، محتوا، نمادها، دکمه‌ها و انیمیشن‌ها را فراهم می‌کند و به جای اینکه با رابط کاربری هشدار داخلی مرورگر محدود شود، UX و UI سایت شما را افزایش می‌دهد.

لوگوی SweetAlert2

دوره HTML5 Canvas Crash

این آموزش یوتیوب ملزومات بوم HTML5 را پوشش می‌دهد، از جمله راه‌اندازی پروژه‌های بوم، ترسیم دایره‌ها، افزودن تعامل ماوس، و ایجاد یک سیستم ذرات – همه از ابتدا و بدون استفاده از کتابخانه‌ها. اگر به دنبال تسلط بر توسعه وب فرانت اند خلاقانه هستید، این یک آموزش عالی است.

لرزش

لرزش یک کتابخانه React است که به طور خاص برای ساخت داشبورد طراحی شده است. این به شما امکان می دهد همه چیز را از داشبوردهای پیچیده ساده تا پیشرفته بدون زحمت ایجاد کنید. این کاملاً منبع باز است و توسط تیمی از دانشمندان داده و مهندسان نرم افزار با چشمی دقیق برای طراحی توسعه داده شده است.

آرم لرزش

کینووب

کینو یک برنامه وب پیشرو (PWA) است که به عنوان نمونه برنامه ویدیوی درخواستی (VOD) عمل می کند. این عملکرد رسانه ای را به نمایش می گذارد و به شما امکان می دهد فیلم ها را برای مشاهده آفلاین بارگیری کنید. این شامل محتوا و ویدیوهای کانال YouTube Developers Google Chrome است که قابلیت‌های PWA و چندین مورد استفاده از آن را توضیح می‌دهد.

اسکرین شات اپلیکیشن کینو

نمونه های گوگل کروم

این مخزن Git مجموعه ای از نمونه کدها و دموهایی است که توسط تیم Google Chrome نگهداری می شود. این نمونه‌ها طیف وسیعی از موضوعات توسعه وب را پوشش می‌دهند و به عنوان نمونه‌های عملی بهترین شیوه‌ها برای ساخت برنامه‌های وب با جدیدترین ویژگی‌ها در Google Chrome هستند. هر بار که Google Chrome با ویژگی های جدید منتشر می شود، به روز می شود.

نشان‌واره Google Chrome Samples

نامگذاری اشیا

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

آجرهای قالب

آجرهای قالب یک راه حل مدیریت تجربه و نظرسنجی منبع باز است. دارای تعدادی ویژگی مانند ویرایشگر بدون کد، قالب ها، نظرسنجی های هدفمند، پیوندهای قابل اشتراک گذاری، همکاری تیمی و ادغام با ابزارهایی مانند Slack و Zapier است. شما می توانید آن را به تنهایی میزبانی کنید، بنابراین کنترل کاملی بر برنامه و داده ها دارید.

آرم Formbricks

TotalTypeScript در مقابل کد

این افزونه VSCode می تواند به شما کمک کند تا TypeScript را به طور یکپارچه در محیط ویرایشگر VSCode یاد بگیرید. نکات مفیدی در مورد نحو، با پیوندهای مستقیم به اسناد برای خطاهای پیچیده ارائه می دهد. این یک ابزار جامع برای توسعه دهندگان با تجربه و به ویژه برای مبتدیان است.

آرم برنامه افزودنی TotalTypeScript در مقابل کد

ایمیل واکنش نشان دهید

ReactEmail مجموعه ای از کامپوننت های React با کیفیت بالا و بدون سبک است که برای ایجاد ایمیل های بصری جذاب طراحی شده است. این برنامه که با React و TypeScript توسعه یافته است، با هدف ساده سازی فرآیند ایجاد ایمیل های پاسخگو و ناسازگاری آدرس ها با سرویس گیرنده های ایمیل مانند Gmail و Outlook است.

لوگوی React Email

اوراما

اوراما یک موتور جستجوی متن کامل و برداری سبک وزن است که به طور کامل در TypeScript نوشته شده است. با حداقل ردپای کمتر از 2 کیلوبایت، به گونه ای طراحی شده است که قابلیت جستجوی سریع، درون حافظه و با تحمل تایپی را در وب سایت شما ارائه دهد. با هر محیط JS از جمله مرورگرها، Node.js و Deno سازگار است.

لوگوی اوراما

Noctis

Noctis مجموعه ای از تم های روشن و تاریک برای VSCode است که برای کاهش فشار چشم طراحی شده است. دارای 11 نسخه، شامل 8 تم تیره و 3 تم روشن، هر کدام با پالت های رنگی متمایز از بسیار تیره، آبی مایل به فیروزه ای سرد تا بسیار روشن و نارنجی گرم.

پیش نمایش تم Noctis

سرور JSON

سرور JSON یک ابزار تمسخر آمیز REST API است که به سرعت برنامه های کاربردی فرانت اند را نمونه سازی و آزمایش می کند. این یک سرور ساختگی بر اساس یک فایل JSON تولید می کند و به توسعه دهندگان این امکان را می دهد تا عملیات CRUD (ایجاد، خواندن، به روز رسانی، حذف) را شبیه سازی کنند و مسیرها و منابعی را برای آزمایش و توسعه تعریف کنند. از ویژگی هایی مانند فیلتر کردن، مرتب سازی و صفحه بندی پشتیبانی می کند.

لوگوی سرور JSON

React TypeScript Cheatsheet

این پروژه منبع باز راهنماهای جامع و بهترین روش ها را برای استفاده از TypeScript با React ارائه می دهد. جنبه های مختلف توسعه React، از جمله کامپوننت ها، هوک ها و سایر مفاهیم کلیدی را پوشش می دهد. هدف این پروژه کمک به توسعه دهندگان برای نوشتن کد قابل اعتمادتر و قابل نگهداری در هنگام کار با TypeScript و React است.

آرم چیت شیت React TypeScript

دامنه ها را باز کنید

دامنه ها را باز کنید پلتفرمی است که زیر دامنه های رایگان برای سایت های شخصی، پروژه های متن باز و غیره فراهم می کند. شما می توانید زیر دامنه هایی مانند *.is-cool.dev یا *.is-not-a.dev با پشتیبانی برای A، AAAA، CNAME، MX، NS، و TXT سوابق. این می تواند برای افراد و پروژه هایی که به دنبال ثبت ساب دامنه رایگان هستند مفید باشد.

اسکرین شات پلتفرم Domains را باز کنید

دری

دری مجموعه ای از ابزارها و کامپوننت های React-Three-Fiber است. این الگوهای رایج در یک محیط React را ساده می کند، مؤلفه ها و کمک هایی را برای ساده سازی ایجاد برنامه های کاربردی سه بعدی ارائه می دهد.

آرم کتابخانه Drei

توطئه

Plotly.js یک کتابخانه جاوا اسکریپت منبع باز برای ایجاد تجسم داده های تعاملی و مبتنی بر وب است. این به شما امکان می دهد انواع نمودارها، نمودارها و داشبوردها را بسازید. با پشتیبانی از طیف گسترده ای از انواع نمودار، به ویژه برای کاربردهای علمی، آماری و مالی مناسب است.

نمونه نمودار Plotly.js

KaTeX

KaTeX یک کتابخانه جاوا اسکریپت برای ارائه سریع و باکیفیت عبارات ریاضی در وب است. این سبک وزن، کارآمد و ایده آل برای گنجاندن عبارات لاتک در برنامه های وب بدون نیاز به پردازش سنگین است.

KaTeX بیان ریاضی را ارائه کرد

Google Github Actions

انتشار لطفا اقدام کنید یک اقدام GitHub توسط Google است که فرآیند نسخه‌سازی و تولید نسخه‌ها را برای پروژه‌های GitHub شما خودکار می‌کند. تاریخچه ارتکاب شما را تجزیه و تحلیل می کند، نسخه بعدی را بر اساس قوانین نسخه سازی معنایی تعیین می کند، یک شاخه انتشار جدید ایجاد می کند و درخواست های کشش و انتشار لازم را ایجاد می کند.

لوگوی لطفا اکشن را منتشر کنید

گوگس

گوگس یک سرویس Git خود میزبان است که به زبان برنامه نویسی Go نوشته شده است. این طراحی شده است که یک جایگزین آسان و سبک وزن برای سایر سیستم های میزبانی Git مانند GitLab و GitHub باشد. Gogs از ایجاد مخزن، احراز هویت کاربر، ویژگی های همکاری و موارد دیگر پشتیبانی می کند و راه حلی جامع برای مدیریت مخازن Git در زیرساخت شما ارائه می دهد.

اسکرین شات رابط Gogs

]
منبع: https://www.hongkiat.com/blog/designers-developers-monthly-10-2023/