{"id":18647910,"url":"https://github.com/potchangelo/react-just-react","last_synced_at":"2025-04-11T13:30:55.022Z","repository":{"id":43666614,"uuid":"329234248","full_name":"potchangelo/react-just-react","owner":"potchangelo","description":"ตัวอย่างโปรเจ็ค React จากคลิปสอน React ตั้งแต่ Ep.2-20 ของ Zinglecode ","archived":false,"fork":false,"pushed_at":"2023-07-01T10:43:48.000Z","size":800,"stargazers_count":7,"open_issues_count":0,"forks_count":6,"subscribers_count":1,"default_branch":"master","last_synced_at":"2024-05-28T19:47:06.085Z","etag":null,"topics":["react","react-components","react-hooks","react-router","react-styled-component","react-testing-library","reactjs"],"latest_commit_sha":null,"homepage":"https://www.youtube.com/watch?v=dxm-Mtd-LPs\u0026list=PL_xSQKvnccpn-C2fZNJtCykO24yqFWkDn\u0026index=2","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/potchangelo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-01-13T07:57:35.000Z","updated_at":"2023-07-13T16:17:43.000Z","dependencies_parsed_at":"2022-09-05T16:50:46.148Z","dependency_job_id":null,"html_url":"https://github.com/potchangelo/react-just-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/potchangelo%2Freact-just-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/potchangelo%2Freact-just-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/potchangelo%2Freact-just-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/potchangelo%2Freact-just-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/potchangelo","download_url":"https://codeload.github.com/potchangelo/react-just-react/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223469644,"owners_count":17150393,"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","react-components","react-hooks","react-router","react-styled-component","react-testing-library","reactjs"],"created_at":"2024-11-07T06:28:17.875Z","updated_at":"2024-11-07T06:28:18.671Z","avatar_url":"https://github.com/potchangelo.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Just React examples code\n\nตัวอย่างโปรเจ็ค React จากคลิปสอน Ep.2-20 ของ Zinglecode\n\n\n## YouTube video with playlist\n\nhttps://www.youtube.com/watch?v=dxm-Mtd-LPs\u0026list=PL_xSQKvnccpn-C2fZNJtCykO24yqFWkDn\u0026index=2\n\n\n## About React Router\n\nเนื่องจาก React Router ที่ใช้ใน Github Repo อันนี้เป็น v5 (ตัวเก่า) ดังนั้นถ้าใครอยากดูตัวอย่างโค้ดของ React Router v6 (ตัวปัจจุบัน) กรุณาเปิดดูได้จากลิ้งค์นี้\n\nhttps://github.com/potchangelo/react-just-react-router-v6\n\n\n## Install and Run project on VSCode\n\n0. ติดตั้ง Node.js ลงเครื่องให้เรียบร้อยก่อน (ใช้ Version 14, 16, หรือ 18 ก็ได้)\n\n1. ดาวน์โหลดโปรเจ็คนี้ลงเครื่อง (เลือกจาก Github branch ที่ต้องการได้)\n\n2. เปิดโฟลเดอร์โปรเจ็คใน VSCode\n\n3. เปิด VSCode Terminal\n\n4. ติดตั้ง Packages ของโปรเจ็ค (สามารถแก้ไขเลขเวอร์ชั่นของ Packages, Libraries ต่างๆ ให้เป็นเวอร์ชั่นล่าสุด ก่อนทำการติดตั้งได้ ที่ในไฟล์ package.json)\n\n```\nnpm install\n```\n\n5. Run เว็บโปรเจ็ค\n\n```\nnpm start\n```\n\n## Github branches for each episodes\n\n1. [Start](https://github.com/potchangelo/react-just-react/tree/01-start)\n2. [State x Object](https://github.com/potchangelo/react-just-react/tree/02-state-x-object)\n3. [State x Array (Add)](https://github.com/potchangelo/react-just-react/tree/03-state-x-array-01)\n4. [State x Array (Delete)](https://github.com/potchangelo/react-just-react/tree/04-state-x-array-02)\n5. [State x Array (Edit)](https://github.com/potchangelo/react-just-react/tree/05-state-x-array-03)\n6. [useEffect](https://github.com/potchangelo/react-just-react/tree/06-effect)\n7. [useEffect return](https://github.com/potchangelo/react-just-react/tree/07-effect-return)\n8. [useContext](https://github.com/potchangelo/react-just-react/tree/08-context)\n9. [useContext x useState](https://github.com/potchangelo/react-just-react/tree/09-context-state)\n10. [useContext x useReducer](https://github.com/potchangelo/react-just-react/tree/10-context-reducer)\n11. [useRef](https://github.com/potchangelo/react-just-react/tree/11-ref)\n12. [forwardRef](https://github.com/potchangelo/react-just-react/tree/12-forward-ref)\n13. [Layout Components](https://github.com/potchangelo/react-just-react/tree/13-layout-components)\n14. [CSS Modules](https://github.com/potchangelo/react-just-react/tree/14-css-modules)\n15. [styled-components](https://github.com/potchangelo/react-just-react/tree/15-styled-components)\n16. [React Router basic routes](https://github.com/potchangelo/react-just-react/tree/16-react-router)\n17. [React Router nested routes](https://github.com/potchangelo/react-just-react/tree/17-react-router-nested)\n18. [React Router dynamic routes](https://github.com/potchangelo/react-just-react/tree/18-react-router-dynamic)\n19. [React Testing Library](https://github.com/potchangelo/react-just-react/tree/19-react-testing-library)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpotchangelo%2Freact-just-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpotchangelo%2Freact-just-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpotchangelo%2Freact-just-react/lists"}