Frontend Nx Workspace: அளவிடக்கூடிய பயன்பாடுகளுக்கான மோனோரெப்போ மேம்பாடு

இன்றைய வேகமான மென்பொருள் மேம்பாட்டுச் சூழலில், பெரிய அளவிலான ஃபிரன்டென்ட் பயன்பாடுகளை உருவாக்குவதும் பராமரிப்பதும் சவாலானது. திட்டங்கள் வளரும்போது சார்புகளை நிர்வகித்தல், குறியீட்டு நிலைத்தன்மையை உறுதி செய்தல் மற்றும் பில்ட் நேரங்களை மேம்படுத்துதல் ஆகியவை மேலும் சிக்கலாகின்றன. மோனோரெப்போக்கள் பல திட்டங்கள் மற்றும் லைப்ரரிகளை ஒரே களஞ்சியத்தில் ஒருங்கிணைப்பதன் மூலம் ஒரு சக்திவாய்ந்த தீர்வை வழங்குகின்றன. Nx, ஒரு ஸ்மார்ட், விரிவாக்கக்கூடிய பில்ட் சிஸ்டம், மேம்பட்ட கருவிகள் மற்றும் அம்சங்களுடன் மோனோரெப்போ மேம்பாட்டை மேம்படுத்துகிறது.

இந்த விரிவான வழிகாட்டி, ஃபிரன்டென்ட் மோனோரெப்போ மேம்பாட்டிற்காக ஒரு Nx வொர்க்ஸ்பேஸைப் பயன்படுத்துவதன் நன்மைகளை ஆராய்கிறது, முக்கிய கருத்துக்கள், நடைமுறை எடுத்துக்காட்டுகள் மற்றும் சிறந்த நடைமுறைகளை உள்ளடக்கியது.

மோனோரெப்போ என்றால் என்ன?

மோனோரெப்போ என்பது ஒரு மென்பொருள் மேம்பாட்டு உத்தியாகும், இதில் அனைத்து திட்டங்களும் அவற்றின் சார்புகளும் ஒரே களஞ்சியத்தில் சேமிக்கப்படுகின்றன. இந்த அணுகுமுறை பாரம்பரிய மல்டி-ரெப்போ அணுகுமுறைக்கு முரணானது, இதில் ஒவ்வொரு திட்டத்திற்கும் அதன் சொந்த களஞ்சியம் உள்ளது.

மோனோரெப்போவின் முக்கிய பண்புகள்:

• உண்மையின் ஒற்றை ஆதாரம்: அனைத்து குறியீடுகளும் ஒரே இடத்தில் உள்ளன.
• குறியீடு பகிர்வு மற்றும் மறுபயன்பாடு: திட்டங்களுக்கு இடையில் குறியீட்டைப் பகிர்வதும் மீண்டும் பயன்படுத்துவதும் எளிது.
• எளிமைப்படுத்தப்பட்ட சார்பு மேலாண்மை: திட்டங்களுக்கு இடையில் சார்புகளை நிர்வகிப்பது மிகவும் எளிமையாகிறது.
• அணு மாற்றங்கள்: மாற்றங்கள் பல திட்டங்களில் பரவலாம், நிலைத்தன்மையை உறுதி செய்கிறது.
• மேம்படுத்தப்பட்ட ஒத்துழைப்பு: தொடர்புடைய திட்டங்களில் அணிகள் ஒத்துழைப்பது எளிது.

ஃபிரன்டென்ட் மேம்பாட்டிற்கு ஏன் மோனோரெப்போ பயன்படுத்த வேண்டும்?

மோனோரெப்போக்கள் ஃபிரன்டென்ட் மேம்பாட்டிற்கு, குறிப்பாக பெரிய மற்றும் சிக்கலான திட்டங்களுக்கு குறிப்பிடத்தக்க நன்மைகளை வழங்குகின்றன.

