Web Development در سال جدید: چه چیزهایی باید بدونیم؟

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

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

این مقاله‌ی نسبتا طولانی هست، پیشنهاد می‌کنم یه چایی/قهوه برای خودتون دم کنید و آروم آروم بخونید، خیلی چیزها هست که میخوایم بررسی کنیم و راجع بهشون حرف بزنیم ?

بِرَد تراورسی (Brad Traversy) یکی از مدرسین محبوبم در زمینه آموزش توسعه وب، به تازگی ویدیویی منتشر کرده که در اون ابزارها و مباحثی که حس می‌کنه یک توسعه دهنده‌ی وب خوبه که باهاش آشنا باشه رو مرور میکنه.

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

توسعه وب در سال جدید: چه چیزهایی باید بدونیم؟

هدف اصلی توی این ویدیو اینه که به توسعه دهنده‎ی وب، یک آشنایی کامل با ابزارهای پرکاربرد و پررونق توی این حوزه رو بده.

" سعی‌ام این نیست که شمارو با تکنولوژی‌های مختلف غرق کنم... اینا انتخاب‌هاییه که میتونید داشته باشید... واقعیت اینه که تکنولوژی‌های ( ابزارهای ) خیلی زیادی وجود داره؛ دلم می‌خواد وقتی مثلا اسم Nuxt یا Gatsby رو شنیدید بدونید که اون چیه.. که بعدش بتونید تصمیم بگیرید میخواید یاد بگیرینش یا نه ... "

در وهله‌ی اول بِرَد این موضوع رو مطرح می‌کنه که از خودتون بپرسید که می‌خواید چیکار کنید ( چی کاره بشید؟ ) میخواید توی یه شرکت تولید محصول کار کنید؟ یا به عنوان مشاور کار کنید؟ یا حتی فریلنسر بشید؟ یا برای خودتون بیزینسی راه بندازید؟

اکثر نظرها و پیشنهادهایی که برد میده آخرش به این ختم میشه که باید با توجه به هدفی که دارید مسیر و ابزار رو انتخاب کنید.

در شروع ویدیو، توصیه اولش یادگیری چیزهایی که خودش اسمشون رو گذاشته "ضروریات"

یک نکته‌ای که به وضوح مشخصه: هیچ نیازی به یک کامپیوتر خیلی عجیب و غریبی ندارید.

" .. برعکسه شاید توسعه‌دهنده‌هایی که توی زمینه ساخت بازی یا اینجور چیزها کار میکنند، شما نیازی به یه کیس بالارده‌ عجیب و غریبی ندارید، یه لپ تاپ یا کیس میان رده یا حتی پایین رده هم میتونه اکثر کارها رو انجام بده.."

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

نظرش اینه که با HTML , CSS یادگیری شروع بشه و بعد ابزارهای جدید CSS مثل Flexbox , Grid یاد گرفته بشند. از نظرش یادگیری ساخت یک وبسایت ریسپانسیو یکی از ضروریات اصلی سال جدید هستند.

" .. هر پروژه‌ای که کار می‌کنید باید روی تمام دستگاه‌ها ( کامپیوتر، موبایل، تبلت و.. ) خوب نمایش داده بشند ..

بجای تکیه روی فریمورک‌های CSS مثل Bootstrap، توصیه می‌کنه که بهتره یاد بگیرید چطور برای خودتون ماژول و کامپوننت CSS تعریف کنید. Bootstrap یا فریمورک‌های دیگه رو می‌تونید هرزمان که دارید روی یک پروژه برای مشتری کار می‌کنید یاد بگیرید.

یکی از فریمورک‌های متفاوت CSS که بطور مشخصی بهش اشاره می‌کنه Tailwind ـه؛ تمرکز اصلی این فریمورک روی استفاده از ' utility classes ' هاست که با استفاده ازشون می‌تونید به شکلی که خودتون میخواید صفحه رو طراحی کنید.

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

به شکل کاربردی/بهینه یاد بگیرید

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

یکی از جالب‎ترین نکاتی که میگه اینه:

" .. برای یک وبسایت کوچیک لازم نیست که بخواد DevOps و AWS رو یاد بگیرید. یک سایت میزبان دامنه خوب کافیه. این سایت‌ها اکثرا ابزارهای خوبی برای Deploy (گستردن) و مدیریت دارند. لازم نیست همه چیز رو بیش از حد پیچیده کنیم .. "

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

