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