• மேம்படுத்தப்பட்ட குறியீடு பகிர்வு: ஃபிரன்டென்ட் திட்டங்கள் பெரும்பாலும் பொதுவான UI கூறுகள், பயன்பாட்டு செயல்பாடுகள் மற்றும் வடிவமைப்பு அமைப்புகளைப் பகிர்ந்து கொள்கின்றன. ஒரு மோனோரெப்போ குறியீடு பகிர்வை எளிதாக்குகிறது, நகலெடுப்பதைக் குறைக்கிறது மற்றும் நிலைத்தன்மையை ஊக்குவிக்கிறது. உதாரணமாக, ஒரு வடிவமைப்பு அமைப்பு லைப்ரரியை ஒரே வொர்க்ஸ்பேஸில் உள்ள பல ரியாக்ட் பயன்பாடுகளில் எளிதாகப் பகிரலாம்.
• நெறிப்படுத்தப்பட்ட சார்பு மேலாண்மை: பல ஃபிரன்டென்ட் திட்டங்களில் சார்புகளை நிர்வகிப்பது சவாலானது, குறிப்பாக எப்போதும் மாறிவரும் ஜாவாஸ்கிரிப்ட் சூழலுடன். ஒரு மோனோரெப்போ சார்புகளை மையப்படுத்தி, பதிப்புகள் மற்றும் மேம்படுத்தல்களை நிர்வகிப்பதற்கான கருவிகளை வழங்குவதன் மூலம் சார்பு மேலாண்மையை எளிதாக்குகிறது.
• மேம்படுத்தப்பட்ட பில்ட் செயல்திறன்: Nx மேம்பட்ட பில்ட் கேச்சிங் மற்றும் சார்பு பகுப்பாய்வை வழங்குகிறது, இது வேகமான மற்றும் திறமையான பில்ட்களை செயல்படுத்துகிறது. சார்பு வரைபடத்தை பகுப்பாய்வு செய்வதன் மூலம், Nx ஒரு மாற்றத்தால் பாதிக்கப்பட்ட திட்டங்களை மட்டுமே மீண்டும் உருவாக்கும், இது பில்ட் நேரங்களை கணிசமாகக் குறைக்கிறது. இது பல கூறுகள் மற்றும் மாட்யூல்களைக் கொண்ட பெரிய ஃபிரன்டென்ட் பயன்பாடுகளுக்கு முக்கியமானது.
• எளிமைப்படுத்தப்பட்ட ரீஃபாக்டரிங்: பல திட்டங்களில் குறியீட்டை ரீஃபாக்டரிங் செய்வது ஒரு மோனோரெப்போவில் எளிதானது. மாற்றங்களை அணுவாகச் செய்யலாம், நிலைத்தன்மையை உறுதிசெய்து, பிழைகளை அறிமுகப்படுத்தும் அபாயத்தைக் குறைக்கிறது. எடுத்துக்காட்டாக, பல பயன்பாடுகளில் பயன்படுத்தப்படும் ஒரு கூறுகளை மறுபெயரிடுவது ஒரே கமிட்டில் செய்யப்படலாம்.
• சிறந்த ஒத்துழைப்பு: ஒரு மோனோரெப்போ பகிரப்பட்ட குறியீட்டுத் தளம் மற்றும் ஒரு பொதுவான மேம்பாட்டுச் சூழலை வழங்குவதன் மூலம் ஃபிரன்டென்ட் டெவலப்பர்களிடையே சிறந்த ஒத்துழைப்பை வளர்க்கிறது. அணிகள் வெவ்வேறு திட்டங்களுக்கு எளிதாக பங்களிக்கலாம் மற்றும் அறிவு மற்றும் சிறந்த நடைமுறைகளைப் பகிர்ந்து கொள்ளலாம்.

Nx அறிமுகம்: ஸ்மார்ட், விரிவாக்கக்கூடிய பில்ட் சிஸ்டம்

Nx என்பது ஒரு சக்திவாய்ந்த பில்ட் சிஸ்டம் ஆகும், இது மேம்பட்ட கருவிகள் மற்றும் அம்சங்களுடன் மோனோரெப்போ மேம்பாட்டை மேம்படுத்துகிறது. இது ஒரு தரப்படுத்தப்பட்ட மேம்பாட்டு அனுபவத்தை வழங்குகிறது, பில்ட் செயல்திறனை மேம்படுத்துகிறது, மற்றும் சார்பு மேலாண்மையை எளிதாக்குகிறது.

Nx-இன் முக்கிய அம்சங்கள்:

