{"id":19486016,"url":"https://github.com/yauhenkavalchuk/typescript-react","last_synced_at":"2025-04-25T18:31:46.516Z","repository":{"id":39025743,"uuid":"245810680","full_name":"YauhenKavalchuk/typescript-react","owner":"YauhenKavalchuk","description":"Код учебного курса “TypeScript \u0026 React” на YouTube-канале webDev (https://tinyurl.com/jryuc5zs)","archived":false,"fork":false,"pushed_at":"2023-01-05T12:13:03.000Z","size":979,"stargazers_count":77,"open_issues_count":10,"forks_count":39,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-04-04T01:05:10.914Z","etag":null,"topics":["react","reactjs","redux","typescript"],"latest_commit_sha":null,"homepage":"http://youtube.com/c/YauhenKavalchuk/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/YauhenKavalchuk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-03-08T12:31:56.000Z","updated_at":"2025-02-04T09:55:30.000Z","dependencies_parsed_at":"2023-02-04T04:34:16.283Z","dependency_job_id":null,"html_url":"https://github.com/YauhenKavalchuk/typescript-react","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YauhenKavalchuk%2Ftypescript-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YauhenKavalchuk%2Ftypescript-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YauhenKavalchuk%2Ftypescript-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/YauhenKavalchuk%2Ftypescript-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/YauhenKavalchuk","download_url":"https://codeload.github.com/YauhenKavalchuk/typescript-react/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250872152,"owners_count":21500772,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["react","reactjs","redux","typescript"],"created_at":"2024-11-10T20:32:57.537Z","updated_at":"2025-04-25T18:31:46.054Z","avatar_url":"https://github.com/YauhenKavalchuk.png","language":"HTML","funding_links":["https://www.patreon.com/YauhenKavalchuk"],"categories":[],"sub_categories":[],"readme":"#  Typescript \u0026 React\r\n\r\n### Описание курса:\r\nВ данном видеокурсе мы с вами рассмотрим связку библиотеки React и синтаксиса TypeScript. Из библиотеки мы разберём типизацию функциональных и классовых компонентов, событий и элементов, методов жизненного цикла, контекста и портала и конечно же хуки. А в дополнение рассмотрим типизацию React-роутера и Redux.\r\n\r\n### Поддержать развитие канала:\r\n[\u003cimg alt=\"webDev | YouTube Sponsor\" src=\"https://img.shields.io/badge/Become a sponsor-F70000.svg?\u0026style=for-the-badge\u0026logo=youtube\u0026logoColor=fff\" /\u003e][sponsor]\r\n[\u003cimg alt=\"webDev | Patreon\" src=\"https://img.shields.io/badge/Become a patron-EF6451.svg?\u0026style=for-the-badge\u0026logo=patreon\u0026logoColor=fff\" /\u003e][patron]\r\n\r\n---\r\n\r\n### Используемые ресурсы и инструменты:\r\n- [Visual Studio Code (редактор кода)](https://code.visualstudio.com)\r\n- [Create React App (рабочее окружение)](https://github.com/facebook/create-react-app)\r\n- [Redux Devtools (расширение для браузера)](https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd?hl=ru)\r\n- [Fake online REST API](https://jsonplaceholder.typicode.com/)\r\n- [Redux-LocalStorage-Simple](https://www.npmjs.com/package/redux-localstorage-simple)\r\n\r\n### Полезные ссылки:\r\n- [Description \"tsconfig.json\"](https://gist.github.com/YauhenKavalchuk/69054ba65e7863226e531b74cb33f060)\r\n- [React Context](https://youtu.be/W_-TO_reSGs)\r\n- [React Portal](https://youtu.be/xcWaYD4gZAs)\r\n- [React Typescript Cheatsheet](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet)\r\n- [TypeScript and React(stefan baumgartner)](https://fettblog.eu/typescript-react/)\r\n- [TypeScript React Starter](https://github.com/Microsoft/TypeScript-React-Starter#typescript-react-starter)\r\n- [React Static Type Checking](https://reactjs.org/docs/static-type-checking.html)\r\n\r\n### Issues:\r\n- [React.FC doesn't allow bare return of children](https://github.com/DefinitelyTyped/DefinitelyTyped/issues/33006)\r\n- [FunctionComponent and ComponentClass are not compatible with LibraryManagedAttributes](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/87)\r\n- [HOC returned component props can not differ from HOC generic props](https://github.com/Microsoft/TypeScript/issues/28938#issuecomment-450636046)\r\n\r\n---\r\n\r\n### Быстрый старт:\r\n- Клонируйте репозиторий: `git clone https://github.com/YauhenKavalchuk/typescript-react.git`\r\n- Перейдите в папку с проектом `cd typescript-react`\r\n- Перейдите в нужную ветку соответствующую уроку:\r\n  - `git checkout lesson_01`\r\n  - `git checkout lesson_02`\r\n  - `git checkout lesson_10` и т.д.\r\n- Установите зависимости: `yarn install`\r\n- Запустите проект: `yarn start`\r\n\r\n---\r\n\r\n### Список уроков:\r\n- [#0 Введение (Introduction)](https://youtu.be/acO37eSCowc)\r\n- [#1 Установка окружения (Setup Environment)](https://youtu.be/VDJcfJ1j7Bs)\r\n- [#2 Типизация функциональных компонентов (Typing of Functional Components)](https://youtu.be/yc5acYhDM48)\r\n- [#3 Типизация классовых компоненты (Typing of Class Components)](https://youtu.be/wIheTSFF7Ew)\r\n- [#4 Типизация событий (Typing of Events)](https://youtu.be/HKHVWBCp9v0)\r\n- [#5 Типизация элементов (Typing of Elements)](https://youtu.be/YcQox-kw4GI)\r\n- [#6 Типизация контекста и портала (Typing of Context \u0026 Portal)](https://youtu.be/SaRPd9DwyoM)\r\n- [#7 Типизация Хуков (Typing of Hooks)](https://youtu.be/TBCx-P76dVw)\r\n- [#8 Типизация ХОК-ов (Typing of HOCs)](https://youtu.be/mk-zHOqaqYI)\r\n- [#9 Типизация Роутера (Typing of React Router)](https://youtu.be/d5BFgyjFMLQ)\r\n- [#10 Типизация асинхронных функций (Typing of Fetch with Async \u0026 Await)](https://youtu.be/-oey4jgc22k)\r\n- [#11 Типизация Редакса (Typing of Redux. Part I)](https://youtu.be/vFhiS6__ARE)\r\n- [#12 Типизация Редакса (Typing of Redux. Part II)](https://youtu.be/8wlMmp2M7MI)\r\n\r\n---\r\n\r\n### Связаться со мной:\r\n[\u003cimg alt=\"webDev | YouTube\" src=\"https://img.shields.io/badge/youtube-FF0000.svg?\u0026style=for-the-badge\u0026logo=Instagram\u0026logoColor=white\" /\u003e][youtube]\r\n[\u003cimg alt=\"webDev | Instagram\" src=\"https://img.shields.io/badge/instagram-E4405F.svg?\u0026style=for-the-badge\u0026logo=Instagram\u0026logoColor=white\" /\u003e][instagram]\r\n[\u003cimg alt=\"webDev | LinkedIn\" src=\"https://img.shields.io/badge/linkedin-0077B5.svg?\u0026style=for-the-badge\u0026logo=linkedin\u0026logoColor=white\" /\u003e][linkedin]\r\n[\u003cimg alt=\"webDev | Twitter\" src=\"https://img.shields.io/badge/twitter-1DA1F2.svg?\u0026style=for-the-badge\u0026logo=Twitter\u0026logoColor=white\" /\u003e][twitter]\r\n[\u003cimg alt=\"webDev | VK\" src=\"https://img.shields.io/badge/vk-4680C2.svg?\u0026style=for-the-badge\u0026logo=Twitter\u0026logoColor=white\" /\u003e][vk]\r\n\r\n[youtube]: https://youtube.com/YauhenKavalchuk\r\n[instagram]: https://instagram.com/YauhenKavalchuk\r\n[linkedin]: https://linkedin.com/in/YauhenKavalchuk\r\n[vk]: https://vk.com/YauhenKavalchuk\r\n[twitter]: https://twitter.com/YauhenKavalchuk\r\n[sponsor]: https://www.youtube.com/channel/UCE9ODjNIkOHrnSdkYWLfYhg/join\r\n[patron]: https://www.patreon.com/YauhenKavalchuk\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyauhenkavalchuk%2Ftypescript-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyauhenkavalchuk%2Ftypescript-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyauhenkavalchuk%2Ftypescript-react/lists"}