WIP Camp #10 ก้าวแรกสู่ Front-end

สวัสดีครับ ผมชื่อ “พี” นะครับ บทความนี้เป็นบทความแรกและผมจะมาเล่าประสบการณ์ ความรู้สึก ที่ผมได้รับจากการทำโปรเจคนี้ เป็นการทำเว็บไซต์สำหรับค่าย WIP Camp #10 หรือ Ways to IT Professionals Camp ครั้งที่ 10 ซึ่งเป็นค่ายของคณะเทคโนโลยีสารสนเทศ ภาควิชาเทคโนโลยีสารสนเทศ มหาวิทยาลัยเทคโนโลยีพระจอมเกล้าธนบุรี

ทำไมถึงอยากทำ? เข้ามาทำได้อย่างไร? (ความรู้สึกนี้ยังไม่เคยบอกใครนะ)

ต้องขอย้อนกลับไปก่อนจะมีการเปิดรับสมัครคนเข้ามาทำในส่วนนี้ก่อนนะครับ เพราะว่าก่อนหน้าที่จะมีการเปิดรับสมัครนั้นทางคณะได้มีโครงการที่ชื่อว่า HelloWorld #Alpaca ซึ่งเป็นโครงการที่จะเปิดสอนทักษะด้านต่างๆให้กับน้องๆ ปี1 ในโครงการจะประกอบไปด้วย 4 ทีม คือ Infrastructure, Game, Design และ Front-end แน่นอนว่ามีคนสนใจสมัครหลายคนมากรวมถึงตัวผมด้วย แต่ว่า ในวันที่เปิดรับสมัครนั้นผมไม่สบายเลยรีบกลับหอแล้วกินยานอน พอผมตื่นมาอีกทีก็ตกใจใหญ่เลยครับ 22.00 น. แล้ว และทางโครงการเปิดกดบัตรได้ตั้งแต่ 19.00 น. แน่นอนครับผมกดบัตร “ไม่ทัน” ความรู้สึกหลังจากนั้นไม่ค่อยดีเลยครับ 555 เวลาผมเลิกเรียนแล้วคนอื่นๆ ได้ไปเข้าโครงการต่อ ผมรู้สึกแย่มากๆ แบบว่าผมอยากไปเรียนด้วย (ToT) พอผ่านมาได้สักพักก็เริ่มถามเพื่อนว่าเรียนไรมาบ้าง ในทีม Front-end เพราะผมสนใจอยากจะทำ เพื่อนก็บอกว่าเรียนอะไรบ้าง ต้องลงโปรแกรมอะไร แต่ผมก็ใช้ไม่เป็น ไม่รู้วิธี เลยเริ่มเขียนเว็บอะไรสักอย่างนึงมา แล้วตอนนั้นก็คิดว่าจะเขียนเว็บของตัวเอง เอาไว้ลงสรุปแต่ละวิชาที่เรากำลังเรียนอยู่ในเทอมนั้น โดยใช้ HTML กับ CSS เขียน เพราะเมื่อตอนมัธยมปลายเคยเรียนมาบ้าง พอทำได้สักพักก็เลิกไปด้วยความรู้ที่ไม่มากพอทำต่อไม่ได้ จนถึงช่วงก่อนสอบปลายภาค มีการเปิดรับสมัคร 10 i’m developer หรือ คนที่จะเข้ามาทำเว็บค่ายของคณะ ก็คือ WIP Camp #10 ผมก็เลยสมัครไป ทีมที่รับสมัครก็มี 4 ทีมเหมือนเดิม แน่นอนว่าผมต้องเลือก Front-end อยู่แล้ว แต่รอบนี้ไม่จำกัดคนลงสมัครเพราะคนที่สมัครเข้ามาจะต้องไปสัมภาษณ์กับพี่ที่ดูแลแต่ละทีม แล้วพี่ๆจะตัดสินใจว่ารับเราไหม ตอนจะเข้าสัมภาษณ์บอกเลยว่า “ไม่น่าติด” เพราะเรายังไม่รู้ว่าพี่เขามีเกณฑ์การรับจากอะไรบ้าง บวกกับไม่ได้ผ่านโครงการมาเหมือนคนอื่นๆ แต่พอเข้าไปสัมภาษณ์ พี่ก็ถามว่าเคยเขียนไรมาบ้าง รู้ไหม HTML CSS คืออะไร เราก็ตอบไปเท่าที่เรารู้ แต่มีคำถามนึงที่ทำให้เราปลดปล่อยสิ่งที่ผ่านมาตั้งแต่ผมเล่ามานี้คือ อยากได้อะไรกลับไป ผมตอบไปว่า “ผมอยากได้ความรู้ไปพัฒนาต่อกับเว็บไซต์ของตัวเอง ผมอยากมีเว็บที่เอาไว้ลงสรุปให้เพื่อนๆเข้ามาอ่าน” มันเป็นความคิดที่ยิ่งใหญ่มากครับ และผมยังทำไม่สำเร็จด้วย ด้วยอะไรหลายๆอย่าง เช่น สรุปแต่ละวิชาผมไม่สามารถสรุปได้ เพราะผมไม่เข้าใจจริงๆ หลังจากสัมภาษณ์เสร็จ จนวันประกาศรายชื่อ ก็มีชื่อผมอยู่ในนั้น ผมดีใจและยอมรับว่ากลัวที่จะเผชิญกับมัน