• ஸ்மார்ட் பில்ட் சிஸ்டம்: Nx உங்கள் திட்டங்களின் சார்பு வரைபடத்தை பகுப்பாய்வு செய்து, பாதிக்கப்பட்ட திட்டங்களை மட்டுமே மீண்டும் உருவாக்குகிறது, இது பில்ட் நேரங்களை கணிசமாகக் குறைக்கிறது.
• குறியீடு உருவாக்கம்: Nx புதிய திட்டங்கள், கூறுகள் மற்றும் மாட்யூல்களை உருவாக்குவதற்கான குறியீடு உருவாக்கக் கருவிகளை வழங்குகிறது, மேம்பாட்டை துரிதப்படுத்துகிறது மற்றும் நிலைத்தன்மையை உறுதி செய்கிறது.
• ஒருங்கிணைந்த கருவிகள்: Nx ரியாக்ட், ஆங்குலர் மற்றும் வியூ.ஜேஎஸ் போன்ற பிரபலமான ஃபிரன்டென்ட் கட்டமைப்புகளுடன் ஒருங்கிணைந்து, ஒரு தடையற்ற மேம்பாட்டு அனுபவத்தை வழங்குகிறது.
• பிளகின் சுற்றுச்சூழல் அமைப்பு: Nx ஒரு வளமான பிளகின் சுற்றுச்சூழல் அமைப்பைக் கொண்டுள்ளது, இது கூடுதல் கருவிகள் மற்றும் ஒருங்கிணைப்புகளுடன் அதன் செயல்பாட்டை விரிவுபடுத்துகிறது.
• அதிகரிக்கும் பில்ட்கள்: Nx-இன் அதிகரிக்கும் பில்ட் சிஸ்டம் மாற்றப்பட்டதை மட்டுமே மீண்டும் உருவாக்குகிறது, இது மேம்பாட்டு பின்னூட்ட வளையத்தை வியத்தகு முறையில் வேகப்படுத்துகிறது.
• கணக்கீட்டு கேச்சிங்: Nx பில்ட்கள் மற்றும் சோதனைகள் போன்ற விலையுயர்ந்த கணக்கீடுகளின் முடிவுகளை கேச் செய்கிறது, செயல்திறனை மேலும் மேம்படுத்துகிறது.
• விநியோகிக்கப்பட்ட பணி செயலாக்கம்: மிகப் பெரிய மோனோரெப்போக்களுக்கு, Nx பில்ட்கள் மற்றும் சோதனைகளை இணைக்க பல கணினிகளில் பணிகளை விநியோகிக்க முடியும்.

ஃபிரன்டென்ட் மேம்பாட்டிற்கு ஒரு Nx வொர்க்ஸ்பேஸை அமைத்தல்

ஒரு Nx வொர்க்ஸ்பேஸை அமைப்பது எளிது. நீங்கள் Nx CLI-ஐப் பயன்படுத்தி ஒரு புதிய வொர்க்ஸ்பேஸை உருவாக்கி, திட்டங்கள் மற்றும் லைப்ரரிகளைச் சேர்க்கலாம்.

முன்நிபந்தனைகள்:

• Node.js (பதிப்பு 16 அல்லது அதற்குப் பிந்தையது)
• npm அல்லது yarn

படிகள்:

1. Nx CLI-ஐ நிறுவவும்:

               npm install -g create-nx-workspace
               
   
                 
                   Copy
                 
               
             

2. ஒரு புதிய Nx வொர்க்ஸ்பேஸை உருவாக்கவும்:

               npx create-nx-workspace my-frontend-workspace
               
   
                 
                   Copy
                 
               
             

   ஒரு முன்னமைவைத் தேர்ந்தெடுக்க நீங்கள் கேட்கப்படுவீர்கள். உங்கள் விருப்பமான ஃபிரன்டென்ட் கட்டமைப்பிற்குப் பொருந்தக்கூடிய ஒரு முன்னமைவைத் தேர்ந்தெடுக்கவும் (எ.கா., ரியாக்ட், ஆங்குலர், வியூ.ஜேஎஸ்).

3. ஒரு புதிய பயன்பாட்டைச் சேர்க்கவும்:

               nx generate @nx/react:application my-app
               
   
                 
                   Copy
                 
               
             

   இந்த கட்டளை வொர்க்ஸ்பேஸில் "my-app" என்ற பெயரில் ஒரு புதிய ரியாக்ட் பயன்பாட்டை உருவாக்குகிறது.

4. ஒரு புதிய லைப்ரரியைச் சேர்க்கவும்:

               nx generate @nx/react:library my-library
               
   
                 
                   Copy
                 
               
             

   இந்த கட்டளை வொர்க்ஸ்பேஸில் "my-library" என்ற பெயரில் ஒரு புதிய ரியாக்ட் லைப்ரரியை உருவாக்குகிறது. லைப்ரரிகள் பயன்பாடுகளுக்கு இடையில் குறியீட்டைப் பகிரப் பயன்படுகின்றன.

உங்கள் Nx வொர்க்ஸ்பேஸை ஒழுங்கமைத்தல்

