۹ تکنولوژی وب که باید بدانید

گردآوری و تالیف : ارسطو عباسی
تاریخ انتشار : 02 تیر 1397
دسته بندی ها : طراحی وب

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

من همیشه در رابطه با آخرین ابزارها و بهترین رویکردها هیجان زده هستم، به این دلیل که باور دارم ابزارهای جدید امروز می‌توانند به ابزارهایی با بیشترین استفاده در فردا تبدیل شوند. 

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

webcomponents

webcomponents.org/

ممکن است اصطلاح WebComponents را شنیده باشید، اما از اینکه به جزئیات آن نگاه کرده باشید شک دارم. WebComponents در واقع استایل‌های تازه‌ای برای HTML5 است که براساس استانداردهای موجود در W3C ایجاد شده است. 

این کامپوننت‌ها به شما اجازه می‌دهد که بتوانید المنت‌های سفارشی با قابلیت استفاده مجدد را در صفحات پویا داشته باشید. المان‌هایی مانند ویجت تب‌ها، اسلایدرهای تصویری و منوها. دیگر نیازی نیست که از ابتدا یک منو کشویی را ایجاد کنید. شما تنها نیاز دارید که از یک تگ در این کامپوننت استفاده کنید. 

در وبسایت اصلی این پروژه می‌توانید مثال‌های متفاوتی همراه با توضیحات بسیار مختصری را مشاهده کنید. همچنین اگر نتوانستید به خوبی با آن‌ها ارتباط برقرار کنید می‌توانید از طریق این راهنما نکات کاربردی را مشاهده کنید.

در چند سال گذشته این پروژه چندان تکمیل نیافته بود اما در حال حاضر می‌توان از آن به عنوان یک ابزار بسیار مناسب در کنار کارتان استفاده کنید. 

Polymer

Polymer

Polymer یک کتابخانه متن باز است که توسط تیم گوگل رهبری می‌شود. استفاده کردن از این تکنولوژی به شما کمک می‌کند تا بتوانید مراحل توسعه و استفاده از APIهای مختلف و موارد دیگری که ارائه می‌کند بسیار آسان‌تر شود. در این کتابخانه المان‌های داخلی نیز وجود دارد که می‌توانید از آن‌ها استفاده کنید. 

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

هدف Polymer این است که توانایی ایجاد ماژول‌ها را داشته باشد. شما می‌توانید ماژول‌های خودتان را ایجاد کنید. برای خواندن اطلاعات بیشتر و موارد جدید در نسخه ۳ آن به وبسایت Polymer مراجعه کنید. 

AMP

AMP

گوگل چند سال پیش تکنولوژي AMP را ایجاد کرد و هدف از این کار بهتر کردن تجربه کاربری کاربران در کاوش کردن اینترنت بود. با استفاده از پروژه AMP برگه‌های وبسایت شما در یک قالب با قابلیت خوانایی بالا قرار می‌گیرد و توانایی بارگذاری بسیار سریعی را دارد. 

شما تنها نیاز دارید که کدهایی را به وبسایت‌تان اضافه کنید و بعد از آن گوگل بقیه کارها را انجام می‌دهد. اگر وبسایت شما براساس AMP بهینه‌سازی شود همه چیز برای کاربران موبایل سریع‌تر بارگذاری می‌شود و تجربه‌ای شبیه به اپلیکیشن‌های موبایل را پیدا خواهند کرد. 

با در نظر گرفتن رشد بی اندازه کاربران موبایلی به نسبت دستگاه‌های دیگر به نظر می‌رسد که سوئیچ کردن به این پروژه ارزش بالایی دارد. استفاده از این تکنولوژی در وبسایت‌هایی با قابلیت‌های تعاملی بسیار بالا ممکن است درست نباشد اما برای وبسایت‌های خبری و وبلاگی که متن/تصویر و موارد مشابه را ارائه می‌دهند می‌تواند انقلابی در مصرف کاربران موبایل به وجود بیاورد.

Gulp 

Gulp

خودکارسازی یکی از کلیدی‌ترین راه‌ها برای کاهش زمان مصرف شده در انجام کارهای تکراری است. با استفاده از یک اجرا کننده وظایف مانند Gulp بسیار ساده است که بتوانید وظایف تکراری و آزار دهنده را به صورت خودکار انجام دهید و بتوانید روی کارهای مهم دیگری تمرکز کنید. 

