Gain a foundational understanding of web development concepts, including the roles of HTML, CSS, JavaScript, and Bootstrap in creating dynamic, responsive websites.
Undergraduate Degree in Computer Sceince, or Related Field
What is Web Development?
Frontend vs Backend Development
Introduction to HTML
Doctype, html, head, body
Title, Meta tags, and Document Formatting
Headings h1 to h6
Paragraphs p
Links a
Images img
Lists: Ordered and Unordered ul,ol,li
form, input, button, select
Form attributes and handling form submissions
table, tr, td, th, thead, tbody
header, footer, article, section, nav
Inline, Internal, and External CSS
Selectors, Properties, and Values
Box Model and Layout (padding, margin, border)
Font styling
Colors, Backgrounds, and Gradients
Borders and Shadows
What is JavaScript?
Embedding JavaScript in HTML
Variables, Data Types (string, number, boolean)
Operators (Arithmetic, Logical, Comparison)
If-else statements
Switch case
Loops: for, while, do-while
Defining Functions
Function parameters and return values
Anonymous functions, Arrow functions
Event handling (e.g., onclick, onmouseover, onkeydown)
Event listeners and DOM manipulation
Arrays: Definition, access, and methods
Objects: Definition, properties, and methods
Selecting DOM elements (getElementById, querySelector)
Changing text, attributes, and styles
Creating, adding, and removing elements dynamically
Try-catch blocks
Console logging and debugging techniques
Parsing JSON data
Converting data to JSON format
Overview of Bootstrap framework
Importance of responsive design
Setting up Bootstrap (CDN or local files)
Understanding the 12-column grid layout
Creating responsive layouts with columns
Nesting grids and breakpoints (mobile-first design)
Buttons, Alerts, Cards, Modals
Forms, Navbars, Dropdowns
Carousel and Sliders
Buttons, Alerts, Cards, Modals
Forms, Navbars, Dropdowns
Carousel and Sliders
Carousel and Sliders
Media Queries and Breakpoints
Creating mobile-first designs
Customizing Bootstrap themes
...
Accordion, Jumbotron, List Groups
Pagination, Progress Bars, Tooltips
Customizing Bootstrap with SASS
Changing default theme colors
Using Bootstrap Icons
Applying HTML, JavaScript, and Bootstrap concepts
Designing and developing a responsive website
Best Practices for Web Development
Career opportunities in Web Development
Final Q&A and Feedback
...