பராமரிப்பு மற்றும் அளவிடுதலுக்கு ஒரு நன்கு ஒழுங்கமைக்கப்பட்ட Nx வொர்க்ஸ்பேஸ் முக்கியமானது. உங்கள் வொர்க்ஸ்பேஸை கட்டமைக்கும்போது பின்வரும் வழிகாட்டுதல்களைக் கவனியுங்கள்:

• பயன்பாடுகள்: பயன்பாடுகள் உங்கள் ஃபிரன்டென்ட் திட்டங்களின் நுழைவுப் புள்ளிகளாகும். அவை பயனர் எதிர்கொள்ளும் இடைமுகங்களைக் குறிக்கின்றன. எடுத்துக்காட்டுகளில் ஒரு வலைப் பயன்பாடு, ஒரு மொபைல் பயன்பாடு அல்லது ஒரு டெஸ்க்டாப் பயன்பாடு ஆகியவை அடங்கும்.
• லைப்ரரிகள்: லைப்ரரிகள் பல பயன்பாடுகளில் பகிரக்கூடிய மீண்டும் பயன்படுத்தக்கூடிய குறியீட்டைக் கொண்டுள்ளன. அவை அவற்றின் செயல்பாட்டின் அடிப்படையில் வெவ்வேறு வகைகளாக ஒழுங்கமைக்கப்பட்டுள்ளன.
• அம்ச லைப்ரரிகள்: அம்ச லைப்ரரிகள் ஒரு குறிப்பிட்ட அம்சத்திற்கான வணிக தர்க்கம் மற்றும் UI கூறுகளைக் கொண்டுள்ளன. அவை கோர் மற்றும் UI லைப்ரரிகளைச் சார்ந்துள்ளன.
• UI லைப்ரரிகள்: UI லைப்ரரிகள் பல அம்சங்கள் மற்றும் பயன்பாடுகளில் பயன்படுத்தக்கூடிய மீண்டும் பயன்படுத்தக்கூடிய UI கூறுகளைக் கொண்டுள்ளன.
• கோர் லைப்ரரிகள்: கோர் லைப்ரரிகள் பயன்பாட்டு செயல்பாடுகள், தரவு மாதிரிகள் மற்றும் வொர்க்ஸ்பேஸ் முழுவதும் பயன்படுத்தப்படும் பிற பொதுவான குறியீட்டைக் கொண்டுள்ளன.
• பகிரப்பட்ட லைப்ரரிகள்: பகிரப்பட்ட லைப்ரரிகள் ஃபிரன்டென்ட் கட்டமைப்பைப் (ரியாக்ட், ஆங்குலர், வியூ.ஜேஎஸ்) பொருட்படுத்தாமல் பல பயன்பாடுகள் மற்றும் லைப்ரரிகளால் பயன்படுத்தக்கூடிய கட்டமைப்பு-சார்பற்ற குறியீட்டைக் கொண்டுள்ளன. இது குறியீடு மறுபயன்பாட்டை ஊக்குவிக்கிறது மற்றும் நகலெடுப்பைக் குறைக்கிறது.

எடுத்துக்காட்டு அடைவு அமைப்பு:

my-frontend-workspace/
├── apps/
│   ├── my-app/
│   │   ├── src/
│   │   │   ├── app/
│   │   │   │   ├── app.tsx
│   │   │   │   └── app.module.css
│   │   │   └── main.tsx
│   │   └── project.json
│   └── my-other-app/
│       └── ...
├── libs/
│   ├── feature-my-feature/
│   │   ├── src/
│   │   │   └── lib/
│   │   │       └── feature-my-feature.tsx
│   │   └── project.json
│   ├── ui/
│   │   ├── src/
│   │   │   └── lib/
│   │   │       └── button/
│   │   │           └── button.tsx
│   │   └── project.json
│   ├── core/
│   │   ├── src/
│   │   │   └── lib/
│   │   │       └── api.ts
│   │   └── project.json
│   └── shared/
│       ├── src/
│       │   └── lib/
│       │       └── date-formatter.ts
│       └── project.json
├── tools/
│   └── generators/
├── nx.json
├── package.json
└── tsconfig.base.json

Nx லைப்ரரிகளுடன் குறியீடு பகிர்வு மற்றும் மறுபயன்பாடு

