ابزارها و منابع برای طراحان وب

اتفاقاتی که در دنیای توسعه ‌دهی وب، افتاده است ، این است که ویرایشگر بر پایه بلوک جدید، یعنی Gutenberg در WordPress ۵.۰ پدیدار شده است و از زمان آغاز آن، یک تحول بزرگ ایجاد شده است.

دومین اتفاق افتاده ، برخی از توسعه دهندگان ، برخی ابزارهای بسیار کاربری را ساخته ‌اند. مانند ابزاری که طراحان وب را قادر می‌سازد تا JSON را در ترمینال ببینند و برخی کتابخانه‌های React که در طراحی وب و توسعه ‌دهی پروژه‌ها بسیار کاربردی هستند.

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

شرکت پلاتین ، برخی از ابزارها و منابع را در این مقاله آورده است.

WP Emerge

یک فریم‌وورک تم WordPress مدرن بر پایه الگوی MVC.

Lighthouse Bot

ابزار کاربردی که طراح را قادر می‌سازد تا Lighthouse را داخل یک سرویس CI، با استفاده از Docker اجرا کند. این یک ابزار خوب برای خودکارسازی بررسی کارایی وبسایت ، هر زمان که یک تغییر به کد وبسایت خود وارد می‌کنید می‌باشد.

Learn React App

Learn React App یک منبع برای یادگیری React.js می‌باشد. اما برخلاف باقی منابعی که وجود دارند، این مورد باید به طور محلی بر روی کامپیوتر نصب شود. این ابزار نه تنها شامل نیازمندی‌های یادگیری می‌باشد، بلکه همچنین نمونه کدهای تعاملی را نیز به همراه دارد. بهترین بخش آن هم این است که می‌توان پس از نصب آن، این کارها به طور آفلاین انجام دهید.

WP Acceptance

WP Acceptance یک ابزار جدید است که طراح وب سایت را قادر می‌سازد تا آزمایش پذیرش را اجرا کند. به زبان ساده، آزمایش‌های پذیرش مجموعه‌ ای از آزمایش‌ها برای تقلید رفتار کاربر هستند. چندین فریم‌ وورک وجود دارند که این نوع آزمایش را انجام می‌دهند.

گرچه، اگر در درجه اول با WordPress کار می‌کنید، استفاده آسان این ابزار را دوست خواهید داشت؛ زیرا این ابزار برای نیازهای پروژه‌های WordPress طراحی شده است.

Shiny

یک کتابخانه JavaScript برای تقلید انعکاس رعد و برق بر روی وبسایت خود، وقتی که بر روی یک دستگاه موبایل نمایش داده می‌شود. شما می‌توانید دموی آن را در لینک https://pqina.nl/shiny/ مشاهده کنید. توجه کنید که این ابزار فقط بر روی دستگاه‌های موبایل کار خواهد کرد؛ زیرا به APIهای خاصی تکیه می‌کند که فقط بر روی دستگاه‌های موبایل در دسترس هستند.

React Lucid

ReactLucid  ابزاری است که در اشکال ‌زدایی برنامه‌های React و  GraphQL به روشی تعاملی ‌تر کمک می‌ کند. این ابزار طراحان را قادر می‌سازد تا سلسله مراتب کامپوننت و تغییرات state / prop داخل برنامه React خود را ببینند و همچنین از طرح، کوئری و جهش‌های GraphQL به صورت realtime استفاده کنید.

CSS Features Toggle

یک افزونه Chrome‌ که طراح وب سایت را قادر می‌سازد تا بعضی از ویژگی‌های خاص CSS را در Chrome غیر فعال کند. با استفاده از این ابزار، می‌توان دید که وقتی برخی ویژگی‌های خاص وجود نداشته باشند، وبسایت شما چگونه رندر شده و رفتار می‌کند. CSS Features Toggle برای طراح در پیاده‌سازی ویژگی‌های جدید CSS که شاید در همه مرورگرها پیاده‌سازی نشوند، کمک می‌کند.

Blendy

یک ابزار که می‌تواند در سفارشی ‌سازی حالت‌های استتار پس‌زمینه CSS با تصویر شما، کمک کند. شما می‌توانید پیش ‌نمایشی از حالت‌های استتار را ببینید، رنگ‌ها را تغییر دهید و تصاویر افت حرارتی را اضافه کنید. می‌توان از تصاویری از Unsplash استفاده کرده، یا آن‌ها را از کامپیوتر خود آپلود کرد.

React Elemental

مجموعه ‌ای از عناصر React که می توانند به تنهایی کار کنند. به هیچ گونه CSS خارجی برای وارد کردن یا سفارشی ‌سازی پیکربندی‌ ها برای اضافه کردن آن بر روی  Webpack نیاز ندارند. این ابزار، کامپوننت‌ های ضروری مانند Button ، Checkbox، SelectList، Tabs، Tooltip و… را به همراه دارد.

FX

 fx یک ابزار command line  است که طراح را قادر می‌سازد تا داده‌های JSON‌ را در ترمینال با حالت تعاملی بصری‌ سازی کند، به نوعی که می‌تواند داده‌ها را گسترش داده، یا کوچک‌تر کند. fx می‌تواند از طریق NPM یا Homebrew نصب شود.

Monica