" .. میگند که حتما حتما باید یه فریمورک فرانت-اند رو بلد باشین و یاد بگیرید، راستش من اینطور فکر نمیکنم. اگر بخواید می‌تونید حتی بدون فریمورک یک قالب رو طراحی کنید و روی سرور بارگذاریش کنید، به نظرم هیچ مشکلی هم نداره، اما این نکته رو باید در نظر گرفت که خیلی خیلی موقعیت‌های شغلی هست که دنبال کساییند که به فریمورک‌های مثل React یا Vue مسلطند .. "

زمانی که حس کردید می‌تونید یادگیری یه فریمورک فرانت-اند رو شروع کنید ( سعی می‌کنم توی مقاله‌ی بعدی توضیح بدم که چه زمانی مناسبه که شخص شروع به یادگیری فریمورک‌ فرانت-اند مثل React یا Vue کنه ) سعی کنید هر سه فریمورک معروف و رایج امروزه یعنی React و Vue و Angular رو تست کنید و ببینید که با کدومش بهتر می‌تونید ارتباط برقرار کنید.

برد یه اشاره‌ای هم به Svelte هم می‌کنه ( که البته بیشتر از اینکه فریمورک باشه یه کامپایلره )، اما خودش هم میگه که برای یادگیری توی سال جدید هنوز این فریمورک یکم خیلی نوپا و تازست و پیشنهاد نمی‌کنه که الان سراغش برید.

بعد از صحبت‌ها راجع به فریمورک، برد راجع به Server Side Rendering که این اواخر خیلی محبوب شده صحبت می‌کنه. اینکه SSR چی هست و دقیقا چه تفاوتی با Client Side Rendering داره خودش موضوع یک مقاله مفصل و طولانیه، ولی درکل می‌شه اینطور گفت که با این روش شما تمام محتوایی که قراره در مرورگر کاربر نمایش داده بشه رو روی سرور سایت سرهم می‌کنید و بعد به شکل آماده میفرستید برای مرورگر تا نمایش بده؛ در مقابل CSR هست که اصطلاحا مواد خام و محتوای خام رو در اختیار مرورگر قرار میده تا مرورگر بعد از دریافت، در خودش همه چیز رو سرهم کنه و بعد نمایش بده ( چیزی که در سال‌های اخیر کاملا رایج بوده).

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

دوتا از ابزارهای معروف که توی این زمینه استفاده می‌شند Next.js (برای React) و Nuxt.js (برای Vue) هست.

یکی دیگه از ابزارهای جدیدی که جدیدا رواج پیدا کرده، Static Site Renders هستند که به گفته‌ی خودش لازم نیست که یاد بگیرید، ولی بهتره که باهاشون آشنا باشید. به عنوان مثال سایت‌هایی که با Gatsby کار میشند بسیار سریع هستند و نیازی به سرور ندارند.

ابزارهای توسعه و برنامه‌نویسی Back End/سمت سرور

برای توسعه سمت سرور، برد شخصا Node.js رو پیشنهاد می‌کنه. به علت سرعت بیشتر در نوشتن و هم اینکه می‌تونه از JavaScript در دو سمت کاربر و سرور استفاده کنه. فریمورک پیشنهادیش هم Express هست چون هم خیلی شناخته شدست ( و جامعه فعالی داره ) و هم " .. آزادی عمل زیادی بهتون میده تا بتونید اونطور که میخواید و راحت هستید همه چیز رو بسازید .. "

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

" .. پایتون دو فریمورک عالی داره. جانگو بسیار بزرگ و غنی با کلی امکانات ـه و فِلَسک ساده‌تر و مینیمال. چیزهای لازم رو در اختیارتون قرار میدند و بقیه تصمیم گیری‌ها با خودتونه. راستش واقعا نمی‌تونم یکدومشون رو انتخاب کنم، جفتشون رو دوست دارم و روی پروژه‌های متفاوت ازشون استفاده میکنم .. "

و در دفاع از PHP هم نکاتی رو میگه:

" .. خیلی‌ از برنامه‌نویس‌ها PHP رو جدی نمی‌گیرند و این جای تاسف داره چون PHP واقعا پتانسیل بالایی داره. یک زبان ساده و راحت برای توسعه که هرجایی میشه ازش استفاده کرد. PHP برای کسایی که میخواند به شکل فریلنسری کار کنند انتخاب بسیار عالی ـه! چون می‌تونند خیلی سریع پروژه رو راه اندازی کنند باهاش ( و چون میزان سفارش کارهای فریلنسری بر پایه Wordpress خیلی خیلی بیشتره ).