Nx லைப்ரரிகள் ஒரு மோனோரெப்போவில் குறியீடு பகிர்வு மற்றும் மறுபயன்பாட்டிற்கான திறவுகோலாகும். உங்கள் குறியீட்டை நன்கு வரையறுக்கப்பட்ட லைப்ரரிகளாக ஒழுங்கமைப்பதன் மூலம், நீங்கள் கூறுகள், சேவைகள் மற்றும் பயன்பாடுகளை பல பயன்பாடுகளில் எளிதாகப் பகிரலாம்.

எடுத்துக்காட்டு: ஒரு UI கூறுகளைப் பகிர்தல்

பல ரியாக்ட் பயன்பாடுகளில் நீங்கள் பகிர விரும்பும் ஒரு பட்டன் கூறு உங்களிடம் உள்ளது என்று வைத்துக்கொள்வோம். நீங்கள் "ui" என்ற பெயரில் ஒரு UI லைப்ரரியை உருவாக்கி, இந்த லைப்ரரியில் பட்டன் கூறுகளை வைக்கலாம்.

1. ஒரு UI லைப்ரரியை உருவாக்கவும்:

               nx generate @nx/react:library ui
               
   
                 
                   Copy
                 
               
             

2. ஒரு பட்டன் கூறுகளை உருவாக்கவும்:

               nx generate @nx/react:component button --project=ui
               
   
                 
                   Copy
                 
               
             

3. பட்டன் கூறுகளை செயல்படுத்தவும்:

               // libs/ui/src/lib/button/button.tsx
   import styles from './button.module.css';
   
   interface ButtonProps {
    text: string;
    onClick: () => void;
   }
   
   export function Button({ text, onClick }: ButtonProps) {
    return (
    
    {text}
    
    );
   }
   
   export default Button;
               
   
                 
                   Copy
                 
               
             

4. லைப்ரரியிலிருந்து பட்டன் கூறுகளை ஏற்றுமதி செய்யவும்:

               // libs/ui/src/index.ts
   export * from './lib/button/button';
               
   
                 
                   Copy
                 
               
             

5. ஒரு பயன்பாட்டில் பட்டன் கூறுகளைப் பயன்படுத்தவும்:

               // apps/my-app/src/app/app.tsx
   import { Button } from '@my-frontend-workspace/ui';
   
   function App() {
    return (
    
   
    
   Welcome to My App
     alert('Clicked!')} />
    
    );
   }
   
   export default App;
               
   
                 
                   Copy
                 
               
             

லைப்ரரிகளைப் பயன்படுத்துவதன் மூலம், உங்கள் UI கூறுகள் எல்லா பயன்பாடுகளிலும் சீராக இருப்பதை உறுதிசெய்ய முடியும். நீங்கள் UI லைப்ரரியில் பட்டன் கூறுகளைப் புதுப்பிக்கும்போது, அந்த கூறுகளைப் பயன்படுத்தும் அனைத்து பயன்பாடுகளும் தானாகவே புதுப்பிக்கப்படும்.

Nx வொர்க்ஸ்பேஸ்களில் சார்பு மேலாண்மை

Nx திட்டங்கள் மற்றும் லைப்ரரிகளுக்கு இடையேயான சார்புகளை நிர்வகிக்க சக்திவாய்ந்த கருவிகளை வழங்குகிறது. ஒவ்வொரு திட்டம் அல்லது லைப்ரரியின் `project.json` கோப்பில் நீங்கள் சார்புகளை வெளிப்படையாக வரையறுக்கலாம்.

எடுத்துக்காட்டு: ஒரு சார்பை அறிவித்தல்

உங்கள் "my-app" பயன்பாடு "core" லைப்ரரியைச் சார்ந்துள்ளது என்று வைத்துக்கொள்வோம். நீங்கள் இந்த சார்பை "my-app" இன் `project.json` கோப்பில் அறிவிக்கலாம்.

            // apps/my-app/project.json
{
 "name": "my-app",
 "projectType": "application",
 ...
 "implicitDependencies": ["core"]
}
            

              
                Copy
              
            
          

சார்புகளை வெளிப்படையாக அறிவிப்பதன் மூலம், Nx உங்கள் வொர்க்ஸ்பேஸின் சார்பு வரைபடத்தை பகுப்பாய்வு செய்து, ஒரு சார்பு மாறும்போது பாதிக்கப்பட்ட திட்டங்களை மட்டுமே மீண்டும் உருவாக்கும். இது பில்ட் செயல்திறனை கணிசமாக மேம்படுத்துகிறது.

Nx உடன் பில்ட் செயல்திறன் மேம்படுத்தல்

