بایگانی دسته‌ی: طراحی وب

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

فرانت کار چیست؟

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

تمام آنچه در یک سایت مشاهده می کنید و تعاملاتی که با آن دارید را فرانت اند فراهم می کند. به عبارت دیگر، یک فرانت کار نتیجه کار بخش سرور را به شکل مناسب به کاربر نمایش می دهد.

تفاوت FRONT END  و BACK END چیست؟

یکی از ابهامات بسیار رایجی که در این زمینه وجود دارد این است که front end چه تفاوتی با back end دارد؟ بک اند به افرادی گفته میشود که با زبان های برنامه نویسی مختلف از جمله php و asp قابلیت های گوناگون را برای یک سایت پیاده سازی می کنند. این افراد تنها بر روی سرور کار می کنند و با دیتابیس و محاسبات سروکار دارند. بک اند در پشت صحنه حضور دارد و با کاربر سروکار نخواهد داشت. اما فرانت اند مانند بازیگران یک تئاتر یا فیلم هستند که نتیجه کار بک اند را نمایش می دهند.

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

مهارت های فرانت کار چیست؟

مساله بسیار مهم بعدی که باید به آن پرداخته شود این است که مهارت های یک فرانت کار چیست؟ برای فرانت اند دولوپر شدن به چه مهارت هایی باید تسلط داشته باشیم؟ آیا front end نیاز به برنامه نویسی دارد؟ برخلاف تصور برخی از افراد تازه کار، فرانت اند نیز به برنامه نویسی احتیاج دارد. چون نیروی فرانت اند باید بتوانید با تسلط پیدا کردن بر زبان های برنامه نویسی متعدد از جمله جاوا اسکریپت، html، css تسلط داشته باشد.

علاوه براین، برای موفقیت در فرانت کار شدن، بهتر است به نرم افزارهای گرافیکی نیز تسلط داشته و قادر به ارائه آزمون های متعدد A/B باشید. یک فرانت کار باید بتواند با آزمون و تست های متعدد نتیجه حالت های مختلف کار را بررسی و در نهایت منجر به بهبود UX شود. البته به این نکته نیز باید اشاره شود که رابط کاربری و ظاهر یک سایت همیشه توسط فرانت اند دولوپر طراحی نمیشود. بلکه این کار توسط یکی از افراد متخصص در UI و طراحی رابط کاربری با فتوشاپ و فیگما و نمونه های مشابه انجام شده و فرانت اند بر اساس طرح آنها خروجی را پیاده سازی می کند.

ارتباط سئو و فرانت کار چیست؟

بدون شک هدف از راه اندازی یک سایت جذب مخاطب و کاربر می باشد و موتورهای جستجو بیشترین ترافیک را می توانند به سمت آنها هدایت کنند. به همین دلیل نمی توان از سئو سایت غافل شد و در ابتدایی ترین مراحل طراحی سایت نیز باید به آن توجه داشت. حال سوال این است، ارتباط سئو و فرانت کار چیست؟ آیا این دو به هم ارتباط دارند؟ لازم به ذکر است که بخش مهمی از سئو به رعایت استانداردها در مرحله طراحی ارتباط دارد. به عنوان مثال، سایت هایی که واکنش گرا نباشند از نظر گوگل استاندارد نبوده و تاثیر منفی بر سئو خواهد داشت.

واکنش گرایی و بسیاری از مشکلات مربوط به چیدمان و ظاهر سایت و حتی سرعت آن به فرانت اند ارتباط دارد. به همین دلیل است که فرانت کار اهمیت زیادی در یک تیم طراحی سایت داشته و عدم تخصص آنها منجر به ضررهای مالی جدی خواهد شد.

فرانت اند همان Ui designer است؟

از دیگر ابهاماتی که وجود دارد این است که آیا UI designer همان فرانت اند کار است؟ ui دیزاینر فردی می باشد که به نرم افزارهای گرافیکی تسلط داشته و با شناخت استانداردها ظاهر یک سایت را بدون کد نویسی ارائه می دهد. پس از طراحی ظاهر سایت فایل psd آن در اختیار فرانت اند قرار گرفته و با کد نویسی پیاده سازی شده و برای کاربر نمایش داده میشود.

بازار کار فرانت اند چطور است؟

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

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

آموزش زبان های برنامه نویسی Fornt End

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

در این پست به آموزش ساخت سبد خرید در PHP خواهیم پرداخت . این برنامه کاربردی عمدا ساده و تا حد امکان کوچک درنظر گرفته شده است. شما می توانید آن را دانلود کرده و برای نیازهایتان شخصی سازی (customize) کنید. در این مثال، ما فهرستی را از محصولات پایگاه داده را نمایش می دهیم. در مورد هر محصول می توانیم مقدار و اندازه آنرا انتخاب کرده و به سبد خرید اضافه کنیم. اقلام سبد خرید در نشست ذخیره می گردند. با حذف آیتم های هر نشست ، می توانید سبد خرید را خالی کنید.

آموزش ساخت سبد خرید در PHP

افزودن محصولات مختلف به سبد خرید