Monica در دسته خود بسیار خوب است. این ابزار نوعی CRM (ابزار مدیریت رابطه با مشتری) می باشد، اما هدف آن مشتری‌های شما نیست؛ بلکه افراد نزدیک به شما مانند خانواده و دوستانتان می باشد.

درست مانند یک CRM، این ابزار شما را قادر می‌سازد تا رد چیزهایی مانند فعالیت شما با آن‌ها، و آخرین باری که با آن‌ها تماس گرفتید را داشته باشید. حتی بیشتر این ابزار می‌تواند به گونه‌ ای تنظیم شود که یادآورمدتی که شما با یک شخص تماسی نداشته ‌اید را باشد.

Ionic Framework

فریم ‌وورک Ionic مدتی می ‌شود که حضور دارد. اما در اواخر ، این فریم‌ وورک جهش بزرگی در عملکرد خود کرده است. حال این فریم ‌وورک نه تنها سریع‌ است، بلکه با دو فریم ‌وورک در حال خیزش نیز سازگار است: React.js و Vue.js.

Notable

Notable یک ابزار یادداشت برداری دسکتاپ است. برخلاف برنامه‌های مشابه، Notable قالب‌بندی اختصاصی و ابزار معمول دیگر را ندارد. یادداشت‌های این برنامه در فایل‌هایی با پسوند .md ذخیره می‌شوند. این ابزار بسیار ساده است.

TipTap

TipTap یک ویرایشگر بر پایه ProseMirror به همراه Vue.js‌ می‌باشد. TipTap جدا از به ارث بردن چندین ویژگی از ProseMirror مانند پشتیبانی سینتکس markdown، چند ویژگی مدرن مانند Menu Bubble، که در آن منوی قالب‌بندی هنگامی که متن را برجسته‌سازی می‌کنید نمایان می‌شود، ویژگی Suggestion که در آن می‌توانید یک شخص را داخل محتویات تگ کنید، و قابلیت خروجی‌گیری محتویات در قالب JSON را نیز به همراه دارد.

Restplain

Restplain یک پلاگین WordPress می باشد که طراح را قادر می‌سازد تا به آسانی سند نگاری‌هایی از اندپوینت‌های اِی‌پی‌آی REST ووردپرس خود، شامل اندپوینت‌های سفارشی بسازد. یک نکته که باید به یاد داشت، این می باشد که Resplain به طرح اندپویت برای تولید سندنگاری‌ها تکیه می‌کند؛ پس مطمئن شوید که یک طرح مناسب برای اندپوینت‌های سفارشی خود اضافه کرده‌اید.

Restplain

React Content Loader

React Content Loader یک کامپوننت سفارشی React می باشد که شما را قادر می‌سازد تا وقتی که محتویات اصلی در حال بارگذاری هستند، جانگهدار محتویات را نمایش دهید. این ابزار مشابه آن نوع loader می باشد که در Facebook و Instagram وجود دارد.

Mythic

Mythic یک تم آغازین WordPress با بهترین شیوه‌های مدرن مانند تزریق dependency، viewها و کنترلرها، و همچنین ابزار مدرنی مانند Webpack، Sass، Linting و BEM می باشد. این تم ، یک تم عالی برای افزایش سطح مهارت‌های خود به عنوان یک توسعه دهنده تم می باشد.

Refined Github

یک افزونه مرورگر برای تصحیح کردن تجربه خود در هنگام استفاده از GitHub. این افزونه چندین کلید میان ‌بر را اضافه می‌کند، برخی طرح‌ ها و رابط ‌های کاربری را تصحیح کرده و به طور خودکار لینک‌هایی را به PRها اضافه می‌کند.

Open WC

Open WC‌ مجموعه ‌ای از ابزارهایی ست که طراح را قادر می‌سازند تا یک سری کامپوننت‌های وب سفارشی را بسازد. اگر پیاده ‌سازی با یک ویژگی وب بومی را به استفاده از یک فریم‌وورک مانند Vue.js‌یا React.js ترجیح می‌دهید، Open WC می‌تواند یک جایگزین عالی باشد.

با پلاتین به روز باشید.

دیدگاه شما:

نوشته های مرتبط

۰۹

مرداد
تجارت

برندسازی از اینستاگرام

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

۰۹

مرداد
تجارت, شبکه های اجتماعی

کسب درآمد از اینستاگرام

اینجا هیچ چیز غیرممکن نیست .  شما می‌توانید از فروش لباس‌های ساده شروع کنید و یا با خلاقیت و ذوق خود، دستبندهای ارزان‌قیمت درست کنید و با همین روش، آرام آرام پله‌های ترقی و درآمدزایی را طی کنید؛ بدون آنکه[…]

۲۵

اردیبهشت
برنامه نویسی وب, طراحی سایت

مراحل اخذ نماد اعتماد الکترونیکی

  نماد اعتماد الکترونیکی به‌عنوان مجوزی برای کسب‌و‌کارهای اینترنتی است و فروشگاه‌های اینترنتی برای قانونی کردن فعالیت‌های خود حتما باید نسبت به اخذ آن اقدام کنند. نماد اعتماد الکترونیکی نشانه‌ای است که از طرف مرکز توسعه تجارت الکترونیکی به فروشگاه‌های[…]