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

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

گام اول نقشه راه جاوا اسکریپت : خلاصه ای از جاوا اسکریپت

جاوا اسکریپت (JavaScript) که به اختصار JS نیز نامیده می‌شود، یکی از محبوب‌ترین زبان‌های برنامه نویسی است. جاوا اسکریپت زبانی سطح بالا، داینامیک، شی‌گرا و تفسیری است که از شیوه‌های مختلف برنامه نویسی پشتیبانی می‌کند. به طور کلی جاوا اسکریپت یک زبان فرانت اند (Front-End) است، اما از این زبان می‌توان برای برنامه نویسی وب سایت، اپلیکیشن‌های موبایل، بازی و اپلیکیشن‌های دسکتاپ استفاده کرد. بنابراین می‌توان اینگونه برداشت کرد که زبان برنامه نویسی جاوا اسکریپت ، یک زبان همه فن حریف است.

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

گام دوم نقشه راه جاوا اسکریپت: پیش‌نیازهای یادگیری زبان جاوا اسکریپت چیست؟

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

• زبان HTML
• زبان CSS

در ادامه برای هر یک از این دو زبان معرفی کوتاهی خواهیم داشت.

زبان HTML

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

زبان CSS

برنامه نویسان وب از CSS برای قالب‌بندی عناصر صفحه در html استفاده می‌کنند. CSS می‌تواند به تگ‌های HTML زیبایی ببخشد. به عنوان مثال، فرض کنید شما با HTML یک صفحه‌ی ثبت نام ایجاد کرده‌اید و در آن دو اینپوت فیلد به همراه یک دکمه‌ی ثبت قرار دادید. با استفاده از CSS می‌توانید برای هر یک از المان‌های خود رنگ، سایه و سایر ویژگی‌های استایلی را تعریف کنید.

گام سوم نقشه راه جاوا اسکریپت: مباحث مورد نیاز زبان جاوا اسکریپت چیست؟

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

یادگیری ES6

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

بیشتر بخوانید: JavaScript چیست؟ همه چیز درباره جاوا اسکریپت و کاربردهای آن

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

یادگیری یک Task Runner

قبلا اجرای کارهای مختلفی مانند کم حجم کردن فایل‌های جاوا اسکریپت و سی اس اس (minify کردن)، چسباندن فایل‌های جاوا اسکریپت به هم (concatenate کردن) و... بر عهده‌ی خودمان بود. بعد از هر بار ایجاد تغییر در فایل‌ها مجبور بودیم، تمام عملیات بالا و دسته ای از عملیات دیگر را دوباره و دوباره تکرار کنیم. این کار وقت گیر، پر هزینه و البته ملال آور بود. تا اینکه  Task Runner‌ها به میدان آمدند.

بیشتر بخوانید: پیش نیازهای آموزش جاوا اسکریپت

Task Runner همان کاری را انجام می‌دهد که از اسم آن مشخص است. وظیفه Task Runner انجام دادن وظایف است. مثلا Task Runner می‌تواند با دریافت یک دستور watch با هر بار ایجاد تغییر در فایل‌ها پروژه را دوباره اجرا کند. تعداد زیادی Task Runner وجود دارد که یادگیری کار با آن‌ها هم راحت است مانند Gulp.js، Grunt.js، npmscript و... به طور کلی بیشتر Task Runner‌ها می‌توانند این کارها را انجام دهند:

• چک کردن فایل‌های جاوا اسکریپت برای یافتن خطا
• الحاق یا Concatenate کردن فایل‌های مختلف جاوا اسکریپت
• کم حجم کردن یا Minify کردن فایل‌های جاوا اسکریپت
• بهینه سازی حجم تصاویر
• بارگزاری مجدد برنامه پس از تغییر در فایل‌ها یا Watch کردن
• و ....

یادگیری یک Package Manager

قدم بعدی در شروع یادگیری جاوا اسکریپت ، آموزش یک یا چند Package Manager است. پکیج‌ها در واقع قطعاتی از کد هستند که قابلیت استفاده مجدد را دارند. این پکیج‌ها می‌توانند از یک نرم افزار Package Manager یا مدیریت پکیج دانلود شده و در سیستم توسعه برنامه نویس ذخیره شوند. پکیج‌های مختلف ممکن است به یکدیگر وابسته باشند. Package Manager نرم افزاری است که به شما کمک می‌کند که پکیج‌های مختلفی که خودتان نوشته‌اید و یا دیگران آماده کرده‌اند مدیریت کنید تا پروژه تان به درستی کار کند. اگر به دنبال یادگیری یک Package Manager هستید پیشنهاد ما به شما npm است. البته پکیج منجرهای دیگری مانند bower، yarn و... نیز وجود دارند.

یادگیری یک Bundler

در قدم بعدی باید با Bundler‌ها آشنا شوید. اگر آشنایی مقدماتی با جاوا اسکریپت پیدا کرده باشید احتمالا می‌دانید که برای اضافه کردن فایل‌های جاوا اسکریپت به یک صفحه باید از کد زیر در HTML استفاده کنید:

<script src=’app.js’ rel=’text/javascript’></src>
<script>
…
</script>

در مثال بالا اگر در فایل app.js یک متغیر سراسری (متغیری که از تمام نقاط به آن دسترسی دارید) تعریف شده باشد؛ شما به راحتی می‌توانید در داخل تگ script دوم به آن دسترسی داشته باشید (در جاوا اسکریپت به متغیر هایی که در خطوط بعدی تعریف شده اند دسترسی ندارید). حالا فرض کنید که تعداد فایل‌های جاوا اسکریپت زیاد باشد. برای مثال، نمونه‌ی زیر را در نظر بگیرید:

<script src=’app.js’ rel=’text/javascript’></script>
<script src=’main.js’ rel=’text/javascript’></script>
<script src=’script.js’ rel=’text/javascript’></script>

در این حالت کنترل ترتیب متغیرها در فایل‌ها کمی سخت می‌شود. ممکن است در فایل main.js به متغیری احتیاج داشته باشید که در فایل script.js تعریف شده است. در این حالت راه حل، جابه‌جاکردن ترتیب معرفی فایل‌ها است. اما این عمل با زیادترشدن تعداد فایل‌ها پیچیده‌تر می‌شود. در اینجا Bundler‌ها یا Module Loader‌ها برای الحاق خودکار فایل‌ها به کمک شما می‌آیند!

Bundler ابزاری است که تمام تکه کدهای جاوا اسکریپت و فایل‌های وابسته‌ی آن‌ها را به صورت یک بسته در یک فایل جمع‌آوری می‌کند. این کار علاوه بر رفع دردسری که بالا توضیح داده شد، باعث می‌شود تعداد Request‌ها در زمان بارگزاری صفحه کاهش پیدا کند و سرعت بارگزاری صفحه بهبود پیدا کند.

از محبوب‌ترین Bundler‌ها می‌توان به Webpack، Browserify، Rollup اشاره کرد. البته باید بگوییم که ابزارهای جامعی مثل Webpack  ضمن اینکه کتابخانه Babel را برای ترجمه کد ES6 در خود دارند، بخشی از وظایف Task Runner‌ها را هم انجام می‌دهند!

فضا کار اشتراکی در تهران ویژه برنامه نویسان

دانلود

گام چهارم نقشه راه جاوا اسکریپت: منابع یادگیری زبان جاوا اسکریپت چیست؟

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

• سایت W3schools
• سایت Codecademy
• سایت Learn JS
• سایت javaScript.info
• سایت Tutorials Point
• HTML Dog
• راهنمای جاوا اسکریپت موزیلا
• سایت javaScript for cats
• سایت JavaScript.com
• سایت Guru99
• سایت EchoEcho.com

گام پنجم نقشه راه جاوا اسکریپت: یادگیری جاوا اسکریپت چقدر طول می‌کشد؟

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

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

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

گام ششم نقشه راه جاوا اسکریپت: بعد از یادگیری جاوا اسکریپت چه کنیم؟

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

یادگیری یک فریمورک جاوا اسکریپت

بعد از مقداری کدنویسی با جاوا اسکریپت متوجه می‌شوید که کدهای زیادی در حال تکرار شدن هستند. ایجاد تغییر در کدها با زیاد شدن خطوط کد مشکل و مشکل‌تر می‌شود. این روش کدزنی مسلما استاندارد نیست. اما ابزارهایی وجود دارند که در واقع کدهایی از پیش نوشته شده و استاندارد هستند. فریورک‌ها چهارچوب‌هایی هستند که شما تحت آن‌ها به کدزنی می‌پردازید و با این روش، نه تنها سرعت توسعه برنامه افزایش پیدا می‌کند بلکه نگهداری و بهینه سازی کدها بسیار آسان می‌شود. به عنوان مثال Angular.js، React و Vue.js تعدادی از این فریمورک‌های محبوب جاوا اسکریپت هستند. اگر دوست دارید بیشتر با این فریمورک‌ها آشنا شوید، ما مقاله ای در مورد معرفی محبوب‌ترین فریمورک‌های جاوا اسکریپت برای شما آماده کرده ایم.

آشنایی با تست نویسی در جاوا اسکریپت

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

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

در جاوا اسکریپت هم ابزارهای تست نویسی مختلفی وجود دارند. به عنوان مثال می‌توان به Jest از شرکت فیسبوک و Mocha اشاره کرد.

یادگیری برنامه نویسی جاوا اسکریپت برای برنامه نویسی بک اند

یکی از کاربردهای بسیار زیاد جاوا اسکریپت استفاده از آن در بک اند برنامه‌ها می‌باشد. به این صورت که با استفاده از موتور V8 جاوا اسکریپت را روی کامپیوتر سرور اجرا کنیم. اگر قصد دارید یک برنامه نویس فول استک جاوا اسکریپت شوید بنابراین برنامه نویسی بک اند با جاوا اسکریپت گزینه‌ای است که باید حتما یاد بگیرید. برای برنامه نویسی جاوا اسکریپت در سمت سرور از فریمورک Node.js استفاده می‌کنیم. در مطلبی که در مورد محبوب‌ترین فریمورک‌های جاوا اسکریپت نوشته‌ایم به معرفی این فریمورک پرداخته‌ایم.

یادگیری Typescript

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

زبان تایپ اسکریپت (Typescript) که در واقع یک بسته تکمیلی برای زبان برنامه نویسی جاوا اسکریپت است این مشکل را حل می‌کند. تایپ اسکریپت امکانات زیادی را به جاوا اسکریپت اضافه می‌کند. زبان تایپ اسکریپت در نهایت برای اجرا به کد جاوا اسکریپت ترجمه می‌شود. منظور از بسته تکمیلی این است که شما حتی می‌توانید کد جاوا اسکریپت خام را در کد تایپ اسکریپت استفاده کنید.

نتیجه گیری

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