#1 tech recruiter in thailand

5 Free Project-Based Tutorials สำหรับ Developer

ไม่ว่าคุณจะเป็น Junior Developer หรือ Developer ที่อยากจะสร้าง Project ใหม่ ๆ ไว้ใน Portfolio เพื่อไว้สมัครงาน หรือเพื่อเรียนรู้และพัฒนาตนเอง บทความนี้ได้รวบรวม Tutorials สอนตั้งแต่เริ่มต้น และแนะนำเทคโนโลยีที่จะใช้ในการสร้าง ให้คุณแบบฟรี ๆ กับ 5 Free Project-Based Tutorials สำหรับ Developer มาเริ่มกันเลย

1. Portfolio Website

Portfolio Website เป็นหนึ่งใน Projects ที่มีประโยชน์และสำคัญมาก เป็นหนึ่งใน Website ที่คุณควรสร้างในขณะที่คุณกำลังเริ่มเรียนรู้ Web Development และ Portfolio Website ก็เปรียบเหมือน Projects ไว้เปิดเผยตัวตนของคุณสู่โลก Online อย่างแท้จริง

ข้อดี ของ Portfolio Website

  • นายจ้างสามารถดูข้อมูลเพิ่มเติมเกี่ยวกับคุณ Project ต่าง ๆ ของคุณ รวมถึง Skills และประสบการณ์การทำงาน เป็นต้
  • บริษัทต่าง ๆ สามารถดู Profile ของคุณ เพื่อใช้ประกอบการพิจารณาว่าตรงกับ Job Role ที่กำลังเปิดรับสมัครอยู่ได้
  • Developer คนอื่น ๆ สามารถดูข้อมูลเพิ่มเติมเกี่ยวกับคุณ เพื่อตัดสินใจทำ Project หรือทำงานร่วมกันได้
    ยังมีข้อดีอื่น ๆ อีกมากมาย

วิธีสร้าง Portfolio Website

วิดีโอนี้จะช่วยคุณในการสร้าง Portfolio Website และ Deploy มันใน AWS (Amazon Web Service)

เทคโนโลยีที่ใช้: HTML, CSS, JavaScript และ AWS

Source code: https://github.com/divanov11/portfolio-website

2. Blog Website

ในการสร้าง Blog มีเทคโนโลยีต่าง ๆ ให้เลือกใช้หลายตัว ไม่ว่าจะเป็น MERN (MongoDB, Express, React และ Node) Stack หรือ WordPress ซึ่งการสร้าง Blog Website ด้วย WordPress น่าจะเป็นตัวเลือกที่ง่าย แต่หากคุณต้องการเรียนรู้ตั้งแต่เริ่มต้น รวมถึงเรียนรู้การใช้งาน CRUD (Create, Read, Update และ Delete) จึงขอแนะนำ Lama Dev

วิธีสร้าง Blog Website

ที่ Lama Dev จะสอนคุณสร้าง Blog Website ด้วย MERN Stack และมี Tutorial แบ่งออกเป็น 3 ตอน ดังนี้

เทคโนโลยีที่ใช้: React, Node, Express และ MongoDB

Source code: https://github.com/safak/youtube/tree/mern-blog-app

3. Amazon Clone with Firebase

Amazon Clone

การสร้าง E-commerce Store อย่าง Amazon คงเป็นสิ่งที่หลายคนอยากจะทำ และที่ Clever Programmer ก็เป็นแหล่งให้ความรู้ ที่จะสามารถช่วยคุณให้สร้างมันขึ้นมาได้

วิธีสร้าง Amazon Clone with Firebase

วิดีโอจะสอนคุณให้สร้าง E-commerce Functionality App แบบเต็มรูปแบบ ประกอบด้วย Accounts และ Login Page, Cart และ Checkout Page, Real Payments รวมถึง Order History Page

เทคโนโลยีที่ใช้: React และ Firebase

4. Social Media React App

จนถึงตรงนี้ คุณคงได้เรียนรู้การสร้าง Portfolio Website, Blog Website รวมถึง E-commerce Website ไปแล้ว

แต่ทุกวันนี้ เราทุกคนต่างก็ใช้ Social Media กันเป็นส่วนใหญ่ ดังนั้น จึงพลาดไม่ได้ที่จะสร้าง Social Media App ขึ้นมา

วิธีสร้าง Social Media React App

Login, Sign Up, Dashboard (สำหรับ View / Like / Comment) และ User Profiles ซึ่งคุณจะได้เรียนรู้วิธีการ Deploy ขึ้น Vercel

เทคโนโลยีที่ใช้: React, Firebase, Tailwind CSS, LoadTest, Lighthouse, Vercel, React Testing Library และ Cypress E2E Testing

Source code: https://github.com/karlhadwen/instagram

5. React Admin Dashboard

React Admin Dashboard

หากคุณเคยมีประสบการณ์สร้าง Dashboard คุณอาจจะต้องเสียเวลาไปกับการเรียนรู้ Apex Chart, Chart.js และ Charts Documentation อื่น ๆ เพื่อที่จะนำไปสร้าง Chart ต่าง ๆ บน Dashboard

วิธีสร้าง React Admin Dashboard

Lama Dev จะช่วยให้คุณเข้าใจ Concepts ต่าง ๆ ในการสร้าง Admin Dashboard ได้

เทคโนโลยีที่ใช้: React, Material-UI และ Chart

Source code: https://github.com/safak/youtube/tree/react-admin

และทั้งหมดนี้คือ 5 Free Project-Based Tutorials สำหรับ Developer ที่จะช่วยให้คุณได้เรียนรู้และพัฒนาตนเอง แถมได้มี Project ใหม่ ๆ ไว้ใส่ใน Portfolio อีกด้วย หวังว่าบทความนี้จะมีประโยชน์และช่วยให้คุณได้ทำงานที่ใช่กับบริษัทที่ชอบนะคะ

หากคุณกำลังหางานในสายงานไอที สามารถสมัครงานผ่านเว็บไซต์ ISM Technology Recruitment หรือสามารถส่ง Resume ของคุณ มาที่ https://www.ismtech.net/submit-your-resume แล้วคุณจะพบว่าอนาคตและโอกาสก้าวหน้ากำลังรอคุณอยู่

ISM เชี่ยวชาญในธุรกิจ IT Recruitment & IT Outsourcing โดยเฉพาะ เปิดทำการมากว่า 30 ปี มีพนักงานทุกสายและทุกระดับทางด้าน IT ที่ได้ร่วมงานกับลูกค้าองค์กรใหญ่ที่มีชื่อเสียงและบริษัทข้ามชาติมากมาย

Source: https://javascript.plainenglish.io/

​​​​

th