برنامه نویسی وب را از کجا شروع کنم؟ (قسمت دوم)

برنامه نویسی وب را از کجا شروع کنم؟ (قسمت دوم)

در قسمت قبل در مورد نحوه ی کار فضای وب و دو قدم اول در مسیر توسعه ی وب صحبت کردیم.

1. نحوه ی کار فضای وب را یاد بگیرید.
2. مباحث پایه ای را به طور کامل فرا بگیرید.
3. با انواع مختلف برنامه های وب آشنا شوید.
4. یک فریم ورک Front-end انتخاب کنید.
5. توسعه ی سمت سرور (Back-end) را فرا گیرید.
6. مسائل پایه ای را به صورت عمقی یاد بگیرید.
7. اکوسیستم توسعه ی وب را بررسی کنید.
8. با مفاهیم جدید و پیشرفته سر و کار داشته باشید.

در این قسمت می خواهیم 6 مورد باقی مانده را بررسی کنیم.

3. با انواع مختلف برنامه های وب آشنا شوید

بله، توسعه ی وب به زبان ساده یعنی ساختن وب سایت اما وب سایت با اپلیکیشن تحت وب (web app) چه تفاوتی دارد؟ اگر بخواهیم به زبان ساده صحبت کنیم سه نوع وب سایت در دنیای وب وجود دارد:

• وب سایت های ایستا (static یا استاتیک): این نوع از وب سایت ها ساده ترین نوع وب سایتی هستند که می توانید بسازید. در این حالت تنها کدهای HTML و CSS در سمت سرور ذخیره شده و در هنگام بازدید کاربر به او ارسال می شود. در این نوع از وب سایت ها کاربر تعاملی با وب سایت ندارد و در هیچ صفحه ای تغییری ایجاد نخواهد شد (مگر تغییرات بسیار جزئی). این نوع از وب سایت ها همیشه و برای تمام افراد به شکل یکسان نمایش داده خواهند شد و چیزی به نام «شخصی سازی» در آن ها کاملا بی معنی است. این نوع از وب سایت ها ممکن است دارای کدهای جاوا اسکریپت باشند.
• وب سایت های پویا (dynamic): در این نوع از وب سایت ها کدهای HTML بر اساس هر درخواست به کاربر مربوطه ارسال می شود. این کدهای HTML در سمت سرور ساخته می شوند و لزوما به صورت کد آماده شده از قبل نیستند. واضح است که جاوا اسکریپت نیز می تواند جزئی از اجزای سازنده ی این وب سایت ها باشد.
• SPA ها: در این نوع از وب سایت ها کاربر تنها یک صفحه HTML ساده به علاوه ی مقداری کد CSS و جاوا اسکریپت دریافت می کند. سپس به جای اینکه کدهای HTML به صورت پویا در سمت سرور ساخته شوند، کدهای جاوا اسکریپت همان تک صفحه ی HTML را بارها و بارها تغییر داده و صفحات خیالی مختلفی ایجاد می کنند. این نوع برنامه ها در اصل چند صفحه ای نیستند (فقط همان فایل HTML است که مرتبا تغییر می کند) به همین خاطر Single Page Application (برنامه های تک صفحه ای) نامیده می شوند.

من قبلا در مقاله ی «تفاوت بین Website و Web Application چیست؟» این مسئله را از نقطه ی نظر دیگری بررسی کرده بودم و تفاوت بین وب سایت و برنامه ی تحت وب را بدین شکل توضیح داده بودم: به طور مثال اگر یک رستوران بخواهد وب سایتی بسازد که در آن منوی خود را داشته باشد، تخفیف های مناسبتی را اعلام کند، گالری تصاویری از انواع غذاهایش ارائه بدهد و آدرس رستوران را نیز نمایش داده باشد می توانیم نامش را یک وب سایت بگذاریم چرا که به جز مقداری کد HTML و CSS و مقدار کمی جاوا اسکریپت، نیازی به کار دیگری نیست اما اگر همین رستوران وب سایتش را طوری طراحی کند که قابلیت سفارش آنلاین، شخصی سازی سفارشات، پرداخت آنلاین، ردیابی پیک رستوران در نقشه، سیستم امتیاز دهی و … را داشته باشد، می توانیم به آن یک برنامه ی تحت وب یا web application بنامیم.

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

4. یک فریم ورک Front-end انتخاب کنید

در مرحله ی بعد باید به فکر انتخاب یک فریم ورک باشیم!

سوال: مگر با کدهای عادی و خام HTML و CSS و جاوا اسکریپت نمی توان برنامه های خوبی ساخت؟

پاسخ: البته که می شود اما هر «شدن» ای بهینه نیست! اولا که توسعه با استفاده از کدهای خام بیشتر از فریم ورک ها زمان می برد. دوما توسعه با کدهای خام احتمال داشتن باگ و خطاهای بیشتری دارد. سوما اکثر شرکت ها و مجموعه هایی که شما را استخدام می کنند از شما می خواهند که حداقل با یکی از فریم ورک های مطرح آشنا باشید بنابراین آینده ی شغلی شما نیز به آن وابسته است. به همین دلیل فریم ورک ها را نادیده نگیرید.

در حال حاضر سه فریم ورک مطرح برای توسعه ی Front-end وجود دارد:

• React (البته از نظر فنی React یک کتابخانه است نه فریم ورک اما می توان این مسئله را نادیده گرفت). React توسط فیسبوک توسعه و نگهداری می شود.
• Angular که توسط گوگل توسعه و نگهداری می شود.
• Vue که توسط گروهی از توسعه دهندگان به رهبری آقای Evan You به صورت open-source توسعه و نگهداری می شود.

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

