อยากเริ่มต้น Frontend เริ่มต้นตรงไหนดีและต้องรู้อะไรบ้าง

สวัสดีครับทุกคนกันอีกครั้งนะครับ ใน blog นี้ผมจะมาเขียนเกี่ยวกับ แนวทางสำหรับการเริ่มต้น Frontend ระดับมือใหม่หรือที่เรียกระดับกันว่า Junior กันครับ ซึ่งในส่วนของ blog นี้สำหรับผม จะเป็นการแชร์วิธีการศึกษาและเริ่มต้นเกี่ยวกับ Frontend จากการเรียนรู้ของผมเองครับ เผื่อเป็นประโยชน์สำหรับคนที่ต้องการศึกษาทางด้าน Frontend จะได้ไปเรียนรู้ได้นะครับ ถ้าพร้อมแล้วไปดูกันเลยครับ

ก่อนที่จะเริ่มผมจะแบ่งในส่วนของหัวข้อ Part ใหญ่ที่ผมจะพูดก่อนครับ โดยเนื้อหาหลักของผมจะมีดังนี้ครับ

1. จุดเริ่มต้นของการศึกษา Frontend
2. เนื้อหาที่ต้องเรียนรู้สำหรับคนจะเริ่ม Frontend

จุดเริ่มต้นของการศึกษา Frontend ของผม

สำหรับตัวผมได้เริ่มต้นและสนใจศึกษาเกี่ยวกับ Frontend ผมเริ่มต้นจากตอนช่วงปี 3 เทอม 2 ที่ผมต้องฝึกงานและผมสมัครฝึกงานในตำแหน่งของ Frontend Developer และรวมถึงในช่วงที่ผมจะจบผมก็ทำโปรเจ็คจบในด้านที่ต้งใช้ความรู้ด้าน Frontend ด้วยครับ โดยตัวผมตอนนั้นผมยอมรับว่าพื้นฐานหลักของผมยังไม่แน่นและตัวผมเองก็ทำงานไม่ตรงสายด้วยโดยสายที่ผมเรียนเป็นด้านวิศวกรรมอิเล็กทรอนิกส์และโทรคมนาคมครับ ซึ่งการทำโปรเจ็คให้กับบริษัทในช่วงฝึกงานและโปรเจ็คจบผมยอมรับตัวผมเลยว่าติดขัดมากครับ โดยหลังจบฝึกงานทำให้ผมต้องศึกษาความรู้เกี่ยวกับ basic พื้นฐานเพิ่มครับ ซึ่งทำให้ผมรู้เลยว่ามีความรู้อีกหลายอย่างที่ผมต้องเข้าใจเพื่อให้การทำงานโปรแกรมออกมาได้ดีได้ครับ โดยผมเริ่มต้นศึกษาพื้นฐานหลักเกี่ยวกับ HTML, CSS, Javascript ด้วยตัวเองจากยูทูป, เพจ BorntoDev และเว็บอย่างพวก FreeCodeCamp ครับ ซึ่งผมเองก็มีการ Take Course ที่อื่นเพิ่มด้วยครับ เพื่อที่จะได้มีโปรเจ็คเพิ่มและมีเนื้อหาบางส่วนทางด้าน Frontend Framework หรือความรู้อื่นที่เราไม่รู้ด้วยครับ ทำให้ได้ความรู้เสริมติดตัวไว้ด้วยครับ รวมถึงครั้งนี้ผมก็ได้ทำการเข้าร่วมโครงการ Dev Init #2 ซึงมีโปรเจ็คให้ทำและ blog ให้เขียนเพื่อกรองความรู้ด้วยครับ ซึ่งในหัวข้อต่อไปจะพูดคุยเกี่ยวกับส่วนที่ต้องรู้กันครับ

พูดคุยก่อนเริ่ม

ในส่วนของบทความที่ผมจะเขียนต่อจากนี้ก่อนอื่นผมก็ต้องขอบคุณ BorntoDev สำหรับกิจกรรม DevInit ในครั้งนี้ที่มีในส่วนของงาน Blog นี้ครับ ซึ่งในส่วนของการเขียน Blog นี้ผมคิดว่าน่าจะเป็นแนวทางที่ดีสำหรับคนที่ต้องการเริ่มศึกษาและเรียนรู้เกี่ยวกับด้าน Forntend ด้วยตัวเองครับ ซึ่งจริงๆวิธีการสำหรับการเริ่มต้นศึกษาด้าน Frontend เบื้องต้นมีเยอะครับ แต่ผมจะยกมาเฉพาะข้อมูลที่จำเป็นครับ

