{"id":15117077,"url":"https://github.com/Drag13/react-learning-course-short","last_synced_at":"2025-09-27T22:32:03.970Z","repository":{"id":40368564,"uuid":"475789896","full_name":"Drag13/react-learning-course-short","owner":"Drag13","description":"This repo dedicated to the course \"React for Beginners\". The course was created to support Ukraine 🇺🇦 and Ukrainians in the war against russia. It's completely free and open-sourced. ","archived":false,"fork":false,"pushed_at":"2023-10-13T06:44:30.000Z","size":24795,"stargazers_count":143,"open_issues_count":0,"forks_count":19,"subscribers_count":6,"default_branch":"master","last_synced_at":"2024-05-23T02:22:05.604Z","etag":null,"topics":["course","learning","mobx","reacjs","react","tutorial"],"latest_commit_sha":null,"homepage":"https://drag13.io/react-learning-course-short/react-intro/index.html","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Drag13.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null},"funding":{"open_collective":"farstar"}},"created_at":"2022-03-30T08:34:37.000Z","updated_at":"2024-05-20T05:31:32.000Z","dependencies_parsed_at":"2024-02-05T12:14:48.196Z","dependency_job_id":null,"html_url":"https://github.com/Drag13/react-learning-course-short","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/Drag13%2Freact-learning-course-short","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Drag13%2Freact-learning-course-short/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Drag13%2Freact-learning-course-short/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Drag13%2Freact-learning-course-short/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Drag13","download_url":"https://codeload.github.com/Drag13/react-learning-course-short/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234462156,"owners_count":18837274,"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":["course","learning","mobx","reacjs","react","tutorial"],"created_at":"2024-09-26T01:45:49.645Z","updated_at":"2025-09-27T22:32:02.155Z","avatar_url":"https://github.com/Drag13.png","language":"HTML","funding_links":["https://opencollective.com/farstar"],"categories":["HTML"],"sub_categories":[],"readme":"[![StandsWithUkraine](https://raw.githubusercontent.com/Drag13/drag13.github.io/development/swu.PNG)](https://savelife.in.ua/en/donate/)\n\n# React For Beginners - Free Course by Itera\n\n## [Watch on YouTube](https://www.youtube.com/channel/UCg-txtmOEQ8BniR8008O1mA)\n\n## About\n\n**DISCLAIMER:**\nAll requests to \"remove politics\" will be removed completely without any comments. If you have another opinion - just skip this course.\n\nThis repo dedicated to the course \"React for Beginners\". The course was created to support Ukraine 🇺🇦 and Ukrainians in the war against russia. It's completely free and open-sourced. Feel free to contribute or make any relevant suggestions.\n\n- Full program is [here](PROGRAM.md)\n- Presentations can be found here - [https://drag13.io/react-learning-course-short/react-intro](https://drag13.io/react-learning-course-short/react-intro) where is the name of the lesson\n- Changelog is [here](CHANGELOG.md)\n- Video - published [here](https://www.youtube.com/channel/UCg-txtmOEQ8BniR8008O1mA)\n- Technical details are [here](devlog.md)\n\n## Roadmap\n\n* Course program                  - done ✅\n* Repository setup                - done ✅\n* Prepare materials               - done ✅\n* On-line                         - done ✅\n* Retrospective                   - done ✅\n* Updates                         - done ✅ \n* Second iteration                - done ✅ \n\n## PreRequisites\n\nBasic knowledge with HTML/CSS/JS\n\nSelf check:\n\n- Example of the block element, how to draw a button\n- What is the width of block element, how to center element (vertically and horizontally)\n- What does `.map` returns, how to sum all values in array\n\nBasic knowledge with GIT:\n\nSelf Check:\n\n- How to create new repository, how to push to remote\n\nExisting account at [https://github.com](https://github.com)\nInstalled [Node.JS](https://nodejs.org/en/) with NPM\nInstalled [VsCode](https://code.visualstudio.com/)\n\n## Program summary\n\n### 0: [What is React](https://youtu.be/fQ_UNyQBiqg)\n\n### 1: [A New Project With Create-React-App](https://youtu.be/2r1TW9yPhlQ)\n\n### 2: [My first react app with Vite](https://youtu.be/J_826v3GuCE)\n\n### 3: [What is React Component](https://youtu.be/BPIeZqomYQw)\n\n### 4: [React and Props](https://youtu.be/1gLLa4fJ1JQ)\n\n### 5: [React and Hooks](https://youtu.be/6AHDZGumKZg)\n\n### 6: [Building React Component](https://drag13.io/react-learning-course-short/react-new-component)\n\n### 7: [React - From CSS to CSSinJS](https://www.youtube.com/watch?v=8al4xMhWWCE)\n\n### 8: [Managing State in React](https://youtu.be/2KTqbf31cLw)\n\n### 9: [Forms - Default Way and React-Hook-Forms](https://youtu.be/gwrMDwYLIWs)\n\n### 10: [Routing in React](https://youtu.be/D0Fkm63FoSY)\n\n### 11: [React and Network](https://youtu.be/Tm6l612v2v0)\n\n### 12: [UI Libraries](https://youtu.be/4Dsgzk-GuX8)\n\n### 13: [Testing Your Code](https://youtu.be/ASI73nQ9zP8)\n\n### 14: [TypeScript For Beginners](https://youtu.be/ND-XaEQ4VSk)\n\n### 15: [Useful tools for the web developer](https://drag13.io/react-learning-course-short/web-tools)\n\n### 16: [SOLID \u0026amp; React](https://youtube.com/live/1D80PMHEBa0)\n\n## Donations\n\nAll donations are highly welcomed. You can donate any amount to the [National Bank of Ukraine directly](https://bank.gov.ua/en/news/all/natsionalniy-bank-vidkriv-spetsrahunok-dlya-zboru-koshtiv-na-potrebi-armiyi) or to the well known [charity fund Come Back Alive](https://www.comebackalive.in.ua/donate).\n\nFeel free to contact me directly if any question\n\n## Sponsors\n\n[![](/presentations/shared/imgs/Itera-logo-white-fuchsia.jpg)](itera.com)\n\n## Information support\n\n[![beerjs](./presentations/shared/imgs/39900370_1138320566319759_9157901823137284096_n.jpg)](https://t.me/beerJSZhytomyr)\n\n[![node.recipes](./presentations/shared/imgs/njsr.png)](http://node.recipes/)\n\n[![Babich Lviv CSS](./presentations/shared/imgs/babich.jpg)](https://t.me/toisamyibabich)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FDrag13%2Freact-learning-course-short","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FDrag13%2Freact-learning-course-short","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FDrag13%2Freact-learning-course-short/lists"}