Материал для работы с библиотекой ReactJS. В данном репозитории моя 'песочница' для закрепления материалов при прохождении обучающих курсов.В данном репозитории рассматриваются новые версии библиотеки, обновлённые и добавленные возможности. А так же функциональности которые устаревают. Это помогает мне понять как работает ReactJS.
- клонируйте репозиторий:
git clone https://github.com/Barbaris2/-sandbox-ReactJS.git
- уcтановите зависимости:
yarn install
илиnpm install
- перейдите в нужную ветку(см. описание веток ниже):
git checkout <branch name>
- запустите проект:
yarn start
ornpm start
- откройте http://localhost:3000 в Вашем браузере.
git checkout master
- пустой проект Create React App.git checkout 01_createContext
- передача данных через дерево компонентов без передачи пропсов. (смотреть на codeSandbox.io)git checkout 02_createContext_contextType
- передача данных через дерево компонентов с статическим свойством static contextType для работы с контекстом. (смотреть на codeSandbox.io)git checkout 03_memo
- оптимизация рендеринга DOM-дерева при помощи HOC React.memo(). Используется для простых функциональных компонентов. Если пропсы не изменились, рендеринга не произойдет. (смотреть на codeSandbox.io)git checkout 04_Routing
- маршрутизация с использованием библиотеки react-router-dom. (смотреть на codeSandbox.io)git checkout 05_lazy
- React.lazy() - метод из API - React suspense, который может грузить компоненты асинхронно. Позволяет определять компонент, который загружается динамически. Работает только если рендеринг происходит на клиенте. (смотреть на codeSandbox.io)git checkout 06_getDerivedStateFromError
- это улучшенная функциональность метода componentDidCatch для отлавливания ошибок рендеринга в дочерних компонентах. (смотреть на codeSandbox.io)git checkout 07_useContext
- useContext() - хук для использования контекста. (смотреть на codeSandbox.io)git checkout 08_useState
- useState() - хук для использования state внутри функционального компонента. (смотреть на codeSandbox.io)git checkout 09_useEffect
- useEffect() метод жизненного цикла, представляет собой совокупность методов componentDidMount, componentDidUpdate, и componentWillUnmount. (смотреть на codeSandbox.io)
git checkout master
git checkout 01_createContext
git checkout 02_createContext_contextType
git checkout 03_memo
git checkout 04_Routing
git checkout 05_lazy
git checkout 06_getDerivedStateFromError
git checkout 07_useContext
git checkout 08_useState
git checkout 09_useEffect