ต้องบอกก่อนครับว่าบทความนี้สำหรับแนวทางการศึกษาเบื้องต้นก่อนการเข้าสู่โลกของ Frontend เป็นแค่แนวทางของผมเองนะครับ ซึ่งหลายคนอาจไม่ต้องทำตามก็ได้นะครับ และในส่วนของ resource ที่ผมเอามาลงในโฆษณาผมไม่ได้ลงเพื่อใช้ในการโฆษณานะครับ แต่เป็นส่วนช่วยให้ผมเข้าใจและเรียนรู้มาจนถึงตอนนี้ครับ

โดยในส่วนเนื้อหาส่วนนี้ผมแนะนำให้ลองดูในส่วนของ Roadmap เบื้องต้นของ BornToDev ก่อนประกอบกับข้อมูลที่ผมจะอธิบายต่อในลิ้งค์นี้ ครับ ถ้าพร้อมแล้วไปดูกันได้เลยนะครับ

Responsive Web Design

เนื้อหาส่วนนี้ถือเป็นจุดเริ่มต้นหลักเลยก็พูดได้ครับเพราะในส่วนนี้จะเน้นหลักไปที่เรื่องของการ Design ในส่วนของหน้าเว็บว่าหน้าเว็บควรออกมาลักษณะใด

โดยพื้นฐานในส่วนนี้จะเน้นหลักคือเรื่องของการวางโครงสร้างของ HTML และการทำการ Design ในส่วนของ CSS ในแบบเบื้องต้นได้ว่าการเขียนโครงสร้างหน้าเว็บจะเป็นอย่างไรและการ Design ควรจะเป็นประมาณไหน โดยเนื้อหาส่วนนี้สำหรับผมไม่อยากให้รีบในการศึกษาให้ครบอยากให้ลองทำความเข้าใจเบื้องต้นแล้วนำไปต่อยอดดูครับ รวมถึงสามารถนำไปใช้เขียนเว็บอย่างง่ายได้ด้วยครับ

โดยส่วนของความรู้ทางด้าน HTML และ CSS ผมก็ได้ดูในเว็บนี้ซึ่งสามารถไปลองดูกันได้นะครับ : Interneting Is Hard

ซึ่งเนื้อหาหลักที่ผมยกในเว็บนี้ถือว่าเป็นเว็บที่มีข้อมูลครบในเรื่องของการทำ HTML สำหรับแสดงข้อมูลในเว็บและส่วนของ CSS layout ว่าการ Design มีอะไรบ้าง อย่างเช่นส่วนของการทำ CSS Flexbox และตัวของ CSS Grid ว่ามีการ design อย่างไรและในส่วนของการทำ Grid เป็นอย่างไรโดยเว็บไซต์ที่ใช้ประกอบจะเป็นเว็บ Learn CSS Layout โดยผมจะแบ่งส่วน Layout ที่ใช้หลักดังนี้

CSS Flexbox

ในส่วนนี้ถือว่าเป็นส่วนสำคัญในการเรียนรู้การออกแบบโครงสร้างในหน้าเพจหรือเว็บไซต์ของผู้ใช้ว่าต้องมีอะไรบ้างและจัดการกับ Component ให้อยู่ในกล่องได้อย่างไรซึ่ง Flex ถ้าในความหมายทั่วๆไปคือความยืดหยุ่นทำให้ได้เรียนรู้เรื่องที่ว่าการจัดการ component ในหน้าเว็บจะมีความยืดหยุ่นได้อย่างไร

โดยเนื้อหาในเว็บไซต์ที่ผมใช้และเป็นเว็บที่เหมือนเกมส์ในตัวจะเป็นเว็บ: FLEXBOX FROGGY ซึ่งสามารถไปลองเล่นกันได้นะครับ

CSS Grid

