نصب ری اکت و راه‌اندازی اولین پروژه: راهنمای گام‌به‌گام برای مبتدیان

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

 

نصب Node.js

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

مراحل نصب:

1. به وب‌سایت رسمی Node.js به آدرس https://nodejs.org/  بروید.
2. نسخه LTS (Long Term Support) را انتخاب کنید.
3. پس از دانلود فایل نصبی، آن را اجرا کنید و مراحل نصب را طی کنید.

 

بررسی نصب Node.js

پس از نصب Node.js، برای اطمینان از نصب صحیح آن، ترمینال یا Command Prompt را باز کرده و دستور زیر را وارد کنید:

node -v

این دستور نسخه نصب شده Node.js را نمایش می‌دهد.

همچنین می‌توانید برای بررسی نسخه npm دستور زیر را وارد کنید:

npm -v

npm (Node Package Manager) یک مدیر بسته پیش‌فرض برای Node.js است که توسعه‌دهندگان می‌توانند از آن برای نصب، مدیریت و به‌روزرسانی کتابخانه‌ها و ابزارهای جاوا اسکریپت استفاده کنند. با استفاده از npm، شما می‌توانید به راحتی بسته‌های موردنیاز خود را از مخزن npm که شامل هزاران کتابخانه مختلف است، نصب کنید.

 

نصب ری اکت Create-React-App

برای ساخت پروژه ری اکت، بهتر است از ابزار Create-React-App استفاده کنید. این ابزار یک روش ساده و سریع برای ایجاد پروژه‌های ری اکت فراهم می‌کند.

برای نصب Create-React-App به صورت گلوبال، از دستور زیر استفاده کنید:

npm install -g create-react-app

ساخت پروژه ری اکت جدید

پس از نصب  Create-React-App، می‌توانید به راحتی یک پروژه جدید React بسازید. برای ایجاد پروژه جدید، دستور زیر را در ترمینال وارد کنید:

npx create-react-app my-first-react-app

در اینجا my-first-react-app نام پروژه شما است. با این دستور، Create-React-App  به صورت خودکار تمام فایل‌ها و ساختارهای مورد نیاز برای پروژه را ایجاد می‌کند.

• npx یک ابزار کاربردی همراه با npm است که در نسخه‌های بالاتر از npm 5.2 معرفی شده است. این ابزار برای اجرای مستقیم بسته‌های جاوا اسکریپت (بدون نیاز به نصب دائمی آن‌ها) طراحی شده است. با استفاده از npx، شما می‌توانید بسته‌هایی را که به‌ندرت نیاز به استفاده دارند یا برای اجرای یک فرمان خاص طراحی شده‌اند، به‌صورت موقت اجرا کنید.

 

اجرای پروژه ری اکت

پس از ایجاد پروژه، به دایرکتوری پروژه بروید و سپس دستور زیر را برای راه‌اندازی پروژه وارد کنید:

cd my-first-react-app
npm start

این دستور، سرور لوکال را اجرا می‌کند و پروژه شما در آدرس http://localhost:3000 در مرورگر باز می‌شود. نصب ری اکت و راه اندازی اولین پروژه به پایان رسید.

 

بررسی و شخصی‌سازی پروژه

حالا که نصب ری اکت به پایان رسیده و پروژه در حال اجرا است، می‌توانید به پوشه src  بروید و فایل App.js  را باز کنید. در اینجا، می‌توانید کد پیش‌فرض را ویرایش کرده و اولین تغییرات خود را در اپلیکیشن ری اکت مشاهده کنید.

 

جمع بندی:

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

 

مطالعه بیشتر در رفرنس های خارجی:

Start a New React Project (react.dev)

How to Install React – A Step-by-Step Guide (freecodecamp.org)

لیست کامل مقالات ” ری اکت ” ویکس سِوِن در لینک زیر :

ری اکت چیست؟