البته اگر قصد دارید که توی یک شرکت بزرگ کار کنید، PHP نمیتونه خیلی انتخاب خوبی باشه، ( چون اکثر شرکت‌ها با PHP کار نمی‌کنند) اما اگر میخواید فریلنسری کار کنید و پروژه‌های خصوصی و کوچک‌تر کار کنید، واقعا انتخاب خوبیه.

اینکه برخی برنامه‌نویس‌ها PHP رو مسخره کنند و جدی نگریند یجورایی نماد خفن بودن شده. PHP اولین زبانی بود که من یاد گرفتم و هنوزم ازش لذت میبرم، اگر به کدهای Laravel نگاه کنید میبینید که چقدر کدها ظریف و زیبا هستند .. "

پایگاه داده

اکثر وبسایت‌ها نیاز به فضایی برای ذخیره اطلاعات دارند. پایگاه داده یا دیتابیس جایی هست که این اطلاعات ذخیره میشند. دیتابیس‌ها انواع مختلفی دارند و با توجه به نیاز مختلف، میشه ازشون استفاده کرد. شناخت انواع ـشون و یادگیری کار باهاشون بسیار مهمه. لازم نیست در ابتدا همه رو یاد بگیرید. با توجه به اولین پروژه‌تون پایگاه داده مناسب رو انتخاب کنید و با اون شروع کنید.

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

برد نگاهی به دیتابیس‌ها میندازه و عشق چند ساله‌ی خودش یعنی PostgreSQL رو توصیه می‌کنه.

ابزارهای دیگه‌ای که بهشون اشاره شده

زمانی که بخواید با API ها و دریافت اطلاعات به شکل JSON کار کنید، یکی از ابزارهایی که شاید باهاش برخورد کنید، GraphQL هست. اینطور که خود برد میگه: " .. GraphQL چیزی نیست که بخواید همین الان یادش بگیرید، اما می‌تونم بگم که حتما باهاش برخورد می‌کنید چون به نظر نمیاد که یک موج باشه و حالا حالاها موندنیه .. "

بعدش سراغ ' Content Management System ' یعنی سیستم مدیریت محتوا ( CMS ) ها میره که چطور راه خودشون رو توی دنیای برنامه نویسی وب باز کردند و شما میتونید ازشون به عنوان یک سمت سرور کامل استفاده کنید و خودتون سمت کاربر رو بسازید.

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

برای وب‌سرور پیشنهادش NGINX ـه نسبت به Apache چون " .. خیلی کمتر پیچیده به نظر میاد .. "

از دید اون، تصویرسازی خیلی می‌تونه توی حل مسئله و ساده کردن پروژه‌های پیچیده کمک کنه.

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

و یه موضوع خیلی مهمی رو اشاره می‌کنه که واقعا ارزش تاکید و اشاره رو داره:

" میدونم خیلی‌ خوره‌ها (nerds) الان هستند که دوست دارند تا جای ممکن همه چیز رو پیچیده کنند.. حواستون باشه که چون اینجا همه چیز لیست شده، دلیل نمیشه که خودتون رو توش غرق کنید .. "

و در آخر این نکته رو میگه که خیلی از کمپانی‌ها تیم‌هایی دارند که می‌تونند توی خیلی از این موارد به شما کمک کنند

توانایی‌هایی که به عنوان متخصص خوبه داشته باشید

اگر دوست دارید با استفاده از تکنولوژی تحت وب خودتون رو توی محیط توسعه برنامه برای موبایل تست کنید، توصیه برد استفاده از فریمورک Flutter هست. این فریمورک از زبان Dart استفاده می‌کنه. برد زبان Dart رو یکچیزی بین Java و JavaScript تعریف می‌کنه و میگه اگر یکدوم از این دو رو بلدید، میتونید Dart رو راحت‌تر یاد بگیرید.

انتخاب دومش برای ساخت برنامه موبایل، React Native هست که خب مسلما اگر React رو بلد باشید، کار با React Native می‌تونه براتون راحت‌تر باشه.