สำหรับส่วนนี้จะเน้นไปในเรื่องของการออกแบบในส่วนของหน้าเว็บไซต์ออกเป็นส่วนๆซึ่งเว็บไซต์ที่เราจะเห็นกันได้โดยทั่วไปจะเป็นเว็บในเรื่องของ Blog ซึ่งต้องมีการใช้ Grid มาช่วยซึ่งความรู้นี้ถือว่าจำเป็นในการทำส่วนของ card และใช้กับ การทำให้ตัว Card อยูในทิศทางเดียวกันได้ในพื้นที่จำกัดและ card จำนวนมากครับ โดยฝึกได้จากการปลูกพืชจากเว็บ GRID GARDEN ครับ

ในส่วนของโปรแกรมที่แนะนำหรือเว็บที่ใช้ในการฝึกฝนการเขียนโปรแกรมมีดังนี้ครับ สามารถเลือกใช้ตามความถนัดได้เลยครับ

• VS Code
• Code Sand Box
• Code Pen

สำหรับความรู้ในส่วนนี้ถือว่าเป็นความรู้เบื้องต้นที่จำเป็นสำหรับการทำ Responsive Web Design เบื้องต้นได้ครับและสิ่งที่อยากให้ฝึกก่อนจะไป part ต่อไปมีอะไรบ้างไปดูเลยครับ

• เรียนรู้และฝึกใช้ Git ให้คล่องครับเพราะเป็นส่วนที่ทำให้เราเรียนรู้เรื่องของ Git Version Control ซึ่งถ้าผมแนะนำ resource และเป็นตัวที่ผมเรียนรู้เป็นของ BornToDev จะเป็น ตัวนี้ครับ : GitHub for Developer
• เรียนรู้การเขียน command line ไว้นะครับ เพราะมีส่วนจำเป็นสำหรับการเรียก library มาใช้ครับ โดยเฉพาะตัว Framework React เพราะจะมีส่วนช่วยในการเรียก library ที่สำคัญมาใช้ได้นะครับ
• ลองหาโปรเจ็คที่น่าสนใจมาลองทำหรือไม่เขียนโค้ดตามเพื่อจะได้ฝึกสกิลไปในตัวด้วยครับ โดยเว็บไซต์ที่ผมอยากให้ทำกันคือเว็บ Portfolio ครับเพราะเป็นเว็บที่ไว้แสดงความสามารถเบื้องต้นเกี่ยวกับการเขียน HTML และ CSS นั้นได้เองครับ โดยถ้าเป็นตัวอย่างอื่นๆ ผมแนะนำลิ้งค์นี้ครับ Complete Responsive Website Designs ซึ่งรวมโปรเจ็คไว้มากมายเลยครับและเสร็จแล้วอัพลง Github Repo ไว้เป็นผลงานเราได้ครับ และบางบริษัทที่ขอ Portfolio สามารถใช้เว็บไซต์ที่เราสร้างขึ้นแสดงแทนได้นะครับ

สำหรับส่วนของ Responsive Web Design ผมก็คงไว้ตรงนี้ก่อนนะครับถ้าพร้อมแล้วเข้าส่วนต่อไปกันเลยครับ

Javascript Algorithm and Data Structure

หลังจากที่ได้ทำการเรียนรู้และฝึกฝนในส่วนของการทำ Responsive แล้วส่วนนี้จะเน้นการเรียนรู้ในเรื่องของ Javascript กัน โดยการศึกษาส่วนนี้ จากที่ผมได้ทำการศึกษาเพิ่มด้วยตัวเอง ผมมองว่าเป็นส่วนที่สำคัญต่อมาถ้าจากที่หลายคนเรียกกันคือ HTML, CSS, Javascript จะสังเกตุว่าทำไม Javascript ถึงไว้ท้ายสุดเพราะส่วนนี้เป็นส่วนที่เนื้อหาค่อนข้างเยอะและเป็นส่วนสำคัญในการเขียนการทำงานในส่วนของ Function ของเว็บไซต์ครับ และต้องเข้าใจมันจริงๆเพราะต้องใช้ในการประกอบการเขียน Framework อย่างเช่น React, Vue, Angular ต่อไปครับ ถ้าพร้อมแล้วไปดูเรื่องที่ต้องรู้กันเลยครับ

สำหรับสิ่งที่ต้องเรียนรู้เกี่ยวกับ Javascript อันนี้ผมเรียงตาม Curriculum ของ FreeCodeCamp นะครับ รวมถึงผมจะมีแหล่งเนื้อหาแต่ละส่วนมาแนะนำด้วยนะครับ