Nx-இன் ஸ்மார்ட் பில்ட் சிஸ்டம் மற்றும் கணக்கீட்டு கேச்சிங் திறன்கள் பில்ட் செயல்திறனை கணிசமாக மேம்படுத்துகின்றன. உங்கள் Nx வொர்க்ஸ்பேஸில் பில்ட் செயல்திறனை மேம்படுத்துவதற்கான சில குறிப்புகள் இங்கே:

• சார்பு வரைபடத்தை பகுப்பாய்வு செய்யுங்கள்: உங்கள் வொர்க்ஸ்பேஸின் சார்பு வரைபடத்தைக் காண `nx graph` கட்டளையைப் பயன்படுத்தவும். சாத்தியமான இடையூறுகளைக் கண்டறிந்து, சார்புகளைக் குறைக்க உங்கள் திட்ட கட்டமைப்பை மேம்படுத்தவும்.
• கணக்கீட்டு கேச்சிங்கைப் பயன்படுத்தவும்: Nx பில்ட்கள் மற்றும் சோதனைகள் போன்ற விலையுயர்ந்த கணக்கீடுகளின் முடிவுகளை கேச் செய்கிறது. உங்கள் `nx.json` கோப்பில் கணக்கீட்டு கேச்சிங் இயக்கப்பட்டிருப்பதை உறுதிசெய்யவும்.
• பணிகளை இணையாக இயக்கவும்: Nx பல CPU கோர்களைப் பயன்படுத்த பணிகளை இணையாக இயக்க முடியும். பணிகளை இணையாக இயக்க `--parallel` கொடியைப் பயன்படுத்தவும்.
• விநியோகிக்கப்பட்ட பணி செயலாக்கத்தைப் பயன்படுத்தவும்: மிகப் பெரிய மோனோரெப்போக்களுக்கு, Nx பில்ட்கள் மற்றும் சோதனைகளை இணைக்க பல கணினிகளில் பணிகளை விநியோகிக்க முடியும்.
• உங்கள் குறியீட்டை மேம்படுத்தவும்: பில்ட் நேரங்களைக் குறைக்க உங்கள் குறியீட்டை மேம்படுத்தவும். பயன்படுத்தப்படாத குறியீட்டை அகற்றவும், படங்களை மேம்படுத்தவும், உங்கள் பண்டல்களின் அளவைக் குறைக்க குறியீடு பிரிப்பைப் பயன்படுத்தவும்.

Nx வொர்க்ஸ்பேஸ்களில் சோதனை செய்தல்

Nx யூனிட் சோதனைகள், ஒருங்கிணைப்பு சோதனைகள் மற்றும் எண்ட்-டு-எண்ட் சோதனைகளை இயக்குவதற்கு ஒருங்கிணைந்த சோதனை கருவிகளை வழங்குகிறது. நீங்கள் வொர்க்ஸ்பேஸில் உள்ள அனைத்து திட்டங்களுக்கும் அல்லது ஒரு குறிப்பிட்ட திட்டத்திற்கும் சோதனைகளை இயக்க `nx test` கட்டளையைப் பயன்படுத்தலாம்.

எடுத்துக்காட்டு: சோதனைகளை இயக்குதல்

            nx test my-app
            

              
                Copy
              
            
          

இந்த கட்டளை "my-app" பயன்பாட்டிற்கான அனைத்து சோதனைகளையும் இயக்குகிறது.

Nx ஜெஸ்ட், சைப்ரஸ் மற்றும் பிளேரைட் போன்ற பிரபலமான சோதனை கட்டமைப்புகளை ஆதரிக்கிறது. ஒவ்வொரு திட்டத்தின் `project.json` கோப்பிலும் உங்கள் சோதனை சூழலை நீங்கள் உள்ளமைக்கலாம்.

Nx உடன் தொடர்ச்சியான ஒருங்கிணைப்பு மற்றும் தொடர்ச்சியான வரிசைப்படுத்தல் (CI/CD)

Nx கிட்ஹப் ஆக்சன்ஸ், கிட்லேப் CI மற்றும் ஜென்கின்ஸ் போன்ற பிரபலமான CI/CD அமைப்புகளுடன் தடையின்றி ஒருங்கிணைக்கிறது. உங்கள் CI/CD பைப்லைனில் பில்ட்கள், சோதனைகள் மற்றும் வரிசைப்படுத்தல்களை தானியக்கமாக்க Nx-இன் கட்டளை-வரி இடைமுகத்தைப் பயன்படுத்தலாம்.

எடுத்துக்காட்டு: GitHub Actions Workflow

உங்கள் Nx வொர்க்ஸ்பேஸை உருவாக்கும், சோதிக்கும் மற்றும் வரிசைப்படுத்தும் ஒரு GitHub Actions workflow-வின் எடுத்துக்காட்டு இங்கே:

            # .github/workflows/ci.yml
name: CI

on:
 push:
 branches: [main]
 pull_request:
 branches: [main]

jobs:
 build:
 runs-on: ubuntu-latest

 steps:
 - uses: actions/checkout@v3
 with:
 fetch-depth: 0
 - uses: actions/setup-node@v3
 with:
 node-version: 16
 cache: 'npm'
 - run: npm ci
 - run: npx nx affected --target=lint --base=origin/main --head=HEAD
 - run: npx nx affected --target=test --base=origin/main --head=HEAD --watchAll=false
 - run: npx nx affected --target=build --base=origin/main --head=HEAD
            

              
                Copy
              
            
          

இந்த workflow பின்வரும் பணிகளை இயக்குகிறது:

• லிண்டிங்: பாதிக்கப்பட்ட திட்டங்களில் லிண்டர்களை இயக்குகிறது.
• சோதனை: பாதிக்கப்பட்ட திட்டங்களில் சோதனைகளை இயக்குகிறது.
• பில்டிங்: பாதிக்கப்பட்ட திட்டங்களை உருவாக்குகிறது.

Nx `affected` கட்டளையை வழங்குகிறது, இது ஒரு மாற்றத்தால் பாதிக்கப்பட்ட திட்டங்களில் மட்டுமே பணிகளை இயக்க உங்களை அனுமதிக்கிறது. இது உங்கள் CI/CD பைப்லைனின் இயக்க நேரத்தை கணிசமாகக் குறைக்கிறது.

ஃபிரன்டென்ட் Nx வொர்க்ஸ்பேஸ் மேம்பாட்டிற்கான சிறந்த நடைமுறைகள்

Nx உடன் ஃபிரன்டென்ட் பயன்பாடுகளை உருவாக்குவதற்கான சில சிறந்த நடைமுறைகள் இங்கே:

• ஒரு சீரான கோடிங் பாணியைப் பின்பற்றவும்: உங்கள் வொர்க்ஸ்பேஸ் முழுவதும் ஒரு சீரான கோடிங் பாணியை அமல்படுத்த பிரெட்டியர் போன்ற குறியீடு வடிவமைப்பான் மற்றும் ESLint போன்ற லிண்டரைப் பயன்படுத்தவும்.
• யூனிட் சோதனைகளை எழுதுங்கள்: குறியீட்டின் தரத்தை உறுதிப்படுத்தவும், பின்னடைவுகளைத் தடுக்கவும் உங்கள் அனைத்து கூறுகள், சேவைகள் மற்றும் பயன்பாடுகளுக்கும் யூனிட் சோதனைகளை எழுதுங்கள்.
• ஒரு வடிவமைப்பு அமைப்பைப் பயன்படுத்தவும்: உங்கள் UI கூறுகள் முழுவதும் நிலைத்தன்மையை உறுதிப்படுத்த ஒரு வடிவமைப்பு அமைப்பைப் பயன்படுத்தவும்.
• உங்கள் குறியீட்டை ஆவணப்படுத்தவும்: மற்ற டெவலப்பர்கள் புரிந்துகொள்வதற்கும் பராமரிப்பதற்கும் எளிதாக்க உங்கள் குறியீட்டை முழுமையாக ஆவணப்படுத்தவும்.
• பதிப்புக் கட்டுப்பாட்டைப் பயன்படுத்தவும்: பதிப்புக் கட்டுப்பாட்டிற்கு கிட்-ஐப் பயன்படுத்தவும் மற்றும் ஒரு சீரான கிளை உத்தியைப் பின்பற்றவும்.
• உங்கள் பணிப்பாய்வுகளை தானியக்கமாக்குங்கள்: உங்கள் குறியீடு எப்போதும் சோதிக்கப்பட்டு தானாகவே வரிசைப்படுத்தப்படுவதை உறுதிசெய்ய CI/CD உடன் உங்கள் பணிப்பாய்வுகளை தானியக்கமாக்குங்கள்.
• சார்புகளைப் புதுப்பித்த நிலையில் வைத்திருங்கள்: சமீபத்திய அம்சங்கள் மற்றும் பாதுகாப்பு இணைப்புகளிலிருந்து பயனடைய உங்கள் சார்புகளைத் தவறாமல் புதுப்பிக்கவும்.
• செயல்திறனைக் கண்காணிக்கவும்: உங்கள் பயன்பாடுகளின் செயல்திறனைக் கண்காணித்து, சாத்தியமான இடையூறுகளைக் கண்டறியவும்.

