طراحی سایت های تجاری
شرکت پیام آوا پردازش
اگر با جاوا اسکریپت آشنایی داشته باشید، و در طراحی سایت های خود از آن استفاده کرده باشید، می دانید که یک ماجراجویی است. بعد از تقریبا یک دهه از توسعه حرفه‌ای و آماتور در صنایع مختلف، من معتقدم که همه در مورد این نظریه موافق خواهند بود. پروژه های سمت کاربر، به برنامه نویسان آزادی انتخاب بیشتری می دهد، همچنین انعطاف‌پذیری و فضای زیادی برای خلاقیت می‌دهند ؛ اما در عوض آن‌ها نیاز به دانش، برنامه‌ریزی و مسئولیت به نوبه خود دارند. بعد از اتمام پروژه‌های جاوا اسکریپ با jQuery ، require.js ، Angulars ، ReactJs ، ExtJs ، و شاید پروژه های فراوان دیگر، که به یاد نمی‌آورم، من چیزهای غیرقابل‌تصوری را در پروژه های سمت کاربر(frontend) دیده ام، و همه ما احتمالا آن ها را انجام داده ایم.
اما همیشه برخی الگوهای رایجی وجود دارند، که حتی بر روی ناهماهنگ ترین پروژه‌ها عمل می کنند. در این مقاله لیستی از حیاتی ترین این الگوها را معرفی می کنیم، که از تجربه فردی افراد به دست آمده است. مواردی که در این مقاله بیان می شود، باید مورد استفاده قرار گیرند، اگرچه من معتقدم بسیاری از توسعه دهندگان باتجربه ممکن است موافق آن ها باشند. این الگوها اساس پایدار برای یک پروژه، با هر چارچوب، هر روش، و هر اندازه تیمی می باشد. امیدوارم که امروز چیز جدیدی یاد بگیرید، آن را مفید بیابید، و با استفاده از مطالب این مقاله یک چیز شگفت انگیز درست کنید.
تقسیم و غلبه به معنی جدا کردن فایل های جاوا اسکریپت از یکدیگر می باشد، بیشتر ما اصطلاح تقسیم و غلبه را در جایی شنیده‌ایم، اما به نظر می‌رسد که بسیاری افراد این قانون را دست‌کم می‌گیرند. CommonJS ,Webpack ,NodeJS به ما توانایی این را می دهند، که بتوانیم فایل مربوط به کد ها را از یکدیگر جدا کنیم، پس چرا به آن ها اهمیت نمی دهیم؟ در مبحث تقسیم و غلبه ما ۲ موضوع زیر را مورد بررسی قرار می دهیم:
هر متغیر، تابع، یا فایلی زمان شما را می‌گیرد؛ آن‌ها را طوری نامگذاری می‌کنید که انگار دارید نوزاد خود را نامگذاری می‌کنید. شما ممکن است با نامیدن متغیر”x”زمان ۰٫۳ ثانیه در روز صرف کنید، اما در یک ماه شما ۲ روز وقت صرف خواهید کرد تا بفهمید چه معنایی دارد، سپس ۴ نفر دیگر در اصلاح کردن آن وقت می گذارند. به جلو فکر کنید، و از اسم‌های طولانی نترسید. از هک کردن و چیزهایی که باعث می‌شوند شما فکر کنید مستقیما به MIT(موسسه فناوری ماساچوست) متصل می شودی، خودداری کنید. راه‌حل شما ممکن است با درایت و پیچیده باشد، و گاهی مربوط به زمانی در آینده شما، یا یک نفر در تیم تان باشد، روی آن توافق کنید و سپس یک تکه بزرگ از زمان را صرف تلاش برای مشخص کردن آنچه در این کد اتفاق می‌افتد کنید. بر روی ایجاد چیزهای ساده، بدون نیاز به مستند سازی، تمرکز کنید.
اعداد و رشته‌های جادویی خود را حل کنید، این مرحله نیز مانند مرحله نام گذاری است؛ هر چند ممکن است وسوسه‌انگیز باشد، اما از اعداد و یا رشته‌های جادویی در کدهای خود استفاده نکنید. مهم نیست که چقدر مقدار آن کوچک یا غیر عادی به نظر می‌رسد، آن را درون یک متغیر با یک نام معنی‌دار قرار داده و به بالای محدوده کد خود انتقال دهید. اغلب اوقات، هر مقدار مشخصی که شما وارد کد می کنید، دوباره در جای دیگری استفاده خواهد شد. قرار دادن اعداد و رشته های شما در متغیرهای درست، تکرار کد را کاهش داده، و تنظیمات را ساده‌تر می‌کند، همچنین این کار می تواند به مقادیر شما معنا بخشد.
اگر کد شما فراتر از ۱۲۰ کاراکتر به سمت راست برود، یا فراتر از ۵۰۰ خط به پایین حرکت کند، یا اگر توضیحات شما ۳ سطح عمیق دارد، نهایت تلاش خود را بکنید که آن را تقسیم کنید. شما می توانید این شرایط را حل کنید، پیچیدگی کد ها را با تقسیم آن ها در فایل های جداگانه، اگر توضیحات شما زیاد است، آن را در توابع مختلف، وعده ها، یا شواهد عینی تقسیم کنید. اگر از فراخوانی های ناهماهنگ زیادی استفاده می کنید، هماهنگ سازی می تواند کد های شما را آسان تر سازد.
اگر برنامه شما از ارزش‌های سراسری، نقاط انتهایی API(رابط کاربردی برنامه نویسی)، یا نمایش ویژگی ها استفاده می‌کند، آن‌ها را در یک فایل پیکربندی جداگانه قرار دهید. تعدادی از بسته‌ها وجود دارند، که به مدیریت پیکر بندی ها کمک می‌کنند. در برخی موارد برنامه شما هم روی سرور و هم روی لوکال هاست برای توسعه در دسترس خواهد بود . ایجاد فایل پیکربندی اولیه بسیار آسان‌تر از ساخت آن در مراحل بعدی است، و به شما اجازه می‌دهد تا موارد زیر را تنظیم کنید:
احتمالا بار ها دیده اید، که چهار چوب های جاوا اسکریپت مورد استفاده قرار می گیرد، شاید به خاطر این است که اغلب افراد آن ها را می شناسند، یا آن ها از محبوبیت بین مردم برخوردار است. زمان خود اختصاص دهید به این که، ببینید چه چهار چوبی مناسب پروژه شما می باشد، و کدام یک از این چهار چوب ها باید وجود داشته باشد. اگر وب سایت شما در چارچوبی ایجاد شود که ۱۰۰/۰۰۰ ستاره در سایت Github دارد، کاربر نمی‌تواند نسبت به این فریم ورک بی تفاوت باشد. از روی تجربه، من چارچوب‌ها و کتابخانه‌ها را به صورت زیر انتخاب می‌کنم:
با لیست ارائه شده از چهار چوب های جاوا اسکریپت، تنها مانند یک پیشنهاد رفتار کنید، زمان بگذارید و تصمیم بگیرید، کدام چهار چوب می تواند بهترین اثر را برای پروژه شما خلق کند.
آزمایش واحدها،و بخش های مختلف کدهای خود را فراموش نکنید، تا آخرین مرحله این تست ها را انجام دهید و از سالم بودن آن ها، اطمینان حاصل کنید. مگر این که فقط یک نمونه اولیه وجود داشته باشد، که به زودی بازنویسی خواهد شد. با افزایش پیچیدگی، حفظ و کنترل کد های شما سخت‌تر خواهد شد، تست این کار را برای شما انجام خواهد داد. ممکن است شما در آینده، با یک مشکل فنی در کد های خود، مواجه شوید،در آن زمان از خود برای انجام تست‌ها تشکر می کنید، همان گونه که شما هرگز درک نمی‌کردید، پس از آن که شما ویژگی های جدیدی به برند خود را اضافه کردید، چقدر نام تجاری شما دچار تحول شد.
مهم نیست پروژه جاوا اسکریپت شما از چه نوعی باشد، ممکن است یک نمونه اولیه باشد، مقیاس کاملی از برنامه وب تجاری باشد، یا یک پروژه فرعی کوچک، از همان لحظه که اولین خط کد را یادداشت می‌کنید، از گیت یا هر کنترل نسخه دیگری استفاده کنید. گیت یک نرم افزار کنترل نسخه است، که به شما اجازه می دهد نسخه های مختلفی از پروژه خود را داشته باشید، این نرم افزار همچنین گزارشی از تغییرات به وجود آمده روی پروژه را به شما ارائه می دهد.
کنترل نسخه به شما این امکان را می‌دهد، که از طریق زمان سفر کنید، از عناصر شکسته محافظت کنید، و تغییرات معرفی شده در گذشته را ببینید. اگر چیزی وجود دارد که شما لازم باشد از این مقاله بیاموزید، اصول اولیه کنترل نسخه، و استفاده از آن به صورت روزانه است. چرا ؟ چون حتی اگر بقیه نسخه ها را نادیده بگیرید، و به طور تصادفی در راه اشتباه کنید، با نسخه کنترلی که می‌توانید آن را اصلاح کنید، بدون استفاده از گیت، شما معمولا محکوم به شروع کار هستید.
به عنوان توسعه دهندگان فرونت اند، ما معمولا با دو چالش مهم مواجه می‌شویم، نمایش و ذخیره داده ها! بعد از گذشت زمان، نگهداری داده ها ممکن است انجام نشود، چون آن قدر راحت است که آن را نادیده می گیریم، این جریان تا جایی پیش می رود که، پروژه شما چند ماه بعد تبدیل به یک پروژه غیر قابل نگهداری می شود. مدیریت موقعیت در پروژه های جاوا اسکریپت، دشوار است. زیرا برنامه‌های ما باید معمولا با آن چه مشتری بر روی صفحه نمایش می‌بیند، و آن چه سرور در پایگاه‌های داده ذخیره کرده‌است، هماهنگ باشند. هدف ما افزودن هیچ پیچیدگی بیشتر در ساختار جاوا اسکریپت نیست. مولفه‌ها باید همان مجموعه داده را تحویل دهند، که با تغییرات به وجود آمده توسط کاربر، هماهنگ باشد، و نسبت به هر گونه تغییر در سرور واکنش نشان دهد. چگونه می‌توانیم این مسائل را حل کنیم؟ در پاراگراف های زیر راه حل هایی برای هر نوع چهارچوبی که نا برده شد، آورده شده است:
