فرادرسیادگیری طراحی و توسعه وب — پادکست پرسش و پاسخ
بسیاری از علاقه‌مندان به حوزه برنامه‌نویسی، تمایل دارند که وارد دنیای «طراحی و توسعه وب» شوند. این افراد، معمولا با پرسش‌هایی از این جنس مواجه هستند که یادگیری مهارت‌های طراحی و برنامه‌نویسی برای طراحی و توسعه وب را از کجا باید شروع کنند و بهتر است چه ابزارها، زبان‌ها و یا به طور کلی، چه مهارت‌هایی را برای برنامه نویسی وب بیاموزند. دکتر «سید مصطفی کلامی هریس»، در پادکستی که در ادامه آمده، ضمن پرداختن به تفاوت مفهوم طراحی وب و توسعه وب، چگونگی ورود به این حوزه‌ها و مهارت‌های لازم برای آن‌ها را مورد بررسی قرار داده است.
پادکست پیرامون یادگیری طراحی و توسعه وب
ذخیره کردن این فایل صوتی: لینک دانلود
نسخه نوشتاری
دوستی این پرسش را مطرح کرده‌اند که برای ورود به حوزه طراحی و برنامه نویسی وب، از کجا باید آغاز کنند. ابتدا باید به این نکته توجه داشت که «طراحی وب» (Web Design | وب دیزاین) و «برنامه نویسی وب» (Web Programming) و در واقع «توسعه‌دهندگی وب» (Web Development)، دو معقوله جدا از هم هستند. البته این مباحث اشتراکات و هم‌پوشانی‌هایی نیز با یکدیگر دارند و فردی که عضو تیم یک پروژه وب است، در صورتی که طراح است باید مقداری برنامه‌نویسی و اگر برنامه‌نویس است، مقداری طراحی بداند.
اما در حالت کلی، چیزی که در اینجا لازم است و تاکید زیادی روی آن می‌شود، فراگیری «اچ‌تی‌ام‌ال» (Hypertext Markup Language | زبان نشانه‌گذاری ابرمتنی) است. یادگیری «سی‌اس‌اس» (CSS | Cascading Style Sheets) نیز برای افراد علاقه‌مند به یادگیری طراحی وب و یا کسانی که در حال حاضر در این حیطه مشغول به کار هستند، اجباری است. اما تسلط کامل به CSS برای برای برنامه‌نویس‌ها اجباری نیست؛ زیرا قرار نیست این افراد طراحی وب را انجام بدهند. اما دانستن این مبحث و ارتباط آن با توسعه وب لازم است. اما تسلط بر اچ‌تی‌ام‌ال واقعا ضروری است و فرد باید با این ساختارها و به طور کلی چیستی ساختار فایل و چنین مواردی آشنایی داشته باشد.
البته، بخش دیگری نیز وجود دارد. افرادی که برنامه‌نویس هستند، باید با «چرخه حیات» (Life Cycle) ارتباط مشتری یا در واقع «کلاینت» و ارتباط کاربر با سایت و سرور‌آشنا باشند. حداقل، باید منطق حاکم بر این موضوع را بدانند. در واقع، قرار نیست آن را بسازند، ولی باید با آن آشنایی داشته باشند. مثالی از این موضوع، کلاس رانندگی است؛ در این کلاس‌ها، یک یا دو جلسه کلاس فنی برگزار می‌شود. در این کلاس‌ها، فراگیران مکانیک نمی‌شوند ولی با قطعات داخلی خودرو و عملکرد آن‌ها آشنا می‌شوند و از منطق حاکم بر این سیستم آگاه می‌شوند. به همین دلیل، آشنایی با این حوزه‌ها برای برنامه‌نویس‌ها و «توسعه‌دهنده‌های وب» (Web Developers) حائز اهمیت است.
این در حالی است که از سوی دیگر، «طراح‌های وب» (Web Designers) بعضا ممکن است که حتی نیاز به آگاهی از مباحث روانشناسی داشته باشند، زیرا بحث مربوط به طراحی «رابط کاربری» (User Interface | UI) و همچنین، «تجربه کاربری» (User Experience | UX) است. فرد برای فراگیری این موارد، باید مطالعه داشته باشد. البته، معمولا افرادی وجود دارند که در این رابطه مشاوره می‌دهند و دید لازم برای این موضوع را داشته باشند. ولی باید در نظر داشت که بخشی از کار طراحی وب، هنری و بخش دیگر آن روانشناسی است. یک بخش دیگر که حتی از این موارد نیز جلوتر محسوب می‌شود، آن است که چطور می‌توان کاربر را تحت تاثیر قرار دارد و چگونه می‌توان مثلا «نرخ تبدیل» (Conversion Rate) را بالا برد و چنین مسائلی. این موارد در بحث طراحی مستتر هستند. البته همه این کارها را طراح انجام نمی‌دهد؛ این مسئولیت بسیار بزرگ‌تری است، ولی اگر طراح این موارد را بداند، راحت‌تر می‌تواند با آن‌ها ارتباط برقرار کند.
در واقع، می‌خواهم بگویم این‌ها - طراحی و برنامه نویسی وب -دو چیز جدا از هم هستند، اما وجه مشترک آن‌ها در همان ابتدا، «اچ‌تی‌ام‌ال» است. هم طراح و هم توسعه‌دهنده باید واقعا HTML را به خوبی بدانند، در حالیکه فراگیری CSS برای برنامه‌نویس‌ها توصیه می‌شود و یادگیری آن ضرری ندارد؛ ولی طراح‌ها حتما باید به این حوزه تسلط کامل داشته باشند. از اینجا یک انشعابی روی «جاوا اسکریپت» (Java Script) وجود دارد و طراح‌ها نیز با مسائل مربوط به جاوا اسکریپت خیلی درگیر هستند زیرا بالاخره این مورد در سمت کاربر اجرا می‌شود و بنابراین، باید تسلط لازم روی جاوا اسکریپت و «کتابخانه‌های» (Libraries) آن و همچنین، انواع تکنولوژی‌هایی که در این حوزه موجود هستند، داشته باشند.
از سوی دیگر، بحث «اِیْ‌جکس» (Asynchronous JavaScript And XML | AJAX) و چنین مواردی نیز وجود دارد که یک توسعه‌دهنده وب باید آن‌ها را بداند؛ یعنی ارتباط با جاوا اسکریپت. ولی برنامه‌نویس به اندازه طراح وب با این موضوعات درگیر نیست و در این حد که بتواند رکوئست‌ها را پاسخ دهد و یا اقدام به ارسال رکوئست کند کافی است. اما در مورد موضوع برنامه‌نویسی وب و در واقع چیزی که سمت سرور (Server Side) است، یکی از بهترین زبانهای برنامه‌نویسی، برخلاف مخالفان زیادی که دارد، «پی‌اچ‌پی» (PHP) است.
پی‌اچ‌پی، همچنان پر استفاده‌ترین زبان برنامه نویسی در حوزه برنامه‌نویسی وب است. این زبان، خیلی خوب و روتین است و گاهی کار کردن با آن حقیقتا لذت‌بخش است. این زبان را من پیشنهاد می‌دهم، ولی افرادی که تمایل دارند از محصولات مایکروسافت استفاده کنند، می‌توانند «سی‌شارپ» (#C Sharp | C) را یاد بگیرند. ولی این بدین معنا نیست که اگر کسی سی‌شارپ یاد گرفت، برنامه‌نویسی برای وب را نیز آموخته است. نه؛ راه در اینجا طولانی‌تر است. سی‌شارپ کاربردهای گوناگونی دارد و یکی از آن‌ها، کاربرد در وب است. می‌توان پس از سی‌شارپ، راهکاری که مایکروسافت در حوزه وب دارد یعنی «ای‌اس‌پی‌دات‌نت» (ASP.Net) را فرا گرفت.
در صورت عدم تمایل به فراگیری زبانهای یاد شده، «پایتون» (Python) یک گزینه دیگر است و در صورت عدم علاقه به یادگیری پایتون، می‌توان از «جاوا» (Java) استفاده کرد. گزینه‌های گوناگون برای انتخاب وجود دارد، ولی پی‌اچ‌پی راحت‌ترین است. ولی در این میان، شخصا پی‌اچ‌پی را برای ورود به حوزه برنامه‌نویسی وب توصیه می‌کنم، زیرا بدون اینکه وقت زیادی از فرد گرفته شود، می‌تواند به سرعت وارد دنیای برنامه‌نویسی وب شود.
به هر حال، HTML را حتما باید فراگرفت. پس از آن، اگر علاقه‌مند به برنامه نویسی وب هستید، PHP را پیشنهاد می‌کنم و اگر به طراحی وب علاقه دارید، توصیه می‌شود که CSS را خیلی دقیق و خوب یاد بگیرید. همچنین، توصیه می‌شود که جاوا اسکریپت و کتابخانه‌های آن را یاد بگیرید و البته در کنار این، استاندارد‌های پیاده‌سازی را نیز بیاموزید. اما اگر از یک لایه بالاتر به این موضوع نگاه شود، قرار نیست که ما هیچ وقت چرخ را از ابتدا اختراع کنیم. بر همین اساس، هم برای افرادی که سمت سرور کار می‌کنند و توسعه‌دهنده «بک‌اند» (Back-End) هستند و هم برای افرادی که طراح «فرانت‌اند» (Front-End) هستند، «چارچوب‌هایی» (Framework) وجود دارد. مثلا سمت طراحی وب «توییتر بوت‌استرپ» (Bootstrap) می‌تواند کمک کند که طراحی‌ها سریع‌تر انجام شوند. همچنین، تم‌ها و قالب‌های گوناگونی نیز در آن هست که می‌توان آن‌ها را بهبود داد استفاده کرد.
چارچوب‌های دیگری نیز وجود دارند که کم و بیش معروف هستند و استفاده می‌شوند، ولی توییتر بوت‌استرپ معروف ترین آن‌ها است و استفاده از آن اغلب به افراد گوناگون پیشنهاد می‌شود. این چارچوب، رویکرد مستقیمی به موضوع طراحی نیز دارد که خوب است. در کنار این موضوع، بحث چارچوب‌هایی برای مثلا پی‌اچ‌پی را داریم که می‌توان یکی از آن‌ها را انتخاب و استفاده کرد. این چارچوب‌ها از نظر ساختار کلی خیلی شبیه به هم هستند، ولی طبیعتا تفاوت‌هایی نیز دارند. ولی بخش زیادی از این چارچوب‌ها واقعا مثل هم هستند و غیر از تغییر در واژگان، معمولا تغییر زیاد دیگری در آن‌ها مشاهده نمی‌شود.
مثلا از جمله مواردی که خیلی سبک است و می‌تواند به کاربر کمک زیادی کند، «کدایگنایتر» (CodeIgniter) و یا مثلا «فیوئل پی‌اچ‌پی» (FuelPHP) است که در ادامه کدایگنایتر ارائه و مجددا قطع تولید شد. امروزه «لاراول» (Laravel) بسیار پر طرفدار است و مورد استناد قرار می‌گیرد؛ در عین حال، «کیک پی‌اچ‌پی» (CakePHP) و «سیمفونی» (Symfony) نیز وجود دارند. «زِند» (Zend) نیز وجود دارد که کمی سنگین‌تر و نسبتا کم‌طرف‌دارتر است، ولی می‌توان از آن استفاده کرد.
یاد گرفتن این موارد موجب می‌شود که فرد توانایی بالاتری در پیاده‌سازی «برنامه‌های کاربردی وب» (Web Application) داشته باشد. به هر حال، این مورد، هر دو حالت را هم سمت طراح و هم سمت توسعه‌دهنده را اینطور باید در نظر گرفت که فرد به هر حال مجبور است وارد یک اکوسیستم شود، یک فرم‌ورک انتخاب کند و در آنجا کار کند و اصطلاحا نفس بکشد. این موضوعی است که باید برای مبدل شدن به یک طراح یا توسعه‌دهنده وب، به سمت آن حرکت کرد. منتها، ورود به آن، شرایط اولیه‌ای دارد که همانطور که پیش از این به آن اشاره شد، فراگیری اچ‌تی‌ام‌ال، سی‌اس‌اس، جاوا اسکریپت و حالا پی‌اچ‌پی است.
این موارد را می‌توان داشت. البته، برخی از افراد هستند که ترجیح می‌هند هر دو مبحث را با هم و به موازات هم به جلو ببرند. این مساله نیز اشکالی ندارد و برای پروژ‌های کوچک و کمی کمتر حرفه‌ای می‌شود این کار را انجام داد. ولی اگر فرد بخواهد کمی تخصصی‌تر باشد، این دو در یکجا واقعا قابل تجمیع نیستند مگر اینکه شما مدیر یک پروژه و حلقه اتصال بین دو تیم طراحان و توسعه‌دهندگان وب باشید. در آنجا پیگیری این دو به موازات یکدیگر لازم است؛ البته این مورد، نیاز به سال‌ها تجربه و خلاقیت دارد تا فرد بتواند حلقه وصل بین واحدهای فرانت‌اند و بک‌اند باشد. به هر حال، این توضیحات کلی بود که می‌شد در این حوزه ارائه داد. امیدوارم برای شما مفید واقع شده باشد. موفق باشید.
برای دانلود کردن و شنیدن دیگر پادکست‌های دکتر سید مصطفی کلامی هریس در مجله فرادرس، روی این لینک [+] کلیک کنید.
اگر نوشته بالا برای شما مفید بوده است، آموزش‌های زیر نیز به شما پیشنهاد می‌شوند:
- مجموعه آموزش‌های برنامه‌نویسی PHP
- آموزش برنامه‌نویسی PHP
- مجموعه آموزش‌های طراحی سایت
- درس مهندسی اینترنت — مفاهیم پایه به زبان ساده | منابع، کتاب و فیلم آموزشی
- آموزش مقدماتی jQuery — مجموعه مقالات جامع وبلاگ فرادرس
- زبان برنامه‌نویسی پایتون (Python) — از صفر تا صد
- ده زبان برنامه‌نویسی که باید در سال ۱۳۹۸ یاد بگیرید
- برنامه‌نویسی وب با پایتون — راهنمای کاربردی
^^