மேம்பட்ட Nx கருத்துக்கள்

நீங்கள் Nx-இன் அடிப்படைகளுடன் வசதியாகிவிட்டால், உங்கள் மேம்பாட்டு பணிப்பாய்வுகளை மேலும் மேம்படுத்த சில மேம்பட்ட கருத்துக்களை ஆராயலாம்:

• தனிப்பயன் ஜெனரேட்டர்கள்: புதிய திட்டங்கள், கூறுகள் மற்றும் மாட்யூல்களின் உருவாக்கத்தை தானியக்கமாக்க தனிப்பயன் ஜெனரேட்டர்களை உருவாக்கவும். இது மேம்பாட்டு நேரத்தை கணிசமாகக் குறைத்து நிலைத்தன்மையை உறுதிசெய்யும்.
• Nx பிளகின்கள்: தனிப்பயன் கருவிகள் மற்றும் ஒருங்கிணைப்புகளுடன் Nx-இன் செயல்பாட்டை விரிவுபடுத்த Nx பிளகின்களை உருவாக்கவும்.
• மாட்யூல் ஃபெடரேஷன்: உங்கள் பயன்பாட்டின் சுயாதீனமான பகுதிகளை தனித்தனியாக உருவாக்க மற்றும் வரிசைப்படுத்த மாட்யூல் ஃபெடரேஷனைப் பயன்படுத்தவும். இது வேகமான வரிசைப்படுத்தல்கள் மற்றும் அதிக நெகிழ்வுத்தன்மையை செயல்படுத்துகிறது.
• Nx கிளவுட்: மேம்பட்ட பில்ட் நுண்ணறிவுகள், விநியோகிக்கப்பட்ட பணி செயலாக்கம் மற்றும் ரிமோட் கேச்சிங் ஆகியவற்றைப் பெற Nx கிளவுட் உடன் ஒருங்கிணைக்கவும்.

முடிவுரை

Nx வொர்க்ஸ்பேஸ்கள் ஃபிரன்டென்ட் மோனோரெப்போக்களை நிர்வகிக்க ஒரு சக்திவாய்ந்த மற்றும் திறமையான வழியை வழங்குகின்றன. Nx-இன் மேம்பட்ட கருவிகள் மற்றும் அம்சங்களைப் பயன்படுத்துவதன் மூலம், நீங்கள் குறியீடு பகிர்வு, பில்ட் செயல்திறன் மற்றும் டெவலப்பர் ஒத்துழைப்பை மேம்படுத்தலாம், இதன் விளைவாக அளவிடக்கூடிய மற்றும் பராமரிக்கக்கூடிய ஃபிரன்டென்ட் பயன்பாடுகள் உருவாகின்றன. Nx-ஐ ஏற்றுக்கொள்வது உங்கள் மேம்பாட்டு செயல்முறையை நெறிப்படுத்தலாம் மற்றும் உங்கள் அணிக்கு குறிப்பிடத்தக்க உற்பத்தித்திறன் ஆதாயங்களைத் திறக்கலாம், குறிப்பாக சிக்கலான மற்றும் பெரிய அளவிலான திட்டங்களில் பணிபுரியும்போது. ஃபிரன்டென்ட் நிலப்பரப்பு தொடர்ந்து বিকশিত වන විට, Nx உடன் மோனோரெப்போ மேம்பாட்டில் தேர்ச்சி பெறுவது ஃபிரன்டென்ட் பொறியாளர்களுக்கு பெருகிய முறையில் மதிப்புமிக்க திறமையாக மாறி வருகிறது.

இந்த வழிகாட்டி ஃபிரன்டென்ட் Nx வொர்க்ஸ்பேஸ் மேம்பாட்டின் ஒரு விரிவான கண்ணோட்டத்தை வழங்கியுள்ளது. சிறந்த நடைமுறைகளைப் பின்பற்றுவதன் மூலமும், மேம்பட்ட கருத்துக்களை ஆராய்வதன் மூலமும், நீங்கள் Nx-இன் முழு திறனையும் திறந்து அற்புதமான ஃபிரன்டென்ட் பயன்பாடுகளை உருவாக்கலாம்.