คุยกับทีมครั้งแรก

หลังจากที่เข้าร่วมแล้วก็มีพี่ๆนัดประชุม และบอกว่าค่ายในปีนี้เป็นธีมอะไร และธีมที่ได้ก็คือ “รามเกียรติ์” แล้วก็แยกย้ายไปคุยกับทีมของตัวเอง ทีมผมมีคนทั้งหมด 6 คน โดยพี่ๆแบ่งออกเป็น ฝั่งเขียนโครงเว็บ กับ ฝั่งที่ตกแต่งเว็บ ฝั่งละ3คน ผมได้อยู่ฝั่งที่ตกแต่งเว็บ เพราะเคยเขียน CSS มาก่อน หลังจากนั้นก็แยกย้ายกันกลับ

นัดครั้งแรกก็เบี้ยวแล้ววววว

พอผ่านมาสักพักนึงทีมก็นัดวันเพื่อมาปรับความรู้ที่ควรมีให้เท่าๆกัน แต่ว่าตรงกับวันที่ผมไปเที่ยวต่างจังหวัดพอดี ทำให้ผมพลาดไป พอกลับมาก็ต้องมาตามเพื่อนว่าเรียนไรไปบ้าง ซึ่งสิ่งที่ได้รับมาคือ ไปอ่านการเขียน Next.js และหน้าที่ผมก็คือตกแต่งเป็นหลักก็เลยต้องฝึกใช้ Styled-components ด้วย แน่นอนว่าก็ให้เพื่อนๆช่วยสอนเยอะเลย พอเริ่มเป็นนิดหน่อยก็เลยลองเขียนเว็บตามเว็บอะไรก็ได้เว็บนึง เพราะช่วงนั้นยังไม่มีงาน

งานแรกมาแล้ว

งานแรกที่ทีมเราได้รับคือหน้าแรกของเว็บซึ่งจะไม่ได้มีหน้าตาแบบเว็บค่ายที่ปล่อยไปแล้ว เพราะช่วงนั้นยังไม่ลงตัวเท่าไหร่ ด้วยเทคนิค ความเป็นไปได้ ณ ตอนนั้นเลยต้องเปลี่ยน ซึ่งงานแรกนี้บอกเลยว่าผมทำอะไรไม่ได้เลย ช่วงนั้นรู้สึกเป็นตัวถ่วงเพื่อนๆมาก แต่ก็ได้เรียนรู้เรื่อง animate ใน css มาในการทำให้เมฆเคลื่อนที่ได้บนเว็บไซต์ ก็แอบดีใจเล็กน้อยและรู้สึกภูมิใจที่ทำได้ 555

เมฆลอยได้ด้วยแหละะะะะ

รู้สึกว่าเริ่มมีหน้าที่ ที่เราถนัด

หลังจากผ่านช่วงที่รู้สึกเป็นตัวถ่วงมาได้ แล้วเริ่มทำ task งานเล็กๆ น้อยๆ จนคิดว่าตัวเองถนัดเรื่องจัดวาง object ต่างๆ บนเว็บ animate ของ object เราก็เลือกทำงานประเภทนี้ จนรู้สึกว่าไม่ถ่วงเพื่อนแล้ว ช่วยเพื่อนได้แล้ว ( แต่สิ่งที่ทำตอนนั้น พอมาถึงตอนนี้ก็คิดว่าท่าที่ใช้เขียนไม่ค่อยสวยงามเท่าไหร่ 555 )

สรุปสิ่งที่ได้รับ

• ได้ลองเขียน Next.js, Javascript, styled-components
• ได้ฝึกการใช้ Github (https://github.com/panupong25509) แอบแจก!!!
• ได้ใช้โปรแกรม SourceTree, Visual Studio Code

สิ่งที่ใช้ในโปรเจคนี้

• Next.js
• Styled-components

สุดท้ายแล้ววววววว ยาวเวอร์

เพราะนี่คือครั้งแรกที่ได้ทำ Front-end ความรู้สึกมันเลยมากกว่าความรู้ที่ได้รับ และขอบคุณพี่ๆที่ให้โอกาส ผมจะพยายามพัฒนาตนเอง มีวินัยให้มากขึ้น และค่ายผ่านมา1ปีแล้ว แต่ผมพึ่งจะมาเขียนบทความ อาจจะเขียนทั้งหมดลงไปไม่ได้เพราะลืมไปบ้างแล้ว แต่ทุกๆอย่างมันจะอยู่ในโค้ดที่ผมเขียนลงไป ขอบคุณครับ

#ตอนนี้เว็บเป็นของรุ่นน้องแล้ว แต่ยังสามารถดูโค้ดแล้วเอาเว็บไป run เองได้น้าาา https://github.com/wipcamp/10-frontend