{"id":22444690,"url":"https://github.com/zapkub/react-in-a-nutshell","last_synced_at":"2025-08-01T20:30:45.061Z","repository":{"id":43623955,"uuid":"71657941","full_name":"zapkub/react-in-a-nutshell","owner":"zapkub","description":"This repository is all about beginning to use React. 😪","archived":false,"fork":false,"pushed_at":"2018-12-01T02:42:22.000Z","size":1873,"stargazers_count":5,"open_issues_count":0,"forks_count":3,"subscribers_count":2,"default_branch":"master","last_synced_at":"2023-08-03T01:06:02.736Z","etag":null,"topics":["react"],"latest_commit_sha":null,"homepage":"","language":"PHP","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/zapkub.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":"2016-10-22T18:28:49.000Z","updated_at":"2023-08-03T01:06:02.736Z","dependencies_parsed_at":"2022-09-12T07:01:39.021Z","dependency_job_id":null,"html_url":"https://github.com/zapkub/react-in-a-nutshell","commit_stats":null,"previous_names":[],"tags_count":0,"template":null,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zapkub%2Freact-in-a-nutshell","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zapkub%2Freact-in-a-nutshell/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zapkub%2Freact-in-a-nutshell/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zapkub%2Freact-in-a-nutshell/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zapkub","download_url":"https://codeload.github.com/zapkub/react-in-a-nutshell/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":228402291,"owners_count":17914230,"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"],"created_at":"2024-12-06T03:09:35.184Z","updated_at":"2024-12-06T03:09:36.141Z","avatar_url":"https://github.com/zapkub.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 3 Years of React in 2 days\n\nThe bief history of React since officially public.\nhttps://docs.google.com/spreadsheets/d/1jo8SZYKsHfB_Ck2eyw0oaF79vicXEU0gJS_Dkg71EEI/edit#gid=0\nhttps://discordapp.com/channels/511243930558529550/511243931103657995\n\n\u003e in S(upid)B(ut)W(orks) style\n\n### Prerequisite\n- NodeJS 9.11.2\n- Operation system อะไรก็ได้ที่มี bash และใช้ / ที่ directory path \n- IDE อะไรก็ได้ที่พิมพ์ตัวหนังสือได้\n- Brain 🧠\n\n# Intensive React Agenda\n### Basic React essentials 🐸\n- Mounting first component ( react-dom )\n- Component API and Component Types\n- JSX\n- Props and State ( Introducing Hooks API )\n- Form 📄( input, select, radio, checkedbox )\n\n### Experimental\n- Basic setup with Create React App\n\n\n# DEEEEP dive Agenda \n\u003e (Full course will be extended every topic from intensive)\n\n## Boring part\n### Brief history of Front-end development with speed of light 🦄\n- Javascript ES2016 แล้ว\n- DOM คือทุกสิ่งอย่างของการทำ Front end\n\n### คิดแบบ React vs jQuery 🦄\n- DOM selector vs React tree\n- State ของ UI\n- HTML template not considered vs JSX\n\n### Design Pattern with React \n- Higher order component (nearly deprecated) 🐸\n- Flux 🐸\n- Context (เกือบ deprecated แต่กลับมาอีกรอบ) 🦄\n- Function as Child Component ( อันใหม่และต้องใช้ ) 🦄\n\n### Deep dive 🦄 , 🐸\n- Provider and Consumer\n- Fragment\n- Portal\n- Hooks and Custom Hooks ( pre release )\n- Server side rendering\n\n## Fun part\n### Real life or just fantasy\n- Singleton store MobX / Redux / Hooks\n- Styling Bootstrap, SASS\n- Create React App, NextJS\n\n### Implementation and adopt React to legacy project (Adoptation)\n- from jQuery project\n- from Angular project\n\n\n### LAB LAB LAB\n- Todos Flux Singleton state management by Hooks API and Context API\n\n\n### More and beyond\n- Typescript\n- GraphQL\n\nproject with create React app [Here](https://github.com/facebook/create-react-app)\n\n\n\n# Live Demo \n- https://zapkub.github.io/react-in-a-nutshell/#\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzapkub%2Freact-in-a-nutshell","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzapkub%2Freact-in-a-nutshell","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzapkub%2Freact-in-a-nutshell/lists"}