Yeni React Applikasiyası Yarat

Ən yaxşı istifadəçi və developer təcrübəsi üçün inteqrasiya olunmuş toolchain istifadə edin.

Bu səhifə, göstərilən məsələləri həll etməyə kömək edən React toolchain-lərindən danışır:

• Çoxlu fayllara və komponentlərə böyümə.
• NPM-dən kitabxanaların işlədilməsi.
• Çox yaranan səhvlərin erkən tapılması.
• Development-də CSS və JS-in canlı redaktə edilməsi.
• Produksiya üçün nəticənin optimallaşdırılması.

Bu səhifədə tövsiyə olunan toolchain-lər heç bir konfiqurasiya tələb etmir.

Sizə Toolchain Lazım Olmaya Bilər

Əgər yuxarıda göstərilən problemlər ilə qarşılaşmır və ya JavaScript alətlərindən istifadə etmək istəmirsinizsə React-i HTML səhifəsinə <script> təqi ilə əlavə etməyi (fakultativ olaraq JSX ilə) tövsiyə edirik.

Bu, React-i mövcud veb səhifəsinə əlavə etməyin ən asan yoludur. Siz, faydalı gördüyünüz halda istədiyiniz zaman daha böyük toolchain əlavə edə bilərsiniz!

Tövsiyə Edilən Toolchain-lər

React komandası əsasən aşağıdaki həlləri tövsiyə edir:

• React-i öyrənmək və ya tək-səhifəli applikasiya yaratmaq üçün Create React App-dən istifadə edin.
• Node.js ilə server tərəfindən render edilmiş veb səhifə yaratmaq üçün Next.js-dən istifadə edin.
• Statik kontent əsasında qurulmuş veb səhifə yaratmaq üçün Gatsby-dən istifadə edin.
• Komponent kitabxanası yaratmaq və ya mövcud koda React inteqrasiya etmək üçün Daha Elasktik Toolchain-lərdən istifadə edin.

Create React App

Create React App, React-i öyrənmək və React-də yeni tək-səhifəli applikasiya yaratmaq üçün çox rahat mühit təmin edir.

Bu alət ən son JavaScript xüsusiyyətlərini istifadə etmək üçün təkmilləşmə mühiti yaradır, yaxşı developer təcrübəsi ilə proqramçıları təmin edir və applikasiyanı produksiya üçün optimallaşdırır. Bu aləti işlətmək üçün Node >= 10.16 və npm >= 5.6 tələb edilir. Layihə yaratmaq üçün göstərilən əmri icra edin:

npx create-react-app my-app
cd my-app
npm start

Qeyd

İlk sətrdə yazılan npx səhv deyil — bu npm 5.2+ ilə gələn paket icra edən alətdir.

Create React App backend məntiqi və ya verilənlər bazası idarə etmir; bu yalnız frontend üçün yaratma konveyeri (build pipeline) yaradır. Siz bunu istədiyiniz backend ilə işlədə bilərsiniz. Bu toolchain pərdə arxasında Babel və webpack işlədir. Lakin siz bu alətlər haqqında heç nə bilməyə bilərsiniz.

Applikasiyanı produksiyaya yerləşdirməya hazır olduqda npm run build əmri, applikasiyanın produksiya üçün optimallaşmış versiyasını build direktoriyasında yaradacaq. Create React App haqqında əlavə məlumat üçün README faylınını və ya İstifadəçi Dərsliyini oxuyun.

Next.js

React-də statik və server ilə render edilmiş applikasiyalar yaratmaq üçün populyar və yüngül freymvorklardan biri Next.js-dir. Bu freymvork stilləmə və routing həlləri ilə hazır gəlir. Bu toolchain server mühitində Node.js işlətdiyinizi fərz edir.

Next.js haqqında əlavə məlumat üçün rəsmi dərsliyə baxın.

Gatsby

React-də statik veb səhifə yaratmaq üçün ən yaxşı yol Gatsby işlətməkdir. Bu toolchain React komponentlərindən istifadə edir. Lakin son nəticədə əvvəlcədən render olunmuş HTML və CSS faylları yaradaraq ən təz yükləmə sürətinin olacağını qarantiyalayır.

Gatsby haqqında öyrənmək üçün rəsmi sənədlərə və start kitlər qalereyasına baxın.

Daha Elastik Toolchain-lər

Aşağıda göstərilən toolchain-lər daha çox seçim və elastiklik təklif edirlər. Biz bu alətləri daha təcrübəli istifadəçilərə tövsiyə edirik:

• Neutrino aləti webpack-in gücünü əvvəlcədən hazırlanmış şablonların sadəliyi ilə birləşdirir. Bu alət, React applikasiyaları və React komponentləri üçün şablonlar təmin edir.
• Nx, React, Next.js, Express və digər kitabxanaları dəstəkləyən full-stək monorepo təkmilləşməsi üçün istifadə olunan alətdir.
• Parcel React ilə işlənə bilən çevik və sıfır konfiqurasiyalı veb applikasiya paketləyənidir.
• Razzle konfiqurasiya tələb etməyən server ilə render etmə freymvorkdur. Bu framevork Next.js-dən daha elastikdir.

Sıfırdan Toolchain Yaratmaq

JavaScript yaratma toolchain-i aşağıdaki elementlərdən ibarətdir:

• Yarn və ya npm kimi paket meneceri. Bu mecerlər paketlərdən ibarət olan çox böyük ekosistemdən faydalanmağa və paketləri yükləməyə və ya yeniləməyə imkan yaradır.
• webpack və ya Parcel kimi paketləmə qurğuları. Bu qurğular modulyar kodun yazılmasına və modulları kiçik paketlərə paketləyib yükləmə zamanını optimallaşdırılmasına imkan yaradır.
• Babel kimi kompilyator. Bu kompilyator ilə köhnə brauzerlərdə işləyən modern JavaScript kodu yazmaq mümkündür.

Əgər öz JavaScript toolchain-inizi quraşdırmağa üstünlük verirsinizsə Create React App-in bəzi funksiyalarını yenidən tətbiq edən bu yazını oxuyun.

Xüsusi toolchain-in produksiya üçün düzgün quraşdırıldığından əmin olun.