Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/potchangelo/react-just-tattoo
ตัวอย่างโปรเจ็ค React จากคลิป "สอน React เบื้องต้น จนใช้ได้จริง #01" ของ Zinglecode
https://github.com/potchangelo/react-just-tattoo
react react-components react-hooks reactjs
Last synced: 1 day ago
JSON representation
ตัวอย่างโปรเจ็ค React จากคลิป "สอน React เบื้องต้น จนใช้ได้จริง #01" ของ Zinglecode
- Host: GitHub
- URL: https://github.com/potchangelo/react-just-tattoo
- Owner: potchangelo
- License: mit
- Created: 2020-11-28T14:12:14.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2024-01-10T20:15:10.000Z (10 months ago)
- Last Synced: 2024-05-28T19:47:06.170Z (5 months ago)
- Topics: react, react-components, react-hooks, reactjs
- Language: JavaScript
- Homepage: https://just-tattoo.netlify.app/
- Size: 4.19 MB
- Stars: 9
- Watchers: 1
- Forks: 17
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React Just Tattoo
https://just-tattoo.netlify.app/
ตัวอย่างโปรเจ็ค React จากคลิป "สอน React เบื้องต้น จนใช้ได้จริง #01" ของ Zinglecode
Note: ทำขึ้นมาเพื่อการศึกษาทางการเขียนโปรแกรมเท่านั้น เนื้อหาบนเว็บไม่ใช่สินค้าหรือบริการที่มีอยู่จริง
Note 2: อัพเดทโค้ดเป็น React v.18 ณ วันที่ 26/4/2022 ซึ่ง v.18 กับ v.17 โค้ดเหมือนกันทั้งหมดครับ (มีอัพเดทโค้ดแค่ในไฟล์ index.js นิดเดียวเท่านั้น) ดังนั้นสามารถศึกษา React จากในคลิปที่ใช้ v.17 ได้เลย สามารถนำโค้ดมาใช้กับ v.18 ได้อย่างไม่มีปัญหา
## YouTube video
https://www.youtube.com/watch?v=ojT758BNvqg
## Install and Run project on VSCode
0. ติดตั้ง Node.js ลงเครื่องให้เรียบร้อยก่อน (ใช้ Version 14 หรือ 16 ก็ได้)
1. ดาวน์โหลดโปรเจ็คนี้ลงเครื่อง
2. เปิดโฟลเดอร์โปรเจ็คใน VSCode
3. เปิด VSCode Terminal
4. ติดตั้ง Packages ของโปรเจ็ค
```
npm install
```
5. Run เว็บโปรเจ็ค
```
npm start
```
## Github branches for each lessons
1. [Create React App](https://github.com/potchangelo/react-just-tattoo/tree/01)
2. [JSX](https://github.com/potchangelo/react-just-tattoo/tree/02)
3. [CSS](https://github.com/potchangelo/react-just-tattoo/tree/03)
4. [Static files](https://github.com/potchangelo/react-just-tattoo/tree/04)
5. [Components](https://github.com/potchangelo/react-just-tattoo/tree/05)
6. [Props](https://github.com/potchangelo/react-just-tattoo/tree/06)
7. [States](https://github.com/potchangelo/react-just-tattoo/tree/07)
8. [Events](https://github.com/potchangelo/react-just-tattoo/tree/08)
9. [Form input](https://github.com/potchangelo/react-just-tattoo/tree/09)
## Credits
https://unsplash.com/photos/RBsrv4yV5KY
https://unsplash.com/photos/Lw4tNcvEaE8
https://unsplash.com/photos/aTiGszXqrJE
https://unsplash.com/photos/ftoD84_RRdM
https://unsplash.com/photos/Y6TOX6LnIGs
https://unsplash.com/photos/m1lS3CwUOus