آموزش نصب ری اکت جی اس به چند روش ساده ولی حرفه‌ای

نصب react را میتونید به سه شیوه اجرا بدید که معمولا شیوه create react app از همگی طراحی سایت در مشهد راحتتره. در‌این نصیب هر چیزی برای یادگرفتن نصب ری اکت جی اس نیاز دارید را باهم تحقیق میکنیم.

 

طرز نصب ری اکت جی اس : به کارگیری از ابزار npm

خب بریم سراغ شیوه نصب react js با شیوه اولیه. پیش از هرچیزی ما برای نصب react js  می بایست گوشه و کنار کاریمون رو بسازیم، اولیه از کلیه ما به node js نیاز داریم. شاید بپرسین چرا node ؟ایا قراره با node شغل کنیم ؟ چه ربطی به ری اکت جی اس داره ؟ و شاید ابدا node رو بلد نباشین. و پاسخ اینه که ما ابدا با node کاری نداریم . ما تنها با npm فعالیت داریم، برای نصب ری اکت جی اس،

 

npm ابزاری است که کنار node نصب میشه که node package manager است (مدیر کننده ی بسته های node) .که npm انباره هایی داره که همه پکیج ها و ماژول ها از اون جا دانلود میشن  و ما بهش نیاز داریم تا پکیج های مربوط به ری اکتمون رو از انباره های npm  اخذ کنیم.

 

پس با node کاری نداریم و صرفا npm می باشد.  خب پس برای آغاز فراگیری نصب ری اکت وارد تارنما nodejs.org میشیم که دو نسخه برای دانلود وجود داره ما ورژنی رو تعیین می کنیم که پایینش Recommended For Most Users درج شده باشه که برای اکثر یوزرها توصیه میشه که در عکس زیر مورد ی متبوع با زرد هایلایت گردیده:

 

 

 

که بعداز کلیک کردن روی این آیتم روند نصب react js در ویندوز رو پیش بگیرین . و پس از نصب کردن cmd رو بالا بیارین و بعد از آن درون اون بنویسین node -v که بایستی نسخه node یی که نصب کردین رو بنویسه که تو عکس زیر هایلایت گردیده و این یعنی نود نصب گردیده و هیچ مشکلی وجود ندارد پس تعلق اساسی الان نصب گردیده :

 

 

 

طرز نصب react js : استعمال از ابزار yarn

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

 

نصب yarn:

npm i -g yarn

و میاد و اون رو برای ما نصب میکنه

 

 

 

طریق نصب ری اکت جی اس : استعمال از ابزار create react app

خب ، هم اکنون میخایم شیوه نصب ری اکت جی اس با ابزار create react app در گفت و گو فعال‌ساز‌ی ری اکت جی اس حرف کنیم. اکنون چرا برای نصب react js در ویندوز یا این که سایر سیستم عاملها به‌این ابزار نیاز داریم ؟! اوایل که ری اکت اومد تا پیش از ارائه شدن این ابزار ، ما می بایست خودمون کلیه مواقعی که ری اکت نیاز داشت رو قرار میدادیم

 

مثلا  Web server و babel که می بایست سینتکس تازه جاوا اسکریپت رو به قدیم ترجمه میکردکه منجر بشه در همگی مرورگر ها به صورت یکسان جاری ساختن بشه ،  می بایست از اینترنت پک به کارگیری میکردیم ، از npm استعمال میکردیم یک ابزار برای مدیر کردن پکیج هایی که نصب می کنیم، می‌باشد البته گسترش دهنده های ری اکت جی اس اومدن دیدن که طراحی کلیه این ابزار ها احتمالا منجر بشه که خیلی ها ابدا این سمت نیان زیرا راه‌اندازی نخستین ش سخته و این شد که اومدن و ابزار create react app رو ساختن.

 

که‌این ابزار منجر میشه که همگی مواقعی که گفته شد، اینترنت سرور و غیره به طور خودکار برای شما نصب بشه و به طور پیشفرض هم اخرین ورژن ی react رو هم برای شما دانلود میکنه. خب مجدد cmd رو گشوده کنین و داخلش بنویسین :npm  i  -g  create-react-app . که آغاز میکنه به نصب کردن اون به وضعیت global در سیستمتون:

 

 

 

 

 

و همون طور که در نصیب هایلایت تصویر بالا می‌بینیم نسخه 3.4.1 create react app رو برای اینجانب نصب کرده که اگه شما تو اینده این نوشته‌ی‌علمی رو بخونین و بخواید با این طریق نصب ری اکت جی اس را جاری ساختن به این ورژنی که برای شما نصب میکنه مختلف است .

 

 

 

ساختن او‌لین پروژه ری اکت جی اس 

خب تا این مکان عمل نصب react با ابزار create react app انجام یافته و اکنون وقت اینه که بریم و اولی پروژه مون با ری اکت جی اس رو بسازیم بسیارخب می‌آیم و باطن cmd مینویسیم:

 

create-react-app   firstproject

first project نام پروژه ی ماست شما هر اسمی که دوست دارین میتونین بزارین و خودش میاد و این فایل و برای ما میسازه و تک تک مواقعی که نیاز می باشد رو دانلود میکنه و برای اینجانب قرار میده. خب هم اکنون که با روش نصب react js آشنا شدید و روند نصب react js تون بدون نقص شد، حال برای آغاز پروژه واستارت زدنش می‌آیم درون cmd مون مینوسیم:

 

cd  first project 

و پس از اون :

 

yarn  start

به مکان yarn میتونین از خویش npm هم به کار گیری کنین . هرجور که ریلکس خیس هستین! بعداز اینتر زدن سرورِ گسترش ی مارو انجام میکنه و سپس ازاون مرورگر به طور دیفالت میاد بالا که تو تصویر تحت مشاهده میکنین:

 

 

 

خب می‌بینیم که پروژه ی ما اعمال شد و کلیه چیز اوکیه.

 

مفتوح کردن پروژه ری اکت در text editor 

اکنون که نصب react js در ویندوز یا این که سیستم عاملهای دیگه بدون نقص شد، وقتش رسیده که همین پروژه ای که ساخت‌و‌ساز کردیم رو در text editor و یا این که ide موردنظرمون گشوده کنیم و یک توضیحاتی راجب تعلق هایی که نصب گردیده برای اشنایی بهتون بدیم:

 

 

 

خب همون جور که در تصویر بالا میبینین اینجانب از vs code استعمال کردم. نام پروژه ی اینجانب دراین مکان، new-project می‌باشد و می بینیم که یک‌سری فولدر هارو بصورت دیفالت درونش قرار داره که قصد دارم شما رو با اون ها اشنا بکنم .

 

فایل node-modules

خب به دنبال ی فراگیری نصب ری اکت جی اس شما فولدر node-modules رو میبینین .node-modules فولدری است که همگی تعلق هایی که بوسیله npm, yarn نصب میکنین یا این که ابزاری رو نصب میکنین که تعلق هایی داره ؛ همه این تعلق ها به طور مدیر گردیده به وسیله مدیر کننده ی پکیج درین پوشه قرار داده میشه .

 

و این پروژه ی ریئکتی که ساخته شد مشمول تعداد متعددی از تعلق ها میشه که اگه این پوشه رو گشوده کنین با یه اسکرول زمانبر از تعلق ها مواجه میشین. که اگه قرار بود خودمون این همگی تعلق رو نصب کنیم زیبا صاف میشدیم:)