حوزه‌ی دیگه‌ای که می‌تونه جالب باشه، Progressive Web Apps هستند. خیلی ساده بخوایم بگیم، با استفاده از تکنولوژی‌های حوزه وب شما می‌تونید وبسایت‌هایی بسازید که مثل یک نرم‌افزار گوشی کار کنند. مثلا اینکه آفلاین هم بتونند یکسری کار‌هارو انجام بدند، یا نوتیفیکیشنی بفرستند و یا . . . درواقع ترکیب دنیای نرم‌افزارهای موبایل با وب. با کمک HTML,CSS,JS می‌تونید شروع به کار توی این حوزه کنید.

میرسیم به Electron، ابزاری که بهتون این قابلیت رو میده تا با کمک HTML,CSS,JS برای کامپیوتر‌ها نرم افزار بنویسید. دوتا از معروف‌ترین نرم‌افزارهایی که با این ابزار نوشته شدند، خود ادیتور VSCode و Discord هست.

موضوعات پیشرفته‌تر این حوزه میتونه JAMstack یعنی JavaScript , APIs , Markup و معماری بدون نیاز به سرور 'Serverless architecture' باشه که بهش نگاهی بندازید حتما.

و بالاخره میرسیم به محبوب‌ترین موضوع این روزها ?

یادگیری ماشین و Web Assembly

چون همه دارند راجع به یادگیری ماشین صحبت می‌کنند، دلیل نمیشه شما همه چیز رو ول کنید و بخواید برید یادش بگیرید. برد اینجوری این بخش توضیحات رو شروع کرد ?

و اینکه بله، شما میتونید با کمک جاوا اسکریپت یادگیری ماشین رو هم انجام بدید.

" .. پایتون پادشاه یادگیری ماشین ـه، ولی با جاوا اسکریپت هم شما TensorFlow.js و Brain.js رو دارید که میتونید شبکه عصبی بسازید و کلی کارهای خفن باهاش انجام بدید .. "

" .. اسمبلی وب هنوز توی مراحل اولیست، ولی حس می‌کنم تو سال جدید چیزهای بیشتری ازش ببینیم. به شکل سنتی ما از جاوا اسکریپت برای دستکاری کردن DOM و اجرای محاسبات استفاده میکنیم. اما جاوا اسکریپت از دید سرعت کمی محدوده. زبان های مثل C یا C++ خیلی سریعتر از JavaScript هستند. وب اسمبلی یه راه برای نوشتن بهینه کدهای سطح پایین‌تر و اجراشون به کمک مرورگره که واقعا سریعه .. "

زبان Rust یکی از زبان‌هاییه که برای اسمبلی وب می‌تونید ازش استفاده کنید؛ به نسبت C و C++ خیلی ساده‌تر میشه یادش گرفت و ازش استفاده کرد.

اما یادتون باشه که دلیل نمیشه بخاطر وب اسمبلی نخواین جاوا اسکریپت رو یاد بگیرید!

" .. می‌تونید جاوا اسکریپت رو مثل رئیس در نظر بگیرید که میتونه به وب اسمبلی بگه که چیکار باید بکنه. استفاده از زبان‌های سطح پایینی مثل C++ توی مرورگر، این قابلیت رو بهمون میده که روزی بتونیم بازی‌های ویدیویی یا نرم‌افزارهای ادیت ویدیو رو توی مرورگر اجرا کنیم، چیزی که با جاوا اسکریپت خالی نمیشه بهش فکر کرد .. "

در آخر:

" .. یادتون باشه که هرچی بیشتر یاد بگیرید، یادگیری براتون راحت‌تر میشه، خودتون رو غرق نکنید و سردرگرم نشید، کمی زمان بذارید و فکر کنید که چیکار دوست دارید انجام بدید و راجع بهش تحقیق کنید و بعد آروم شروع به یادگیری کنید .. "

? امیدوارم با خوندن این مقاله، مسیر براتون واضح‌تر و منظم‌تر شده باشه و تونسته باشه یک ذهنیت خوب رو جا بندازه.

? اگر دوست داشتید پیشنهاد می‌کنم حتما ویدیو اصلی که این مقاله از روش گرفته شده رو ببینید؛ مدت زمان ویدیو 73 دقیقست و مطمئنا کلی نکات ریزی هست که توی این مقاله نگنجیده ولی واقعا می‌تونه مفید باشه

? اگر موضوعی یا مفهومی توی این مقاله هست که دوست دارید در آینده براش مقاله‌ای تالیف/ترجمه بشه برام توی کامنت‌ها بنویسید.

? نوشته‌های قبلی من رو هم از لینک‌های زیر می‌تونید مطالعه کنید.