Basic Javascript: สำหรับเนื้อหาของ Basic Javascript ถือว่าเป็นส่วนที่สำคัญที่สุดเลยก็ว่าได้เหมือนกับหลายๆภาษาอย่าง Python, Go เป็นต้นครับ ที่จะต้องรู้พื้นฐานของแต่ละภาษาครับ ซึ่งหลายคนน่าจะสงสัยว่าถ้าผมศึกษาภาษาอื่นมาก่อนอย่าง Python หรอ Go แล้วถ้าจะมาเรียนรู้ Javascript เลยจะเข้าใจไหม คำตอบผมคือเข้าใจได้ครับเ เพราะ pattern การเขียนคล้ายๆกันครับแต่จะต่างกันแค่ตัว syntax ครับ และส่วนนี้ต้องเข้าใจจริงๆนะครับไม่งั้นต่อส่วนต่อไปยากครับ

ถ้าใครอยากศึกษา Basic ของ Javascript ผมขอแนะนำเว็บนี้นะครับเป็นเว็บที่ให้ข้อมูล : Learn Javascript

พื้นฐาน ES6: เนื้อหาส่วนนี้เป็นส่วนที่อาจรู้ไว้เพื่อความเข้าใจได้ครับในส่วนนี้จะเน้นไปในเรื่องของสิ่งที่เปลี่ยนไปจาก ES5 ว่ามีความเปลี่ยนแปลงอะไรบ้างและพอเปลี่ยนเป็น ES6 มีความแตกต่างอะไรบ้าง

Regex Expression: เนื้อหาส่วนนี้ถ้าพูดถึงสิ่งที่เห็นภาพในชีวิตประจำวันก็คงเป็นเว็บอย่าง Google ครับ ที่เป็นเว็บ Search Engine ที่ใช้กันอยู่ในทุกวันนี้หรือพวก filter ที่อยู่ในเว็บไซต์ที่เราใช้ต่างๆผมก็มองว่าเป็นส่วนที่สำคัญไม่แพ้กันครับ เพราะถ้าเรียนรู้ไปถึง Frontend มีความจำเป็นในการทำ Filter หรือส่วนที่ใช้หาข้อมูลต่างๆครับ

สำหรับผมถ้าแนะนำเว็บศึกษาเรื่องนี้จะเป็นเว็บ RegexOne ที่มีแบบฝึกหัดให้ลองเรียนรู้ได้นะครับ

Debugging: เนื้อหาส่วนนี้จะเน้นไปที่เรื่องของการทำ Debug และการแก้ปัญหาจากการเขียนโปรแกรมครับซึ่งเป็นส่วนที่ไม่ว่าคุณจะเรียนภาษาใดก็ตามต้องเข้าใจในส่วนนี้ครับ เพื่อเป็นส่วนสำคัญในการเรียนรู้และแก้ Error ได้ด้วยตัวเองครับ

Basic Data Structures: ส่วนนี้เป็นอีกส่วนนึงที่ต้องเรียนรู่ไม่ว่าภาษาใด้ก็ตามก็ต้องเข้าใจเรื่องของ Data Structure ครับ เพราะมีส่วนสำคัญในการเข้าใจเรื่องของข้อมูลครับ จะมีทั้งตัวของ Array และ Object ครับ อยากให้เข้าใจในส่วนนี้ เพราะถ้าไปถึงส่วนของการทำ Frontend จำเป็นสำหรับการดึงข้อมูลครับ

Object Oriented Programming: เนื่องจากตัวของ Javascript เป็นภาษาที่รองรับการทำ Object Oriented ฉะนั้นส่วนนี้จะต้องเข้าใจเกี่ยวกับเรื่องของการทำ Object Oriented Programming ของ Javascript ด้วย โดยเนื้อหาส่วนนี้จะมองโครงสร้างเป็น Class ซึงเนื้อหานี้จะเน้นเรื่องของการเขียนโปรแกรมเชิงวัตถุซึ่งจำเป็นสำหรับการจัดการโครงสร้างของโปรแกรมอย่างมากครับ