اول از همه ، باید با خواندن فهرست محصولات خود از پایگاه داده ، صفحه کاتالوگی از محصولات ایجاد کنیم. کد زیر ، فهرست محصولات پایگاه داده را بازیابی کرده و آنها را بصورت یک نمای گرید نمایش می دهد. هر محصول دارای گزینه «اضافه کردن به سبد خرید» برای گنجانیدن آن در سبد خرید می باشد.

<?php
$product_array = $db_handle->runQuery("SELECT * FROM tblproduct ORDER BY id ASC");
if (!empty($product_array)) { 
foreach($product_array as $key=>$value){
?>
<div class="product-item">
	<form method="post" action="index.php?action=add&code=<?php echo $product_array[$key]["code"]; ?>">
	<div class="product-image"><img src="<?php echo $product_array[$key]["image"]; ?>"></div>
	<div><strong><?php echo $product_array[$key]["name"]; ?></strong></div>
	<div class="product-price"><?php echo "$".$product_array[$key]["price"]; ?></div>
	<div><input type="text" name="quantity" value="1" size="2" /><input type="submit" value="Add to cart" class="btnAddAction" /></div>
	</form>
</div>
<?php }} ?>

با کلیک نمودن بر روی دکمه «افزودن به سبد خرید»، شناسه محصول انتخاب شده و با تعیین مقدار محصول ، می توانیم آن را به سبد خرید اضافه می کنیم. برای ذخیره آیتم ها در سبد خرید از PHP SESSION استفاده می کنیم. کد زیر گزینه دیگری را نشان می دهد که برای اضافه کردن محصولات به سبد خرید مورد استفاده قرار می گیرد. اگر چندین بار یک محصول را به سبد خرید اضافه کنیم، مقدار آیتم مورد نظر افزایش خواهد یافت.

case "add":
	if(!empty($_POST["quantity"])) {
		$productByCode = $db_handle->runQuery("SELECT * FROM tblproduct WHERE code='" . $_GET["code"] . "'");
		$itemArray = array($productByCode[0]["code"]=>array('name'=>$productByCode[0]["name"], 'code'=>$productByCode[0]["code"], 'quantity'=>$_POST["quantity"], 'price'=>$productByCode[0]["price"]));
		
		if(!empty($_SESSION["cart_item"])) {
			if(in_array($productByCode[0]["code"],array_keys($_SESSION["cart_item"]))) {
				foreach($_SESSION["cart_item"] as $k => $v) {
						if($productByCode[0]["code"] == $k) {
							if(empty($_SESSION["cart_item"][$k]["quantity"])) {
								$_SESSION["cart_item"][$k]["quantity"] = 0;
							}
							$_SESSION["cart_item"][$k]["quantity"] += $_POST["quantity"];
						}
				}
			} else {
				$_SESSION["cart_item"] = array_merge($_SESSION["cart_item"],$itemArray);
			}
		} else {
			$_SESSION["cart_item"] = $itemArray;
		}
	}
break;

حذف یا پاکسازی آیتم ها از سبد خرید

در این قسمت آموزش ساخت سبد خرید در PHP ، به کاربران اجازه می دهیم تا با استفاده از لینک «حذف آیتم» در هر ردیف ، بتوانند آیتم ها را از سبد خرید حذف کنند. همچنین، به کاربران این توانایی را می دهیم با استفاده از گزینه “تخلیه سبد ” ، کل سبد خرید را پاکسازی کنند. به منظور پاکسازی آیتم خاصی از دوره زمانی خرید ، با کلیک کردن روی «حذف آیتم» می توانیم عمل پاکسازی را با توجه به کد آیتم انجام دهیم. می توانیم از تابعPHP  ()unset  برای پاکسازی نشست در سبد خرید استفاده می کنیم.

case "remove":
	if(!empty($_SESSION["cart_item"])) {
		foreach($_SESSION["cart_item"] as $k => $v) {
			if($_GET["code"] == $k)	unset($_SESSION["cart_item"][$k]);				
			if(empty($_SESSION["cart_item"])) unset($_SESSION["cart_item"]);
		}
	}
break;
case "empty":
	unset($_SESSION["cart_item"]);
break;

کد زیر گزینه های مورد استفاده برای “حذف آیتم ” و عمل ” پاکسازی سبد” را نشان می دهد. برای ایجاد جدولی از محصولات ، SQL ذیل را وارد کرده و داده های خود را برای نمایش در صفحه کاتالوگ خود بارگذاری کنید.

CREATE TABLE IF NOT EXISTS `tblproduct` (
  `id` int(8) NOT NULL AUTO_INCREMENT,
  `name` varchar(255) NOT NULL,
  `code` varchar(255) NOT NULL,
  `image` text NOT NULL,
  `price` double(10,2) NOT NULL,
  PRIMARY KEY (`id`),
  UNIQUE KEY `product_code` (`code`)
)

دانلود پروژه آموزش ساخت سبد خرید در PHP

دانلود پروژه

لینک های مرتبط :

کلاس طراحی وب مشهد

دوره آموزش Android