12-Hour Coding Bootcamp 2024 - HTML, CSS, and JavaScript Fundamentals

12-Hour Coding Bootcamp 2024 - HTML, CSS, and JavaScript Fundamentals

Code with Ania Kubów via YouTube Direct link

Styling a div https://bit.ly/sty-div

40 of 122

40 of 122

Styling a div https://bit.ly/sty-div

Class Central Classrooms beta

YouTube videos curated by Class Central.

Classroom Contents

12-Hour Coding Bootcamp 2024 - HTML, CSS, and JavaScript Fundamentals

Automatically move to the next video in the Classroom when playback concludes

  1. 1 Introduction
  2. 2 What is a Code Editor?
  3. 3 Code editor options
  4. 4 Files files files
  5. 5 HTML Introduction
  6. 6 What exactly is it?
  7. 7 Syntax
  8. 8 Saving files
  9. 9 Anatomy https://bit.ly/html-anatomy
  10. 10 Headings
  11. 11 Paragraphs
  12. 12 Headings, paragraphs and emphasis https://bit.ly/headings-paragraphs
  13. 13 Indenting code
  14. 14 Lists https://bit.ly/htlm-list
  15. 15 Links https://bit.ly/html-lks
  16. 16 Navigating pages https://bit.ly/html-pages
  17. 17 Images https://bit.ly/html-imgs
  18. 18 Tables https://bit.ly/html-tb
  19. 19 Divs
  20. 20 Semantic sectioning
  21. 21 ⭐Project: Table Tennis Leaderboard https://bit.ly/leader-brd
  22. 22 Forms
  23. 23 Inputs
  24. 24 Exercise 1 https://bit.ly/input-ex
  25. 25 Exercise 2 https://bit.ly/input-ex-2
  26. 26 Exercise 3 https://bit.ly/input-ex-3
  27. 27 Select dropdown https://bit.ly/html-slc
  28. 28 using the select element https://bit.ly/html-slc-x
  29. 29 The inspect tool
  30. 30 Data attribute https://bit.ly/data-at
  31. 31 Commenting out code https://bit.ly/com-out
  32. 32 What’s next?
  33. 33 CSS Introduction
  34. 34 File setup https://bit.ly/file-set
  35. 35 Style text https://bit.ly/sty-tex
  36. 36 Class selectors https://bit.ly/class-s
  37. 37 ID selectors https://bit.ly/id-se
  38. 38 Commenting out https://bit.ly/com-ot
  39. 39 The box model https://bit.ly/box-mod
  40. 40 Styling a div https://bit.ly/sty-div
  41. 41 Solution: styling a div https://bit.ly/sty-div-s
  42. 42 Colors
  43. 43 RGB https://bit.ly/rgbx
  44. 44 HEX https://bit.ly/hexx
  45. 45 Opacity https://bit.ly/opa-x
  46. 46 Gradients https://bit.ly/grdx
  47. 47 Advanced gradients https://bit.ly/gradcs
  48. 48 Shadows https://bit.ly/shds
  49. 49 Style links https://bit.ly/sty-lnk
  50. 50 ⭐Project: Profile Badge https://bit.ly/prf-bd
  51. 51 Selectors https://bit.ly/slctx
  52. 52 Position
  53. 53 Positioning divs
  54. 54 Floating elements
  55. 55 Z-index https://bit.ly/zind
  56. 56 Exercise: Z-index https://bit.ly/zind-x
  57. 57 Extra fonts
  58. 58 ⭐Project: Burger Menu https://bit.ly/brgr-x
  59. 59 Flex box
  60. 60 Main Axis https://bit.ly/flx-x
  61. 61 Dynamic spacing
  62. 62 Exercise: Flexbox https://bit.ly/fl-box
  63. 63 Flex items https://bit.ly/fl-it
  64. 64 Styling buttons https://bit.ly/css-bt
  65. 65 :hover :active :disabled https://bit.ly/hvr-x
  66. 66 Controlling Scrolling https://bit.ly/scrl
  67. 67 ⭐Project: Photo Carousel https://bit.ly/crsl
  68. 68 Forms https://bit.ly/frm-x
  69. 69 Input types https://bit.ly/inpt
  70. 70 Focusing on inputs https://bit.ly/fc-inp
  71. 71 Nesting in CSS https://bit.ly/nst-x
  72. 72 ⭐Project: Signup Modal https://bit.ly/sg-md
  73. 73 Responsiveness
  74. 74 Break points https://bit.ly/br-pt
  75. 75 Viewport https://bit.ly/vw-pt
  76. 76 Transforming https://bit.ly/tr-fm
  77. 77 Keyframes https://bit.ly/ky-fr
  78. 78 ⭐Project: Developer Portfolio https://bit.ly/dev-p
  79. 79 What next?
  80. 80 JavaScript Intro
  81. 81 Client-side vs server-side
  82. 82 File setup
  83. 83 console.log
  84. 84 Variables https://bit.ly/vr-x
  85. 85 Scope
  86. 86 var vs let https://bit.ly/vr-lt
  87. 87 const https://bit.ly/cntx
  88. 88 Booleans, strings, numbers
  89. 89 Exercise: Booleans, strings, numbers https://bit.ly/bsn-x
  90. 90 Other data types
  91. 91 Arithmetic operators https://bit.ly/art-x
  92. 92 Comparison operators https://bit.ly/cp-x
  93. 93 Assignment operators https://bit.ly/as-x
  94. 94 Equality operators https://bit.ly/eq-op
  95. 95 if statement https://bit.ly/if-x
  96. 96 Falsey + truthy https://bit.ly/f-trx
  97. 97 Logical operators
  98. 98 Nullish coalescence operator
  99. 99 Ternary operator
  100. 100 if/else
  101. 101 Exercise: if/else
  102. 102 Exercise: if exercise
  103. 103 Exercise: if/else
  104. 104 Loops
  105. 105 For statement
  106. 106 Do…while statement
  107. 107 …while statement
  108. 108 10:52:35 Exercise: Fizz buzz
  109. 109 Functions
  110. 110 Arguments + parameters
  111. 111 Exercise: Arguments + parameters
  112. 112 Exercise: functions progress https://bit.ly/fcpr
  113. 113 Function expressions
  114. 114 Exercise: Function expressions
  115. 115 Arrow function expressions
  116. 116 Exercise: Arrow function expressions
  117. 117 Methods and properties
  118. 118 The Math Object
  119. 119 Exercise: The Math Object https://bit.ly/mh-x
  120. 120 Web APIs
  121. 121 .addEventListener
  122. 122 Where now

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.