👨‍👧‍👦Context

კონტექსტი რა არის დიდად მაგის ახსნას არ დავიწყებ უბრალოდ წესებს ჩამოვწერ აქ ^^

კონტექსტის გამოყენებისას ზოგადად ის არ უნდა დაგავიწყდეთ რომ კონტექსტი მაინც და მაინც გლობალური არ უნდა იყოს, უმეტესობა ქეისი გლობალურია კი მაგრამ ასევე არ მოგერიდოთ რომ კონტექსტი ვიწრო წრეში შექმნილი იყოს და მარტო რამდენიმე კომპონენტს ქონდეს მასზე წვდომა.

რაც შეეხება გამოყენების წესებს, თუ რაიმე კონტექსტი არის გლობალური მაშინ უნდა შეიქმნას სხვა საქაღალდეების გვერდზე contexts საქაღალდეში და ფაილს უნდა დაერქვას სახელი PascalCase-ში და ქონდეს კონტექსტის პრეფიქსი, შიგნით კი უნდა ეწეროს ამდაგვარი რამ:

import { createContext, useState } from 'react';

const defaults = {
   setTheme: () => {},
   theme: ''
};

export const ThemeContext = createContext<{
    setTheme: (theme: string) => void;
    theme: string
}>(defaults);

const ThemeContextProvider: React.FC<{ children: React.ReactNode }> = (props) => {
   const [theme, setTheme] = useState(defaults.theme);
   
   const changeTheme = (theme: string) => {
      setTheme(theme);
   }
   
   return (
      <ThemeContext.Provider value={{ theme, setTheme: changeTheme }}>
         {props.children}
      </ThemeContext.Provider>
   )
}

შემდეგ გამოყენებისთვის თუ ეს გლობალური კონტექსტია მაშინ უმჯობესია თუ ერთ Providers ვრაპერ კომპონენტს შევქმნით და ყველა კონტქექტს მანდ გავწერთ იმისთვის რომ ადვილი წასაკითხი გახდეს.

ყურადღება იმას მიაქციეთ რომ მე უბრალოდ setTheme არ დავეაქსპორტე და ვრაპერ ფუნქცია შევქმენი რაც ეხლა არაფერს არ აკეთებს, ალბათ გაინტერესებთ თუ რატომ ვქენი ეს? და რატო გიწევთ ამაზე რეკომენდაციას.

როცა რაიმე კონტექსტს ვქმნით მას გამოიყენებს საკმაოდ ბევრი კომპონენტი. შეიძლება საერთოდაც გლობალური იყოს და ეს სტეიტიც ბევრი ადგილიდან შეიცვლება მე რომ setTheme გადავაწოდ ეგრევე ეს იმ პრობლეამს გამოიწვევს რომ ერთი ცენტრალური კონტროლის ადგილს დავკარგავთ, რაც შეიძლება ხშირად საჭირო გახდეს ვალიდაცისთვის, ანალიტიკისთვის, სტეიტის უკეთესი კონტროლისთვის და სხვა უამრავი მიზეზის გამო, უმეტესობა კონტექტს რასაც გააკეთებთ დაგჭირდებათ ერთი ცენტრალური ადგილი გასაკონტროლებლად და ამის გამო უმჯობესია თუ დაწერისთანავე გამოიჩენთ ამ წინდახედულობას და ასე დაწერთ მერე თქვენ თავს მადლობას ეტყვით.

ამის გარდა კიდე ერთი რჩევა კონტექსტზე - ძალიან ხშირად არ გამოიყენოთ. Passing stuff as props is just fine most of the time, don't overthink it. ეს იმის გამო რომ კონტექსტიც შეიძლება ხელიდან გაგეპაროთ, ყვეალფერი კონტექტში არ უნდა იყოს და ყველaფერზე ბევრ კომპონენტს წვდომა არ უნდა ქონდეს, ეს რომ ქნათ ძალიან გაძნელდება თქვენს აპლიკაციაში მიხვედრა საიდან რა ხდება და რატომ. ფიქრი თქვენი აპლიკციის state-ზე საკმაოდ გაძნელდება.

თვითონ გამოყენებას რაც შეეხება, ბევრი რამე არ არის მანდ გასათვალისწინებელი იმის გარდა რომ, რა თქმა უნდა, useContext უნდა გამოიყენოთ ამისთვის. მომავალში ეს ჰუკი არავალიდური გახდება ოღონდ და use ჰუკი ჩაანაცვლებს, so keep that in mind 😉