Complete Front-End Developer Bootcamp

-
Introduction to FrontEnd Bootcamp
-
Understanding The Internet
- Understanding Internet Protocols
- Internet Protocol (IP Address) and Domain Name Service (DNS)
- Clients and Servers and How They Interact
- Data Packets, Routing and Reliability
- What is HTTP?
- HTTP and other Protocols
- Client – the User Agent
- The Web Server
- Anatomy of an HTTP Request
- Anatomy of an HTTP Response
- Section Quiz
-
Intro to HTML - HyperText Markup Language
- Introduction to HTML
- Hypertext Markup Language – What does it really mean?
- What are Tags?
- How Browsers Work
- Basic HTML Structure
- Sample Document
- Nested HTML Elements
- Types of HTML Tags
- Installing a Code Editor
- Creating an Index File
- Features and Benefits of VsCode
- Empty HTML Elements
- HTML Attributes
- Width, Height, Cases & Quotes
- Alt Attribute
- Style Attribute
- Adding Multiple Style Properties
- Tooltip
- HTML Comments
- Section Quiz
- Navigation Menu
- HTML Links
- From Webpages to Website
- Absolute Vs Relative URL
- Relative URL Referencing
- Target Attribute
- Image Linking
- Lists
- List Markers
- Section Quiz
- Description List
- Creating Bookmarks
- Image Floating
- Background Image and Centering in HTML
- HTML Table
- Adding Images to Tables
- Inline and Internal CSS in HTML
- External CSS
- CSS Precedence
- Applying CSS To Table Head
- Table Center
- Styling Multiple Elements
- Styling with nth-child
- Vertical Zebra Styling
- Overlapping Zebra Style
- Border Values
- Quiz
- Colspan
- Rowspan
- Using Table Layout in Web Design
- HTML Forms
- Binding Labels to Input Field
- Increasing Hit Area & Accessibility
- Submitting HTML Forms
- Adding Value to Database
- Providing Default Value for Text Input
- Section Quiz
- Reset Button & Date Submission
- Using Image as Submit Button
- File Upload With HTML
- Slider & Volume Control
- Numeric Input Field
- Search Field
- Telephone Field
- Appointment Booking & URL Input Field
- Securing User Data With POST
- Dropdown Menu
- TextArea
- Password Field
- Adding a Color Palette
- Grouping Forms
- Forms & Javascript
- Section Quiz
-
Advanced HTML
- HTML Block-level Element
- HTML Inline Elements
- Block-level Elements Demo
- Intro to HTML DIV & SPAN
- Aligning a DIV Element
- Positioning DIV Elements with Float
- DIV as Inline-Block Element
- CSS Flex Layout
- Embedding Forms & Pages in HTML
- Iframe Border
- Iframe as Target Frame
- Embedding YouTube in Your Website
- Metadata – Keywords
- Metadata – Author, Charset, Viewport
- Responsive Images
- HTML Entities
- Non-Breaking Space
- HTML Emojis
- Responsive Images for Multiple Devices
- Favicon
- Hosting Your Own Video
- Hosting Podcasts, Songs and Audio Files
- Tools for Front-End Development – Getting Image
- Tools for Front-End Development – Resizing Images
- Tools for Front-End Development – Background remover & Circle Image
- Brand Colors
- Selecting Matching Colors
- Checkpoint : Project 1 – A Personal Portfolio Website
-
Intro to CSS - Cascading Style Sheet
- Intro to CSS & Precedence
- CSS Syntax
- CSS Class Selector
- Target Selectors
- Star & Grouping Selector
- Comments & Colors
- Background Color
- Opacity
- Background Image
- Repeat & Positioning
- Scrolling Images
- CSS Shorthand
- CSS Background Image Sizing
- Expanding Border Color
- Expanding Border Style
- Border Radius
- Margin
- Padding
- Width & Height
- CSS Box Model
- CSS Outline
- Using Google Inspect With CSS
- Layout Debugging with Pesticide
- Text Styling – Inline Block
- Text-Decoration
- Using Line-through
- Font Families
- Choosing Fonts Based on Project Niche
- How to Apply Websafe Fonts
- Font Style, Weight & Variant
- Font Pairing
- Applying Font Pairing
- Font Shorthand
- Link Styling with CSS Props
- Link Styling with States
- Link Styling with Text Decoration
- Advanced Link Styling
- Unordered List Marker Styling
- Ordered List Marker Styling
- Image List Marker
- Links to Nav with CSS
- Display Property for Page Layout
- Display Block, Inline & Flex
- Inline-block vs Block
- Display none Vs Visibility hidden
- Position Property for Page Layout
- Position Fixed
- Position Absolute
- Sticky Elements
- CSS Opacity Property
- Opacity on Hover
- Opacity & Positioning
- Z-index Minus One
- Z-index Stacking
- Handling Content Overflow
- CSS Pseudo class
- Pseudo Class on Div
- Aligning Images in Div
- Tooltip with Pseudo Class
- Horizontal Nav Menu
- Separating a Menu Item
- Vertical Nav Bar
- Positioning Vertical Nav Bar
- CSS Dropdown
- Dropdown Box
- Dropdown Button with Links
- Image Aspect Ratio
- Image Dropdown
- Horizontal Navigation Menu
- Dropdown Navigation Menu
- Image Gallery
-
Advanced CSS
- CSS Transformation
- 3D Transformation
- CSS Transition
- Transition Speed Curve
- Transition Delay
- Transition Transform
- Applying Style to Form Input
- Styling Textarea
- Grouping Forms With Div
- Styling Submit Button
- Color Form Input & Focus Pseudo-state
- Border Styles for Forms
- Search Input & Button Styling
- Adding a Search icon
- Animating an Input Field
- Styling the Select Dropdown
- Intro to CSS Animation
- Applying Animation to Other Elements
- Increasing Animation Range
- Animating Multiple Properties
- Animation Delay
- Animation Iteration and Infinite Loop
- Changing Motion Direction
- Animation Speed Curve
- Bouncing Effect
- Animation Shortcut
- Tooltip Advanced
- Positioning Box Theory
- Positioning Top & Bottom
- Understanding Pseudo Elements
- Pseudo-elements : First letter
- Combining Pseudo-elements
- Marker & Selection Pseudo-element
- Before & After Pseudo-element
- Creating a Speech Bubble
- Positioning the Tooltip Arrow
- Creating Image Thumbnails
- Clickable Image Thumbnails
- Rounded Images
- Flipping Image
- Text Over Image
- Image Overlay
- Centering Overlay Text
- Box Overlay
- Adjusting Box Overlay
- Slide in Overlay | Implicit Vs Explicit Properties
- Slide in Overlay – Sides
- Pagination
- Styling Pagination
-
Introduction to JavaScript
- What is JavaScript?
- Features & Applications of JavaScript
- Development Environment
- Linking JS Inline
- Internal JS
- External JS
- What is Nodejs?
- Installing Nodejs
- Running Nodejs in VS Code
- Installing a Local Server Environment
- Benefits of Developing on a Local Server
- Live Preview
- Changing HTML Content with JS
- Changing HTM Attr. Value with JS
- Changing CSS with JS
- Changing More CSS Properties
- Using JS to Hide Elements
- JS Syntax
- Code Block
- Variable Declaration & Initialization
- Declaring, Initializing & Multiple Variables in a Statement
- Varying Variables
- Constant Variable
- Identifier Rules
- Assignment Vs Equal To
- JS Comment
- Understanding JS Data Types
- Strings & Numbers
- BigInt
- Boolean
- Symbol
- Undefined Vs Null
- Object Data Type
- typeOf Method
- How JS Store Numbers
- Operation Sequence
- Exponential Notation
- Re-declaring Variables
- Block Scope Vs Global Scope
- Const Property 1
- Const Property 2
- String Conversion
- Number Conversion
- Boolean Conversion
- Operators in JS
- Increment, Decrement & Concatenation
- Operator Precedence
- HTML Practice
- Assignment Operators
- Comparison Operators: Loose Equality
- Comparison Operators: Type Coercion & Strict Equality
- Comparison Operators: notEqual
- Compound Comparison Operators
- NaN in JavaScript
- Logical AND
- Logical OR
- Logical NOT
- Combining Operators
- Functions in Javascript
- Parameters & Arguments
- Multiple Parameters
- Function Invocation : Events
- Function Invocation : Code & Self
- Return
- Parameter Default Value
- Local Sope
- Declaration, Expression & Hoisting
- Control Structures : Conditional If-Else Statement
- Control Structures : Conditional Else-If Statement
- Switch
- For Loop
- While Loop
- Do While Loop
- JS Arrow Function
- Javascript Events
-
Advanced Javascript
- String Literal
- JS Methods
- Extracting Single String Character
- Extracting Sections of a String
- Case Manipulation
- Exercise: Case Manipulation in HTML
- Concat, Trim & Padding
- Repeat & Replace Methods
- String Search by Index
- String Query
- String Templates
- String Interpolation
- Global Number Method
- String to Number Method
- Understanding Objects
- Object Properties & Methods
- Creating Objects
- Accessing Object Elements
- Deleting Object Elements
- Nested Objects
- Looping Through an Object
- Counting Object Properties
- Understanding JS Array
- Adding & Accessing Array Elements
- Array toString() & Length Prop
- Array Looping
- Array Summation
- Highest Value in Array
- Array push() & length prop
- Identifying an Array
- Array to String
- Removing Elements From Array
- Separating & Joining Arrays
- Searching an Array
- Sorting & Ordering an Array
- Js Date and Time
- Static Date
- Displaying Date & UTC
- Date Get Method
- Readable Date Format
- Date Set Method
- Math Properties
- Math Methods – Rounding Numbers
- Math Methods – Min|Max|Pow|Abs
- Random Number Method
- Random Decimal To Integer
- JS SET
- Set Methods
- Looping Through a Set
- JS Map
- Map Set() Method
- Map Methods
- Looping Through a Map
- Error Handling in JS; Try-Catch Statement
- The Error Object
- Throwing Custom Error
- Classes in Javascript
- Private Properties & Get
- Changing Property Values with Set
- Static Methods
- Class Inheritance
- Javascript Modules
- General Import
- Default Import
- Modules Best Practices
- JavaScript JSON
- Parsing JSON to JavaScript
- JSON Arrays
- Dates in JSON
- JS to JSON
- Intro to HTML DOM
- Visualizing HTML DOM
- DOM Manipulation
- Accessing DOM
- Accessing Nested Tags
- Accessing Class Names
- Query Selector
- DOM Manipulation: Step 2
- DOM Attribute Manipulation
- Inserting Dynamic HTML
- Writing on HTML Output Stream
- Manipulating Style with DOM
- DOM 3: Create/Delete Elements – NODE Relationship
- DOM PlayGround
- DOM 4: Event Handling & Delegation
- HTML Events
- Event Delegation
- Sample Event Listener
- Adding Multiple Events
- Window Event
- Event Lists
-
Version Control System
-
Tosburgworld
Tobi Solomon Dosumu
I got to know Engr Emma through Digital Marketing Course in the year 2020 and I have been with him till date and will continue to be with him until Jesus Christ comes reason being that he is gifted with making what is complex very simple. Front-end development is not an exception! A word of encouragement to those willing to take a course in front-end development and don't know where to take the course I can tell you for free that Millionaires Academy is the right place to be to becoming a Pro and there can never be an iota of regret that I can assure you...
-
Pascal
5
This course is exceptional!The content is well organized.The facilitator is knowledgeable and provided clear and concise explanations.I highly recommend this course to anyone looking to enhance their frontend development skills .