Functional Programming: เนื้อหาส่วนสุดท้ายนี้จะเน้นในเรื่องของการจัดการ code ให้เป็นระเบียบซึ่งเรื่องนี้ถือเป็นเรื่องสำคัญอีกเรื่องนึงที่การเขียนในหลายภาษาต้องเข้าใจในส่วนนี้ ซึ่งส่วนนี้มีส่วนช่วยในการจัดการ code ที่มีความซับซ้อนในจำนวนเยอะให้มีความเจาะจงมากยิ่งขึ้น และการเขียน code ดูมีความเป็นระเบียบมากยิ่งขึ้นครับ

ทั้งหมดนี้จะเป็นเนื้อหาทั้งหมดที่ผมคิดว่าควรจะศึกษาและทำความเข้าใจให้มากที่สุดเพราะเป็นส่วนที่จำเป็นสำหรับการนำไปเขียนประกอบกับการเขียนในส่วนของ HTML, CSS, Javascript หรือที่เรียกว่า Vanilla Javascript ต่อไปได้ครับส่วนต่อมาผมจะเขียนในเรื่องสิ่งที่ต้องฝึกหลังจากนี้ครับถ้าพร้อมแล้วไปดูกันได้เลยครับ

สิ่งที่ควรฝึกเพิ่มหลังจากศึกษาเรื่องนี้

• อยากให้ลองหาโจทย์เกี่ยวกับ Javascript มาทำในเว็บไซต์อย่างเช่นเว็บไซต์ leetCode หรือ Codewars รวมถึง DevLab ของ BorntoDev ด้วยครับ แต่สำหรับ BorntoDev ถ้าทำถึง 20 ข้อ จะได้ Certificate ด้วยนะครับ เป็นการฝึกฝนที่ดีและทำให้เราชำนาญมากยิ่งขึ้นครับ เพราะถ้าอยากประสบความสำเร็จต้องมาจากการฝึกฝนครับ ความสำเร็จไม่มีทางลัดครับ
• ถ้าเกิดเข้าใจในเรื่องของ Javascript แล้วสำหรับผมแนะนำอยากให้ลองศึกษาและฝึกเกี่ยวกับเรื่องของ Typescript ด้วยครับ เพราะบางบริษัทเริ่มมาใช้ Typescript มากขึ้นแล้วอยากให้เห็นถึงความแตกต่างและการเขียน code ที่เป็นระเบียบขึ้นครับ
• ศึกษาเรื่องของ Dom Element เพิ่มและลองทำโปรเจ็คในด้านของ Vanilla Javascript เพื่อที่จะไม่ให้ลืมความรู้เรื่อง Responsive Web Design แล้วทำให้รวมความรู้ทั้งหมดที่เรียนร่วมกับ Javascript ได้ครับ

ทั้งหมดนี้ก็จะเป็นแนวทางการศึกษาในเรื่องของ Javascript Algorithm and Data Structure ครับ สำหรับส่วนต่อมาก็จะเป็นส่วนสุดท้ายของบทความนี้แล้วครับถ้าพร้อมไปดูกันได้เลยครับ

Frontend Development Library

ในส่วนนี้ก็จะเป็นส่วนสุดท้างหลังจากที่ได้ศึกษาในเรื่องของ Responsive Web Design กับ Javascript มาแล้วนะครับใน part นี้จะเข้าสู่สาย Frontend อย่างเต็มตัวแล้วนะครับซึ่งในปัจจุบัน framework สำหรับสาย Frontend มีอยู่เยอะมากนะครับทั้งตัวของ Angular, Svelts, Vue และตัวของ React ซึ่งในบทความนี่ผมจะโฟกัสไปที่ path ของ React เป็นหลักนะครับ แต่มีสิ่งที่ต้องรู้เหมือนกันถ้าพร้อมแล้วไปดูกันเลยครับ

ในส่วนของเรื่องที่จะต้องรู้ส่วนนี้จะเป็นแค่แนวทางและเรื่องที่ต้องรู้ของผมเท่านั้นนะครับ ทุกคนอาจไม่จำเป็นต้องศึกษาตามผมก็ได้ครับอยากให้ส่วนนี้เป็นส่วนที่แลกเปลี่ยนกันครับ