5. توسعه ی سمت سرور (Back-end) را فرا بگیرید

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

• انتخاب و یادگیری یک زبان برنامه نویسی سمت سرور (PHP یا NET یا Python یا Java یا Node.js و...)
• انتخاب و یادگیری یک فریم ورک برای آن زبان (مانند Laravel یا Express یا Django یا ...). استفاده از فریم ورک ها در سمت سرور بسیار مهم تر از استفاده از آن ها در Front-end است چرا که در سمت سرور محاسبات دقیقی داریم و هر اشتباه ممکن است به نابود شدن یا هک شدن سایت، افشای اطلاعات محرمانه، ضرر های مالی فراوان و... بینجامد.
• انتخاب و یادگیری یک پایگاه داده برای ذخیره ی اطلاعات کاربران و قسمتی از محتوای سایت خود.

مشهورترین زبان های برنامه نویسی Back-end در حال حاضر PHP و ASP.NET و Node.js هستند و انتخاب این زبان ها یا فریم ورک های مرتبط با این زبان ها بر عهده ی شما است. همیشه به یاد داشته باشید که نمی توان یک زبان را به عنوان زبان برتر و بهتر انتخاب کرد بلکه برای اکثر وب سایت های کوچک و حتی بزرگ نوع زبان انتخاب شده اهمیتی ندارد. از نظر بازار کار نیز PHP و Node.js از دیگران جلوتر هستند.

همچنین برای انتخاب پایگاه داده نیز نیاز به جستجو و تحقیق خواهید داشت. دو مورد از مشهور ترین پایگاه های داده برای طراحی وب MySQL و MongoDB هستند که شهرت خاصی دارند.

6. مسائل پایه ای را به صورت عمقی یاد بگیرید

تا اینجای کار درک عمیقی نسبت به دنیای وب به دست آورده اید. حالا زمان آن رسیده است که وارد مسائل فنی و جزئی شوید. ما در قدم دوم با مباحث پایه ای به طور کامل آشنا شدیم اما حالا نوبت ورود به جزئیات آن ها است. به طور مثال به شبکه ی توسعه دهندگان موزیلا (MDN) رفته و توابع جاوا اسکریپتی که قبلا یاد گرفته اید را به دقت بررسی کنید. در اکثر اوقات نکاتی جزئی و ریز باقی مانده است و شما اصلا از آن ها خبر ندارید. این نکات جزئی و ریز همان تفاوت بین برنامه نویسان با تجربه و موفق و برنامه نویسان تازه کار هستند. یا به طور مثال سری به نسخه های بعدی جاوا اسکریپت (مثلا ES6) بروید و آن ها را مطالعه کنید. همچنین اگر از یک فریم ورک استفاده می کنید به Documentation این فریم ورک ها سر بزنید و توضیحات وب سایت رسمی اش را مطالعه کنید. بسیاری از اوقات در این زمینه نیز مسائلی جزئی باقی مانده اند که نیاز به توجه شما دارند.

7. اکوسیستم توسعه ی وب را بررسی کنید

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

• انتخاب IDE و یادگیری کار در محیط آن: IDE ها محیط های توسعه ی یکپارچه هستند که به شما کمک می کنند فرآیند توسعه را شدیدا سرعت ببخشید و در عین حال از خطاهای ساده جلوگیری کنید. بر اساس نظر سنجی وب سایت بزرگ Stackoverflow در حال حاضر مشهور ترین IDE یا ویرایشگر کد برای توسعه ی وب VSCode ماکروسافت می باشد.
• یادگیری فرآیند Debug برنامه ها و ابزارهای آن: اشکال زدایی (debug) برنامه ها یکی از مهم ترین ابزار های یک توسعه دهنده است، حتما آن را یاد بگیرید. ساده ترین و البته مهم ترین ابزار شما Chrome DevTools است که راهنمای آن را در صفحه ی توسعه دهندگان گوگل پیدا خواهید کرد.
• آشنایی با Git و GitHub: این دو ابزارهایی برای مدیریت کدهای شما هستند و بهتر است در طول زمان با آن ها آشنا شوید. من یک سری مقالات خلاصه را در مورد این دو نوشته ام که می توانید آن ها را برای شروع مطالعه کنید.
• با ابزارهای پیشرفته تر مانند Babel و Webpack آشنا شوید. هر کدام از این ابزارها دنیای خودشان را دارند و نمی توان به طور کوتاه آن ها را توضیح داد.

8. با مفاهیم جدید و پیشرفته سر و کار داشته باشید

دنیای توسعه ی وب بسیار پیچیده تر از آن است که با معرفی چند ابزار ساده تمام شود. امروزه تکنولوژی هایی مانند PWA ها (مخفف Progressive Web App) پا به دنیای وب گذاشته اند. همچنین از طرفی Cross-platform Apps (برنامه های مستقل از پلتفرم) را داریم که با استفاده از آن ها می توانید کدهای خود را (بدون دانش برنامه نویسی موبایل) به یک اپلیکیشن موبایل (اندروید و ios) تبدیل کنید. از مشهورترین این ابزارها می توان به Ionic و React Native و NativeScript اشاره کرد. همچنین آشنایی با انواع متدهای جدید بهینه سازی کد به شما کمک خواهد کرد. حتی امروزه شاهد توسعه ی بدون سرور (Serverless Development) هستیم.

این دنیا دنیای بسیار بزرگی است، انتهای راه فقط قدرت تخیل شما است!