เริ่มต้นกับ Hello World Angular

สวัสดีครับ บทความนี้ ผมจะมาโน๊ตวิธีการ Hello World กับ Angular กันครับ ซึ่ง angular ก็เป็น framework ที่ได้รับความนิยมมากอันหนึ่ง ที่มีผู้สนับสนุนเบื้องหลังอย่าง google เป็น back up ดังนั้น บทความนี้เรามา Hello world กันก่อนดีกว่า

เริ่มต้นกับเว็บนี้เลย https://angular.io/guide/setup-local

ตามขั้นตอนเราก็ต้องติดตั้ง angular cli ก่อนครับ โดยใช้คำสั่งด้านล่าง อย่าลืมว่าต้องติดตั้ง node ก่อนนะครับ

npm install -g @angular/cli

จากโค้ดด้านบน เราติดตั้ง angular cli แบบ global ดังนั้นเราสามารถเรียกใช้ได้ทุกที่

ต่อไปเราก็ Initial app โดยใช้คำสั่ง

ng new my-app

จากดค้ดด้านบน เราก็ new my-app ซึ่งเมื่อเรารันคำสั่งไปแล้วจะปรากฎ Folder my-app ขึ้นมา ตามคำสั่ง เราสามารถเปลี่ยน my-app เป็นอย่างอื่นได้ตามต้องการ และใน my-app ก็จะมีโค้ดบางส่วนมาให้เรา

จากนั้นให้เราลองรันโค้ดที่ได้มา โดยให้ใช้คำสั่ง

cd my-app
ng serve --open

จากโค้ดด้านบน คำสั่งแรก เราจะเข้าไปที่ Folder my-app ที่เราได้ initial ขึ้นมา จากนั้นคำสั่งที่สอง เราใช้ ng serve –open เป็นการรันคำสั่งแล้วเปิดบราวเซอร์ขั้นมา

เมื่อเรารันไปแล้วรอซักพักก็ได้ Hello World ขึ้นมาแล้ว ตามตัวอย่างรูปด้านล่าง

Welcome to my-app!
Tags:

Add a Comment

Your email address will not be published. Required fields are marked *