HTML - 2023
Ushbu video darslik HTML dan bilishingiz kerak bo'lgan barcha mavzularni o'z ichiga olgan. Video darslik tayorlashda MDN, W3School va bazi YouTube sahifalaridan foydalanilgan.
Quyidagi kontentlar shariy hukumda egalik huquqi bo'lgani uchun, bu materiallardan istalgan ko'rinishda foydalanish uchun Webbrain Academy hamda Sardorbek Muhtorov dan ruhsat olish va telegram kanallarini belgilab ketish shart bo'ladi.
Darslikni foydali deb bilsangiz yaqinlaringizga ulashing. To'liq kontent video ko'rinishida YouTube sahifamizga joylangan. Obuna bo'lishingiz ham biz uchun keyingi ishlarda katta turtki bo'ladi.
Videoni to'liq sotib olish uchun: https://teletype.in/@webbrain_ceo/video_darsliklar
Hurmat bilan Sardorbek Muhtorov.
1 - dars | Bu qanday darslik? | YouTube Link
ā Darslik haqida umumiy malumotlar
ā Darslik kimlar uchun
ā Darslik davomida nimalar o'rganasiz.
2 - dars | Dasturlashga kirish | Dasturchining yo'l xaritasi | YouTube Link
ā Ushbu darslik haqida umumiy malumot!
ā Ustoz kim? Qanday tajribasi bor?
ā Dasturlash nima?
ā Dasturchi kim?
ā Frontend, backend, mobile, designerlar kimlar va ularning vazifalari!
ā Dasturlashdagi qiyinchiliklar...
ā Jarimalar haqida
ā Dars qilishdagi xatolar
ā Diplom kerakmi?
ā Soft skillar / sms yozish qoidalari.
ā Foydali linklar
3 - dars | HTML nima | Nazariy | YouTube Link
ā HTML nima?
ā HTML, CSS, JS va ReactJS nima va ularning ishlatilish o'rni.
ā HTML o'rganib ishga kirsa bo'ladimi?
4 - dars | VS Code o'rnatish | YouTube Link
ā VS code nima?
ā File yaratish
ā Eski versiyadagi computerlar uchun VS Code
ā VS Code sidebar vazifalari.
ā HTML uchun kerakli extensions
ā Code formatter settings
ā Shortcuts
5 - dars | Birinchi dasturni yozish | Tags | YouTube Link
ā yozilgan codelarni browserda ko'rish
ā VS codeda auto save va uning ishlatilish o'rinlari
ā Live server
ā Tag nima?
ā root tagi.
ā configuration tag
ā browser tag
ā Heading tagi
ā Paragraph tagi
6 - dars | Formatting tags | YouTube Link
ā Shoirlar uchun tag
ā <b> va <strong>
ā <i> va <em>
ā <marker>
ā <del va <ins>
ā <sub> va <sup>
ā <q> va <blockquote>
7 - dars | File path | YouTube Link
ā Real project qanaqa ko'rinishda bo'ladi
ā file va papkalar bilan ishlash
ā terminal bilan ishlash
ā windows va mac dagi farqlar.
8 - dars | Link | Attribute | YouTube Link
ā Link nima?
ā Attribute nima?
ā href attribute va ularning qiymatlari
ā target attribute va vazifalari
ā malumot tortib olish / download
ā tooltip
9 - dars | style attribute | style tag | YouTube Link
ā style nima?
ā ingliz tilini dasturlashdagi o'rni.
ā background-color va color
ā border va px tushunchalari
ā padding
ā border-collapse
ā visibility
ā display: flex / none
ā opacity
ā style tag
10 - dars | CSS Selectors in HTML | YouTube Link
ā ID selector
ā Class selector
ā id vs class
11 - dars | Image | YouTube Link
ā img attributes - src / alt
ā img width and height
ā image link
ā image map / usemap
ā area / shape / coord
ā responsive images
ā picture / source / media query
12 - dars | Table | YouTube Link
ā Table nima?
ā Table qanchalik muhim? real projectdagi ko'rinishi.
ā table border / border-collapse: collapse
ā table, tr, td, th.
ā Table sizing.
ā colspan / rowspan
ā Column grouping
13 - dars | Lists | YouTube Link
ā list nima?
ā ordered list
ā unordered list
ā description list
ā nested list
ā ordered list style
ā unordered list style
ā list-style-type / css orqali type o'zgartirish
14 - dars | Block | Inline | YouTube Link
ā block tagi nima?
ā inline tagi nima?
ā inline vs block taglarining farqarli.
15 - dars | Media | YouTube Link
ā video tagi nima vazifa bajaradi?
ā nega autoplay attr ishlamaydi? Izoh.
ā video ustiga cover(obloshka) qo'yish
ā audio tagi va attributelari.
16 - dars | Iframe | YouTube Link
ā iframe nima va nima maqsadda ishlatiladi?
ā boshqa websitelarni o'zingizda ishlatish.
ā YouTube videolarini html da chiqarish.
17 - dars | JavaScript in HTML | YouTube Link
Eslatma! Ushbu mavzuni tushunishga qiynalsangiz keyingi darslikka o'tishingiz mumkin. Bu mavzu JS darslarida batafsil tushuntiriladi.
ā javascript nima vazifa bajaradi?
ā script tagi haqida
ā console.log nima?
ā document nima?
ā queryselector use case.
ā javascript orqali style berish
ā onclick / onmousemove
ā function
18 - dars | Forms | YouTube Link
ā form tagi va attributelari
ā form inputs va ularning typelar....
ā placeholder
ā autocomplete
ā select / option / default select
ā fieldset / legend
ā input with datalist / list
19 - dars | Semantic tags | YouTube Link
ā nega semantic taglardan foydalanish kerak?
ā nav, main, aside, footer, header
ā details, time, summery, section, article
20 - dars | Entities | YouTube Link
ā Binary number theory
ā ASCII Table
ā ISO-8859
ā UTF-8
ā Charset
ā Symbols
21 - dars | SVG | YouTube Link
ā SVG nima?
ā line / x1 y2, x2 y2
ā circle / radius / not allowed icon yasash
ā rectangle / width, height /
ā ellipsis / rx, ry...
ā polygon / points
ā grouping svg
22 - dars | Canvas | YouTube Link
ā Canvas nima?
ā line / querySelector / 2d context
ā circle / arc
ā text / fillText / font
BONUS
Interview savollari va amaliy mashqlar: https://t.me/html_homework