พื้นฐานของ React: ส่วนนี้เป็นส่วนที่ค่อนข้างสำคัญที่สุดไม่ใช้แค่เฉพาตัว Framework React เท่านั้น แต่ Framework อื่นอยากให้ลองศึกษาพื้นฐานการทำงานของโปรแกรมผ่าน Document ของเว็บไซต์ให้เข้าใจก่อนครับซึ่งเนื้อหาส่วนนี้สำหรับผมอาจแนะนำให้ลองอ่น document ของ website ดูก่อนครับถ้าใครจะลงทุนหน่อยสำหรับผมอาจให้ลอง take course ของ BorntoDev ดูได้นะครับ
สำหรับผมตัว Course ของผมที่ทำการ take course: The Ultimate React Course 2024: React, Next.js, Redux & More ของ (Jonas Schmedtmann) เพราะเป็นเนื้อหาของคนต่างชาติที่ค่อนข้างครบที่สุดแล้วครับ ทางด้านของ React ครับ

Redux: ส่วนนี้จะเน้นเรื่องของการทำเพิ่มลดค่าครับโดยส่วนนี้ผมอาจไม่ได้พูดเยอะนะครับเพราะส่วนนี้เป็นส่วนตัวช่วยของ React ครับจะเน้นไปว่า จะทำฟังก์ชันเพิ่ม/ลด ค่าต่างๆยังไง

การเขียน Command Line: เรื่อง command line ผมอยากจะเน้นให้ลองฝึกใช้ให้คล่องขึ้นเพราะส่วนนี้เป็นส่วนสำคัญในการที่เราจะต้องรัน ตัวของ Client และการโหลดตัวของ Library อื่นๆมาใช้เรื่องของการเล่น command line จะต้องคล่องด้วยครับ

การเลือกใช้ library: เรื่องของการใช้ library ถ้าทำงานคนเดียวอาจลองเลือก tool ดูก็ได้ว่าเราจะใช้ library หรือ tool ไหนในการทำเว็บส่วนไหนอย่างถ้าอย่างเรื่องของการทำ UI ถ้าอยากใช้ TailwindCSS, Styled-Component, Elastic UI อาจลองศึกษา tool โดยดู document ตาม library ที่จะใช้ว่ามีวิธีเขียนยังไง หรือการดึง api อาจมีการใช้ library axios มาประกอบการทำงานด้วยก็ได้ ถ้าเกิดทำเป็นโปรเจ็คของตนเองอาจลองกำหนดเลยเหมือนเป็น planning ว่าจะใช้ tool ไรบ้างเพื่อให้เรา scope ตัวของ tool ที่จะใช้และการทำงานได้เหมาะสมครับ

การทำ Planning: การทำ planning ถือเป็นส่วนที่จำเป็นอย่างมากในการทำ software หรือโปรแกรมนึงเพื่อที่จะทำให้เรารู้ scope และทำงานได้อย่างมีประสิทธิภาพครับ

การอ่าน Documentation: เรื่องการอ่าน documentation ผมยกให้เป็นเรื่องนึงที่อาจไม่ใช่เรื่องที่ต้องศึกษาแต่ผมให้ความสำคัญเพราะจะต้องเข้าใจว่าข้อมูลหรือตัวอย่างของตัว library ที่ใช้มีวิธีเขียนอย่างไรและจะมีวิธีการประยุกต์ใช้อย่างไรบ้าง

การทำ Git Version Control: เรื่องนี้ถือเป็นเรื่องนึงที่ต้องรู้เลยครับ เป็นเรื่องของการจัดการการเปลี่ยนแปลงของ version ของโปรแกรมครับ ว่าเราได้มีการทำหรือแก้ไขอะไรไปบ้างเพื่อทำให้การพัฒนา software หรอ Web Application ของเรามีประสิทธิภาพมากที่สุดครับ

การเขียน Readme.md: การเขียน Readme.md เป็นส่วนสำคัญอีกส่วนนึงที่ต้องรู้ครับเพราะการเขียน Readme.md ทำให้คนที่สนใจในส่วนของโปรเจ็คของเรานั้นเข้าใจว่ามีอะไรบ้างมีการใช้ tool ไหนบ้างและจะมีการต่อยอดในอนาคตว่ามีอะไรบ้าง เพราะเผื่ออนาคตตัวเราทำหรือมีคนมาต่อยอดต่อยอดได้อย่างมีประสิทธีภาพแน่นอนครับ

