ตอนก่อนหน้า – มือใหม่หัดใช้ Angular ตอนที่ 5: การสร้าง Service และการเก็บข้อมูลของ user ลงใน localstorage
หลังจากที่เราลองเขียนหน้าเว็บที่ใช้ในการ register และ login กันมา 2-3 ตอน แต่ว่าหน้าตาของเว็บมันยังดูไม่ค่อยสวยเท่าไหร่เลยแฮะ วันนี้เราเลยจะทำการแยกหน้า register กับหน้า login โดยการใช้ router กัน
ตอนก่อนหน้า – มือใหม่หัดใช้ Angular ตอนที่ 4: สร้างหน้า register และ login กับ Firebase(AngularFire) [2/2]
ผ่านไปแปปเดียวเราก็มาถึงตอนที่ 5 กันแล้ว หลังจากที่เราทำหน้า register กับ login เรียบร้อย แต่เราสงสัยไหมว่า สมมุติว่าเราอยากจะทำให้ฟังก์ชัน login (หรือ logout) สามารถเรียกได้จากหลายๆหน้า ถ้าใช้วิธีแบบปัจจุบัน เราต้องไปเขียนฟังก์ชันนี้ไว้ในทุกๆ component ที่เราต้องใช้แน่ๆ ซึ่งหากเราจะแก้อะไรซักอย่าง คงต้องวุ่นวายแน่เลย
มาในวันนี้เราเลยจะมาทำความรู้จักกับ…
Service
ตอนก่อนหน้า – มือใหม่หัดใช้ Angular ตอนที่ 3: สร้างหน้า register และ login กับ Firebase(AngularFire) [1/2]
มาต่อกันกับตอนที่สองของการสร้างหน้า register และ login กับ Firebase(AngularFire) กัน
เป็นยังไงกันบ้างกับการสร้าง Account ของ Firebase, การ import AngularFire2 เข้ามาในเว็บของเรา และการสร้าง component ด้วย Angular CLI ไปเมื่ออาทิตย์ที่แล้ว เรื่องง่ายๆใช่ไหมหล่ะ! ในวันนี้เราก็จะมาทำอะไรที่มันยากขึ้นอีกหน่อย นั่นก็คือ…
การสร้างหน้า Register และหน้า Login นั่นเอง (เย่!)
ตอนก่อนหน้า – มือใหม่หัดใช้ Angular ตอนที่ 2: การ install Bootstrap กับ Angular Material
หลังจากที่เราได้ทำความรู้จักกับ Angular พอหอมปากหอมคอไปแล้ว 2 อาทิตย์ ครั้งนี้เราก็จะมาเริ่มลงมือทำอะไรที่มันจริงๆจังๆกันแล้วหล่ะครับ
เพราะในวันนี้เราจะมาทำความรู้จักกับ
อุปกรณ์อันทรงพลังที่ทำได้สารพัดอย่าง (ซึ่งเราเองก็ยังรู้จักไม่หมด) ทั้งการทำระบบ Authentication หรือจะ Host เว็บของเราที่ Firebase ก็ได้
ซึ่งในวันนี้เราจะมาเริ่มกับอะไรง่ายๆก่อน อย่างเช่น การทำระบบ register และ login ให้กับเว็บของเรานั่นเอง
(บทความตอนนี้จะแบ่งออกเป็น 2 ตอนย่อย เพื่อไม่ให้แต่ละตอนยาวจนเกินไปนะครับ)
เชื่อว่ามือใหม่อย่างเราๆคงเคยเจอสถานการณ์ที่ว่า ลืมตั้งค่าให้ git มัน ignore ไฟล์ config ที่สำคัญๆต่างๆ (เช่น config ของ firebase ในไฟล์ environment.ts) ทำให้เผลอ commit มันขึ้นไปโดยไม่ได้ตั้งใจ
ไม่ต้องตกใจ เรามีทางออก!!!
ตอนก่อนหน้า – มือใหม่หัดใช้ Angular ตอนที่ 1: สวัสดี Angular CLI
หลังจากตอนที่แล้ว เราได้ทำความรู้จักกับ Angular CLI ไปเป็นที่เรียบร้อยแล้ว แต่การทำเว็บสมัยนี้เราจะเขียน HTML ล้วนๆเองก็กระไรอยู่ เราจะใช้ตัวช่วย นั่นก็คือออออ…
Bootstrap และ Angular Material!!!
ในครั้งนี้ เราจะใช้ Angular CLI ในการช่วย install Bootstrap และ Angular Material ลงในโปรเจคของเรานั่นเอง
ช่วงนี้เวลาจะทำเว็บซักเว็บนึง มองซ้ายที มองขวาที ก็เจอแต่ Framework ใหม่ๆเต็มไปหมด ทั้ง Angular, React, Vue และอื่นๆอีกมากมาย เลือกกันแทบไม่ได้ ไอ้เราที่เคยเขียนแค่ HTML + JS + CSS ธรรมดาไม่รู้จะใช้อันไหน จะลองเขียนทุกอันทีเดียวก็ไม่ใช่ หลังจากลองหาข้อมูลจากเว็บนู้นที่ เว็บนี้ที สุดท้ายก็มาลงเอยที่ Angular
ถ้าถามว่าอะไรที่ทำให้เลือก Angular? เพื่อนแนะนำมาครับ 555+
คิดว่าเมื่อวานตอนเช้า หลายๆคนที่ได้เปิด Developer tools บน Google Chrome คงได้พบกับข้อความแบบนี้
นั่นเป็นเพราะว่า Google Chrome ของเราได้รับการอัพเดทแล้วนั่นเอง!
พึ่งประกาศผลกันไปสดๆร้อนๆเมื่อเช้า กับผลการแข่งขัน PWA Online Hackathon ที่จัดโดย Web Developer Thailand เมื่อวันศุกร์ถึงวันอาทิตย์ที่ผ่านมา
Priefy Dev. 