[Technos เรียนรู้ทุกๆวัน] สรุปความรู้เบื้องต้นสำหรับผู้ที่อยากพัฒนาเว็บ การสร้าง web application มาสักเว็บ เราจำเป็นต้องใช้หลายๆภาษา หลายๆเทคโนโลยีประกอบรวมกันขึ้นมา สำหรับงานหน้าบ้านที่เป็นส่วนติดต่อกับ user จะใช้ html css ja

สำรวจ
ลงทุน
คำถาม

มีบัญชีอยู่แล้ว?หรือ

•

4 ก.ค. 2021 เวลา 06:19 • การศึกษา

สรุปความรู้เบื้องต้นสำหรับผู้ที่อยากพัฒนาเว็บ

การสร้าง web application มาสักเว็บ เราจำเป็นต้องใช้หลายๆภาษา หลายๆเทคโนโลยีประกอบรวมกันขึ้นมา สำหรับงานหน้าบ้านที่เป็นส่วนติดต่อกับ user จะใช้ html css javascript ส่วนงานหลังบ้านที่ใช้สำหรับทำงานกับ server และ database จะใช้ javascript python java SQL

ภาษาแรกที่เรามักจะถูกสอนคือ HTML หรือ HyperText Markup Language เป็นภาษา mark up ใช้ในการออกแบบโครงสร้างของหน้าเว็บที่จะถูกแสดงบน browser

HTML structure หรือโครงสร้างของ HTML

การเขียน html จะเขียนในลักษณะมี tag เปิดและปิด ครอบข้อความของเรา โดยข้อความจะถูกแสดงตามลักษณะของ tag (HTML element) ที่ครอบมันอยู่

ตัวอย่าง content ที่แสดงบน browser

สามารถดู tag element ชนิดอื่นๆของ html ได้ที่นี่ https://devdocs.io/

หรือเรียนในการพัฒนาเว็บเพิ่มเติม https://www.w3schools.com/

HTML attribute

hr เป็น html element รูปแบบนึงที่ใช้แสดงเส้นตรงแนวนอน ตามตัวอย่างข้างล่างนี้

การที่เราเพิ่ม attribute เข้าไปจะทำให้เราสามารถปรับแต่งคุณสมบัติบางอย่างของ html element ได้อย่างเช่น เพิ่มความหนาของเส้น โดยเพิ่ม size="3" และ color="black" เข้าไป

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

** ทั้งนี้เราต้องศึกษาเพิ่มเติมว่า element แต่ละตัวมี attribute อะไรบ้างที่รองรับ แต่โดยส่วนใหญ่แล้วเราจะใช้ css มาช่วยในส่วนนี้แทนการใช้ attribute บางอย่างซึ่งเราจะมาสรุปการใช้งาน css กันในตอนถัดไป **

comment on html

การเขียน comment ใน html ทำได้โดยการเขียน comment ภายใน tag ที่แสดงตามตัวอย่างด้านบน ข้อความที่อยู่ภายใน tag ดังกล่าวจะไม่ถูกแสดงผลในหน้าเว็บ

สำหรับผู้ที่ยังไม่รู้ comment มีหน้าที่ช่วยให้เราสามารถเขียนอธิบาย code แต่ละส่วนของเราเพื่อให้ตัวเราเองหรือคนที่ร่วมพัฒนากับเรา กลับมาอ่าน code แล้วเข้าใจว่า code ส่วนนี้เอาไว้ทำอะไรและทำงานอย่างไร ทำให้การกลับมาทำความเข้าใจ program ที่เขียนไว้ทำได้ง่ายขึ้น

ตัวอย่าง comment

จะเห็นว่าข้อความ pass : 1234 ที่เขียนภายใน tag comment จะไม่แสดงผลบนหน้าเว็บ แต่เราจะเห็น comment ก็ต่อเมื่อเราเปิดดู source code ของหน้าเว็บ

HTML boilerplate

บรรทัดแรก ใช้บอก browser ว่าเรากำลังใช้ html version อะไร ในที่นี้เราใช้ html5

code ภายในส่วนของ html tag จะประกอบไปด้วยส่วนของ head และ body

head ใช้ใส่ข้อมูลที่เกี่ยวข้องกับเว็บของเราเพื่อบอกให้ browser รู้ว่าจะทำอย่างไรกับหน้าเว็บของเราบ้าง เช่น ให้แสดง title บน tap ขแง browser ว่าอะไร

body เป็นส่วนที่เราใส่ข้อความรวมถึงโครงสร้างหน้าตาของเว็บเรา ในส่วนที่ต้องการแสดงผลให้ user ใช้งาน

โฆษณา

ดาวน์โหลดแอปพลิเคชัน

ดาวน์โหลดแอปพลิเคชัน