ก็สำหรับส่วนนี้จะเป็นเรื่องทั้งหมดที่ต้องรู้หรือศึกษาเกี่ยวกับด้าน Frontend ครับ เดี๋ยวส่วนต่อมาผมจะมีส่วนที่ต้องเรียนรู้หลังจากนั้ครับ

สิ่งที่ควรเรียนรู้เพิ่มหรือทำหลังจากนี้

• สิ่งที่ผมจะเน้นเลยทุก part ตั้งแต่ Responsive Web Design, Javascript และ Frontend คือเรื่องของการฝึกฝนเพิ่มครับ เพราะการฝึกฝนหรือทำบ่อย ๆจ ะเป็นหนทางสู่ความสำเร็จครับ
• ลองหาโปรเจ็คที่น่าสนใจมาลองทำหรือโปรเจ็คจากคอร์สเรียนมาต่อยอดครับ เพราะ การทำอย่างนี้จะทำให้เราได้ใช้ความสามารถทั้งหมดมาพัฒนางานและทำให้สกิลทางด้าน Frontend ของเรานั้นแข็งขึ้นด้วยครับ
• หลังจากที่ได้ศึกษาและเข้าใจ Frontend แล้วผมอยากให้ลองฝึกเขียน Backend ด้วยครับทดแทนการใช้ Firebase เพราะมันเป็นส่วนช่วยเพิ่มมูลค่าการทำงานให้เราได้ครับเพราะการสมัครงานได้ใช้แน่ ๆ ครับในเรื่องของการที่เราเข้าใจการทำงานของระบบและการเชื่อมต่อเว็บครับ และหลายบริษัทจะไม่ได้ใช้ Firebase เท่าไหรเพราะจะผ่าน web Api ซะมากกว่าครับ เพราะสิ่งที่เจอคือค่าใช้จ่ายของ Firebase ที่ค่อนข้างสูงครับสำหรับข้อมูลส่วนนี้ผมต้องขอบคุณและขออนุญาตนำมาเผยแพร่ในหัวข้อ เตือนคนใช้ Firebase Database
• หลังจากฝึก Backend แล้วผมอยากให้ฝึกเขียน Test อย่างพวก Cypress ด้วยครับเพราะอย่างน้อยเพื่อเป็นการเพิ่มประสิทธิภาพการทำงานโปรแกรมเราด้วยครับ
• สิ่งนี้เป็นสิ่งที่ผมก็ต้องทำเหมือนกันคือการฝึก basic ตลอดของ LeetCode หรือ CodeWar ครับเพราะพื้นฐานเป็นสิ่งที่ทิ้งไม่ได้อยู่แล้วครับและเป็นความรู้ที่สำคัญในการทำเว็บและพัฒนาสกิลตลอดเวลาครับ

สำหรับข้อมูลนี้ก็จะเป็นทั้งหมดของบทความนี้นะครับหลังจากนี้จะเป็นบทส่งท้ายครับถ้าพร้อมแล้วไปดูได้เลยนะครับ

บทส่งท้ายจากผู้เขียน

เนื้อหาบทความนี้ก็ถือว่าเป็นเนื้อหาที่ค่อนข้างยาวที่สุดอีกบทความนึงที่ผมเขียนมาเลยครับ ผมก็ไม่รู้ว่าบทความนี้จะมีประโยชน์หรือเป็นแนวทางให้กับคนที่เพิ่งเริ่มต้น หรือสนใจทางด้าน Frontend ได้มากน้อยแค่ไหนครับ ซึ่งถ้าใครมีวิธีการหรืออยากอยากเสริมมาแชร์กันได้นะครับ เพราะสำหรับบทความนี้ของผมหลัก ๆ อยากให้เป็นเหมือน บทความที่เรามาแชร์กันมากกว่าครับ และสิ่งสำคัญที่สุดของการทำ web application อยากให้ฝึกฝนและพัฒนาความคิดความสามารถกันตลอดนะครับ ถ้าใครตามมาจนถึงตอนนี้ผมจะบอกตลอดเลยว่าความสำเร็จไม่มีทางลัดนะครับ ต้องมาจากตัวเราเท่านั้นนะครับ ไว้มีโอกาสเจอกันใหม่นะครับ

แหล่งข้อมูลเพิ่มเติม

A practical guide to learning front end development for beginners by Nikita Rudenko

Front-End Development: The Complete Guide by Cloudinary