https://github.com/notsu/fullstack-course
https://github.com/notsu/fullstack-course
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/notsu/fullstack-course
- Owner: notsu
- Created: 2023-09-10T08:24:19.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2023-11-27T15:02:21.000Z (over 2 years ago)
- Last Synced: 2023-11-27T16:27:19.845Z (over 2 years ago)
- Language: Vue
- Homepage: https://fullstack-course-murex.vercel.app
- Size: 1.12 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Portfolio Website
Frontend: https://fullstack-course-murex.vercel.app/
Backend: https://fullstack-course-backend.vercel.app/
## How to use this repo
Checkout following branches to learn step-by-step.
### Frontend Development
1. `frontend-01-nuxt`
1. ติดตั้ง Nuxt
2. ทำความรู้จัก TailwindCSS
3. ติดตั้ง TailwindCSS
4. ลองสร้าง Components ด้วย TailwindCSS
5. ทำความรู้จัก ``
6. ทำความรู้จัก ``
2. `frontend-02-pages-and-layouts`
1. ทำความรู้จัก pages
2. สร้าง page หน้าแรก
3. สร้าง page หน้า portfolio
4. สร้าง page หน้า login
5. สร้าง layout สำหรับหน้าปกติ
6. สร้าง layout สำหรับหน้า login
3. `frontend-03-component-badge`
1. ทำความรู้จัก components
2. base prefix
3. ลองสร้าง BadgeItem
4. รู้จัก slot
5. ลองสร้าง BadgeList
6. รู้จัก for loop
7. รู้จัก props
4. `frontend-04-component-button-and-link`
1. ลองสร้าง Button
2. ลองสร้าง Link
3. ทำความรู้จัก Composables
4. รู้จัก Fallthrough attributes
5. `frontend-05-component-icon`
1. ทำความรู้จักการสร้าง icon
2. การนำ icon ไปใช้
6. `frontend-06-component-header`
1. การสร้าง component สำหรับใช้ครั้งเดียว
2. นำไปใช้ใน layout
7. `frontend-07-component-footer`
1. นำไปใช้ใน layout
8. `frontend-08-page-homepage`
1. รู้จักกับ useHead
2. และจะเริ่มสร้างรายละเอียดของหน้าแรก
9. `frontend-09-component-skill-list`
1. สร้างรายละเอียดของหน้า skill list
2. ทำความรู้จัก if else condiution
3. ทำความรู้จัก event
10. `frontend-10-component-experience-item`
1. ทำความรู้จักกับ moment
2. ทำความรู้จักกับ computed
11. `frontend-11-component-experience-list`
1. สร้าง list สำหรับ experience
12. `frontend-12-component-portfolio-list`
1. สร้าง list สำหรับ portfolio
13. `frontend-13-page-login`
1. เราจะเริ่ม implement หน้า login กัน
14. `frontend-14-component-login-form`
1. รู้จักกับ vee-validate
2. รู้จักกับ middlewares
3. รู้จักกับ prism เพื่อจำลอง API ของ Open API (Swagger)
15. `frontend-15-component-input`
1. สร้าง input component
16. `frontend-16-component-error-message`
1. สร้าง error message สำหรับแสดง error
17. `frontend-17-state-management`
1. รู้จักกับสิ่งที่้เรียกว่า stage management
18. `frontend-18-store-pinia`
1. pinia เข้ามาช่วยอะไร
19. `frontend-19-store-auth`
1. เขียน store ของ auth
20. `frontend-20-component-skill-form`
1. สร้าง skill form ขึ้นมา
21. `frontend-21-component-editable`
1. สร้าง editable เพื่อใช้แสดง mode ของ view และ edit
22. `frontend-22-store-profile-skill`
1. implement store สำหรับ profile โดยเริ่มจาก skill
23. `frontend-23-component-experience-form`
1. สร้าง form สำหรับ experience
24. `frontend-24-component-experience-form-field`
1. สร้าง form สำหรับ experience ในแต่ละก้อนย่อย
25. `frontend-25-store-profile-experience`
1. implement store สำหรับ experience
26. `frontend-26-store-profile-portfolio`
1. implement store สำหรับ portfolio
27. `frontend-27-page-portfolio-id`
1. implement portfolio page
2. ทำความรู้จัก carousel
### Backend Development
1. `backend-01-handler-auth`
1. ทำความรู้จัก express.js
2. ทำความรู้จัก dependency injection
3. สร้าง handler เพื่อส่งค่า login กลับไป
2. `backend-02-handler-profile`
1. สร้าง handler เพื่อส่งค่า login กลับไป
3. `backend-03-handler-portfolio`
1. สร้าง handler เพื่อส่งค่า login กลับไป
4. `backend-04-service-auth`
1. เติม service ใน dependency injection
2. ย้าย business logic มาไว้ในนี้
3. เขียน validation
5. `backend-05-service-profile`
1. เติม service ใน dependency injection
2. ย้าย business logic มาไว้ในนี้
3. เขียน validation
6. `backend-06-service-portfolio`
1. เติม service ใน dependency injection
2. ย้าย business logic มาไว้ในนี้
3. เขียน validation
7. `backend-07-repository-user`
1. สร้าง mongoose
2. implement repository
3. เติม repository ใน dependency injection
4. เปลี่ยนให้ service มาเรียกใช้ mongodb
8. `backend-08-repository-profile`
1. สร้าง mongoose
2. implement repository
3. เติม repository ใน dependency injection
4. เปลี่ยนให้ service มาเรียกใช้ mongodb
9. `backend-09-repository-portfolio`
1. สร้าง mongoose
2. implement repository
3. เติม repository ใน dependency injection
4. เปลี่ยนให้ service มาเรียกใช้ mongodb