Gulp می‌تواند فایل Sass شما را به CSS تبدیل کند، هک‌هایی را به کدهای‌تان اضافه نماید، برگه‌ها را پس از تغییرات بازسازی کند و... . شما می‌توانید کارهای بسیار بیشتری را با استفاده از Gulp انجام دهید. اگر در این رابطه مشتاق هستید، می‌توانید دوره آموزشی GulpJS را مشاهده کنید. 

TypeScript

TypeScript

فریمورک فرانت‌اند AngularJS در آخرین نسخه‌های خود به صورت کامل از زبان اسکریپت‌نویسی تایپ‌اسکریپت پشتیبانی می‌کند. پس اگر از طرفداران انگولار هستید باید این زبان را یاد بگیرید.

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

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

Three.js

Three.js

اگر تا به حال در دنیای طراحی وب مباحث WebGL و 2D/3D را دنبال کرده باشید پس مطمئنا نام Three.js را شنیده‌اید. این کتابخانه یکی از قدرتمندترین موارد برای گرافیک‌های مبتنی بر وب است که براساس یک موتور رندرینگ کار می‌کند. 

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

Three.js به صورت رایگان و متن باز ارائه شده و همچنین در کنار APIهای WebGL بهبود می‌یابد.

Docker

Docker

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

اما داکر جزو معدود پلتفرم‌هایی است که با آوردن قابلیت‌های مجازی‌سازی می‌تواند کل سیر توسعه شما را تغییر و بهبود دهد. اگر یک DevOps باشید مطمئنا با داکر کار کرده‌اید و یا کار باید بکنید.  

Ionic Framework

Ionic Framework

در حقیقت این تنها تکنولوژی موجود در این لیست است که مستقیما به دنیای وب مربوط نمی‌شود. اما این مورد مخصوص توسعه‌دهندگان وب است، افرادی که قصد دارند تا با استفاده از HTML/CSS/JS اپلیکیشن‌های نیتیو را ایجاد کنند. 

Ionic فریمورک متن باز و رایگانی است که برای ایجاد اپلیکیشن‌های آندروید و IOS ایجاد شده است. تمام اپلیکیشن‌های موجود در این فریمورک براساس کدهای سازگار با دنیای وب ایجاد شده، بنابراین شما می‌توانید اپلیکیشن‌های جاوااسکریپتی را بنویسید که در نهایت شبیه به اپلیکیشن‌های جاوا/سویفت است. 

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

کتابخانه‌های Zurb

کتابخانه‌های Zurb

برای چند سال من علاقه زیادی به Zurb و فریمورک قدرتمند فاوندیشن داشتم. در بروزرسانی‌های اخیر این ابزار شما با کتابخانه‌هایی همراه هستید که در نهایت می‌توانید روندهای کاری را طراحی و خودکار سازی کنید. یکی از این موارد Foundation for Emails نام دارد. 

یکی دیگر از موارد مناسب در این کتابخانه Motion UI نام دارد که برای ایجاد انیمیشن‌های مبتنی بر وب بسیار مناسب است. شما می‌توانید به صورت مستقل و یا همراه با کل پروژه فاوندیشن از این کتابخانه استفاده کنید. 

تمام کتابخانه‌های موجود در این فریمورک به صورت متن باز ارائه می‌شود و تیم توسعه آن به سختی در حال کار کردن برای بهتر نمودن آن هستند. 

منبع

مقالات پیشنهادی

منابع تازه برای طراحان و توسعه دهندگان وب - شهریور ۹۷

ه نظر می‌رسد با توجه به ابزار جدیدی که در طی ماه‌های اخیر منتشر شده‌اند، جامعه توسعه اخیرا فعال‌تر شده است. در این قسمت مجموعه‌ها، برخی موارد دیگر را...

وب سایت های الهام بخش برای طراحی - سری 9

امروز قصد داریم یک سری وبسایت های خارجی که بطور کاربردی ، زیبا و قدرتمند طراحی شدن رو براتون قرار بدیم تا شما بتونین با طریقه طراحی اونها آشنا بشین یا...

ده نکته کلیدی طراحی وب که کاربران باید بدانند و درک کنند

طراحی وب همیشه در حال تغییر است . هر روز تمایلات جدیدی ظهور می کند. به نظر می رسد الگوریتم های گوگل همیشه دیگران را مجبور به سازگار شدن با آنها میکنند...

سافاری 9 و هر آنچه که طراحان وب باید در مورد آن بدانند

بحث اصلی کنفرانس اخیر WWDC اپل پیرامون دو سیستم عامل جدید این شرکت بود . el capitan که نسخه ی جدید سیستم عامل میکینتاش است و ios9 . این دو سیستم عام...