| 1 Learn and Explore HTML as a Beginner |
|
1.1 Getting started with your first ever website |
|
00:09:00 |
|
1.2 HTML language, markup, tags structure, paragraph tag |
|
00:09:00 |
|
1.3 Bold, strong, how HTML tag works |
|
00:07:00 |
|
1.4 Heading tag, different types of headings |
|
00:06:00 |
|
1.5 HTML tag attribute, anchor, href, navigate |
|
00:10:00 |
|
1.6 Display image (online image, local image, folder image) |
|
00:12:00 |
|
1.7 List, Container tag, ordered list, unordered list |
|
00:08:00 |
|
1.8 Button, input, div, span, w3schools, every html tags |
|
00:08:00 |
|
1.9 HTML structure, head, body, title, meta tag |
|
00:06:00 |
|
1.10 HTML Module Summary, 4 types of HTML tags |
|
00:07:00 |
|
HTML Final Quiz |
|
00:10:00 |
| 2 Learn and Explore CSS as a Beginner |
|
2.1 Introduction to CSS Module, getting started with CSS |
|
00:05:00 |
|
2.2 Style tag, embedded style, named color, hexcode, rgb |
|
00:12:00 |
|
2.3 Background-color, height, width, font, css measuring units |
|
00:12:00 |
|
2.4 CSS ID, apply styles to a specific HTML element |
|
00:08:00 |
|
2.5 CSS class, apply styles to multiple elements, ID vs Class |
|
00:10:00 |
|
2.6 Style a group of elements, style a small portion of text |
|
00:08:00 |
|
2.7 Border, border radius, margin, different ways to set margin |
|
00:10:00 |
|
2.8 Padding, different ways to set padding, CSS Box model |
|
00:08:00 |
|
2.9 Text align, float, display, inline, block, inline-block, external CSS |
|
00:11:00 |
|
2.10 CSS Module Summary |
|
00:06:00 |
|
CSS Final Quiz |
|
00:05:00 |
| 3 Git, source control, GitHub and hosting |
|
3.1 What is GitHub? |
|
00:00:00 |
|
3.2 Install git, create GitHub repository |
|
00:00:00 |
|
3.3 Git init, git add, git commit, set origin |
|
00:00:00 |
|
3.4 Git push, git pull |
|
00:00:00 |
|
3.5 GitHub overall summary |
|
00:00:00 |
| 4 Build a beautiful and professional portfolio website |
|
4.1 Module Introduction, overview of the site you will build |
|
00:03:00 |
|
4.2 Setup and resources needed to start your first ever project |
|
00:10:00 |
|
4.3 Create html, link css, set title, span tag style |
|
00:09:00 |
|
4.4 Simple image background remove, set fancy background |
|
00:11:00 |
|
4.5 Float, Create container, Put two div side by side, Image size |
|
00:08:00 |
|
4.6 Background Image, Background-repeat, neutralize default style |
|
00:06:00 |
|
4.7 Link Button, target blank, text-decoration, linear gradient |
|
00:08:00 |
|
4.8 Dream image, half-width, background remove |
|
00:09:00 |
|
4.9 Dream area, dream text and download resume link button |
|
00:07:00 |
|
4.10 Experience Area, text highlight, meaningful class name |
|
00:08:00 |
|
4.11 Box shadow, border image, gradient angle, footer |
|
00:12:00 |
|
4.12 Website hosting, live portfolio link, portfolio summary |
|
00:08:00 |
| 5 Personal website, build a brand new website |
|
5.1 Personal website, build a complete website by yourself |
|
00:07:00 |
| 6 Learn and Explore Bootstrap |
|
6.1 Module Introduction, Purpose of Bootstrap |
|
00:02:00 |
|
6.2 Getting started with Bootstrap |
|
00:10:00 |
|
6.3 Buttons, text color, background corlor, color pallate |
|
00:11:00 |
|
6.4 Image, Responsive image, width style, image thumbnail |
|
00:09:00 |
|
6.5 Website card, card design, card image, card deck |
|
00:09:00 |
|
6.6 Nav tag, Navigation, nav bar, use ul-li for navigation |
|
00:10:00 |
|
6.7 Website Layout, Responsive website |
|
00:07:00 |
|
6.8 Grid layout, row, column, 12 column layout |
|
00:11:00 |
|
6.9 Responsive Grid, responsive break point |
|
00:09:00 |
|
6.10 Top banner animation, Image slide, Carousel |
|
00:07:00 |
|
6.11 Flex Layout, Element align, vertical and horizontal center |
|
00:12:00 |
|
6.12 Bootstrap Overview, Module Summary |
|
00:06:00 |
| 7 Develop an e-commerce website using Bootstrap |
|
7.1 Website overview and different section that you will build |
|
00:02:00 |
|
7.2 Project setup, github repository, project resources |
|
00:09:00 |
|
7.3 Container, navbar, navbar item, links |
|
00:08:00 |
|
7.4 Simple top banner carousel, set image for carousel |
|
00:05:00 |
|
7.5 Advanced carousel with row and column divide |
|
00:08:00 |
|
7.6 Vertical center in carousel item, button style |
|
00:12:00 |
|
7.7 Categories, column gap, category in each row |
|
00:19:00 |
|
7.8 Shoe Category, card-deck, card box shadow |
|
00:11:00 |
|
7.9 Backpack Category, card footer, align button |
|
00:09:00 |
|
7.10 Subscribe Section, Horizontal and vertical center |
|
00:11:00 |
|
7.11 Footer, small tag, text center align |
|
00:04:00 |
|
7.12 Porject summary, Code Recap |
|
00:09:00 |
| 8 Hot Gadgets, e-commerce website by yourself |
|
8.1 Hot Gadgets, e-commerce website by yourself |
|
00:08:00 |
| 9 Getting started with Javascript |
|
9.1 Module overview, need for Javascript |
|
00:04:00 |
|
9.2 Run Javascript in browser, run Javascript in VS Code |
|
00:15:00 |
|
9.3 What is variable, declare a variable, see output |
|
00:06:00 |
|
9.4 Variable type, Numeric, String, Boolean |
|
00:10:00 |
|
9.5 Make conditional decision, if-else, comparison |
|
00:11:00 |
|
9.6 Multiple conditions, fulfill both conditions, else if |
|
00:10:00 |
|
9.7 Array, index, set by index, indexOf |
|
00:12:00 |
|
9.8 Array advanced, Push, pop, array length |
|
00:06:00 |
|
9.9 While loop, debug javascript code, less or equal |
|
00:10:00 |
|
9.10 For loop loop, run a loop for each element of an array |
|
00:13:00 |
|
9.11 Function, call function |
|
00:06:00 |
|
9.12 Function Parameter, multiple parameter, function return |
|
00:11:00 |
|
9.13 Comment, multiple lines comment |
|
00:04:00 |
|
9.14 Object, key value pair, get object property, set value |
|
00:12:00 |
|
9.15 Basic Javascript overview, Module Summary |
|
00:04:00 |
| 10 Javascript coding problems, Simple Interview Question |
|
10.1 Module Introduction, problem setup |
|
00:03:00 |
|
10.2 Swap variable, swap without temp, destructing |
|
00:11:00 |
|
10.3 Random number, random number between 1 to 6 |
|
00:11:00 |
|
10.4 Find max of two values, find max of three values |
|
00:09:00 |
|
10.5 Find the largest element of an array |
|
00:08:00 |
|
10.6 Sum of all numbers in an array |
|
00:09:00 |
|
10.7 Remove duplicate item from an array |
|
00:09:00 |
|
10.8 Count the number of words in a string |
|
00:10:00 |
|
10.9 Reverse a string |
|
00:07:00 |
|
10.10 Module summary |
|
00:05:00 |
| 11 Serious Web Developer Productivity, Efficiency, Tips & Tricks |
|
11.1 typing practice, typing lesson, typing test |
|
00:03:00 |
|
11.2 developer question answer, Stack Overflow, weekly newsletter |
|
00:08:00 |
|
11.3 Emmet, magic to write large amount HTML and CSS |
|
00:09:00 |
|
11.4 Live server, automatic reload of the website after save |
|
00:06:00 |
|
11.5 VSCode extension, JavaScript code snippet, ES linter |
|
00:05:00 |
|
11.6 Visual Studio Code shortcut key, settings change |
|
00:07:00 |
|
11.7 Module Summary, keep updated about skills |
|
00:03:00 |
| 12 Pioneer Bank, develop a simple bank website |
|
12.1 Project overview, Transaction and balance update |
|
00:02:00 |
|
12.2 Project Setup, github integration, bootstrap text align |
|
00:09:00 |
|
12.3 Login window, input field, password text field, form control |
|
00:09:00 |
|
12.4 Get HTML elements by tag, class or Id, Add Event Listener |
|
00:13:00 |
|
12.5 CSS styles in Javascript, Dynamically hide an element |
|
00:08:00 |
|
12.6 Dynamically display a hidden element using Javascript |
|
00:06:00 |
|
12.7 Deposit, Withdraw, Balance area, add column margin |
|
00:10:00 |
|
12.8 Submit transaction, placeholder help text for input |
|
00:07:00 |
|
12.9 Deposit button event handler, capture deposit amount |
|
00:07:00 |
|
12.10 Get innerText using Javascript, update text dynamically |
|
00:08:00 |
|
12.11 Update two fields at the same time, create function |
|
00:11:00 |
|
12.12 Money withdraw event handler, cleaner code with function |
|
00:11:00 |
|
12.13 Update withdraw amount, Reduce balance for withdraw |
|
00:05:00 |
|
12.14 Module summary and overall project overview |
|
00:08:00 |
| 13 Shopping Cart, Develop an interactive shopping Cart |
|
13.1 Shopping Cart, Develop an interactive shopping Cart |
|
00:08:00 |
| 14 Modern JavaScript, ES6, S2015, ECMASCRIPT 2015 |
|
14.1 Module overview, ES6, github integration setup |
|
00:06:00 |
|
14.2 Let, const, array declared with const, object declared with const |
|
00:11:00 |
|
14.3 Function default parameter for not provided values |
|
00:05:00 |
|
14.4 Template String, multiple line string |
|
00:08:00 |
|
14.5 Arrow function, multiple parameter, function body |
|
00:10:00 |
|
14.6 Spread operator, concatenate multiple arrays, array max |
|
00:10:00 |
|
14.7 Class, constructor, create object from class |
|
00:10:00 |
|
14.8 Inheritance, extends class, super, class method |
|
00:09:00 |
|
14.9 ES6 Module summary |
|
00:05:00 |
| 15 Advanced JavaScript, Javascript Interview Questions |
|
15.1 Module Overview, git integration setup |
|
00:04:00 |
|
15.2 Truthy and Falsy values |
|
00:11:00 |
|
15.3 Null Vs Undefined, different ways you will get undefined |
|
00:10:00 |
|
15.4 == vs ===, implicit conversion |
|
00:00:00 |
|
15.5 map, filter, find, smart way to run for loop |
|
00:15:00 |
|
15.6 Apply map, filter, find on an array of objects |
|
00:07:00 |
|
15.7 Arguments, array like objects, log all array elements |
|
00:07:00 |
|
15.8 Scope, block scope, access outer scope variable |
|
00:13:00 |
|
15.9 Closure, encapsulation, private variable |
|
00:09:00 |
|
15.10 Array slice, splice, array join elements |
|
00:09:00 |
|
15.11 Module Summary and overview |
|
00:08:00 |
| 16 API JSON, Server, Data load, dynamic website, http |
|
16.1 Module overview, what you will learn from this module |
|
00:02:00 |
|
16.2 How internet works, DNS server, hosting server, database |
|
00:07:00 |
|
16.3 What is an API, the purpose of API, GET, POST |
|
00:06:00 |
|
16.4 JSON, JSON Structure, parse, stringify, JSON properties |
|
00:10:00 |
|
16.5 Load Data, JSON placeholder, GET data, display data on UI |
|
00:13:00 |
|
16.6 HTTP request, Status code, network tab, bad API |
|
00:11:00 |
|
16.7 Send data to the server, HTTP POST Method, GET Vs POST |
|
00:04:00 |
|
16.8 Send data to server, HTTP Post, JSON Stringify |
|
00:11:00 |
|
16.9 JQuery ajax, JQuery get, JQuery post |
|
00:04:00 |
|
16.10 Module Summary, API, Server Overview |
|
00:03:00 |
| 17 How Browser Works, browser api and methods |
|
17.1 Module Overview, ContentEditable, live edit |
|
00:03:00 |
|
17.2 How Browser works, DOM tree, Render Tree |
|
00:08:00 |
|
17.3 Website alert, confirmation, prompt to collect data |
|
00:07:00 |
|
17.4 URL, URL parts, query string, hash, subdomain |
|
00:07:00 |
|
17.5 document location, access href, hash, assign |
|
00:05:00 |
|
17.6 history api, back, forward, go, history length |
|
00:05:00 |
|
17.7 cookies, dev tool application tab, cookies at server |
|
00:07:00 |
|
17.8 local storage, session storage, edit storage information |
|
00:09:00 |
|
17.9 Browser clear cache, chrome extension, web store, restart |
|
00:07:00 |
|
17.10 Browser Overview, Module Summary |
|
00:03:00 |
| 18 Modern web developer workflow, command line tools |
|
18.1 Module workflow, command line tools |
|
00:02:00 |
|
18.2 command line tool, terminal, cmd, VS Code terminal |
|
00:05:00 |
|
18.3 change directory, list all directory, open project in Code |
|
00:07:00 |
|
18.4 create a file, make directory, move file, move upward |
|
00:07:00 |
|
18.5 dependency management, package JSON, npm init |
|
00:10:00 |
|
18.6 npm install, git ignore, use package under node modules |
|
00:13:00 |
|
18.7 global packages, local packages, develop only, npm script |
|
00:06:00 |
| 19 JavaScript debug, web debug, dev tool mastering |
|
19.1 Module overview, salary app overview, git clone issues |
|
00:05:00 |
|
19.2 dev tool element tab, edit HTML, get style, device tab |
|
00:13:00 |
|
19.3 edit CSS style live, hover class, CSS box model, event handler |
|
00:14:00 |
|
19.4 sources tab, break point, call stack, console table |
|
00:14:00 |
|
19.5 console tab, preserve log, error log, console api |
|
00:08:00 |
|
19.6 network tab, request method, header, response type |
|
00:05:00 |
|
19.7 Performance tab, memory tab, Audit, application tab |
|
00:05:00 |
|
19.8 Module Summary, Deb tool debug Overview |
|
00:04:00 |
| 20 Modern Front-end application core concepts |
|
20.1 Module overview and modern application core parts |
|
00:02:00 |
|
20.2 Web component, 4 types of component, identify component |
|
00:00:00 |
|
20.3 Template, dynamically create HTML elements based on data |
|
00:16:00 |
|
20.4 Single Page Application (SPA), Performance benefit |
|
00:07:00 |
|
20.5 Routing, Route parameter, Routing in Angular |
|
00:06:00 |
|
20.6 Website state, state management, purpose of state |
|
00:06:00 |
|
20.7 Charting framework, d3js, nvd3, chartjs |
|
00:08:00 |
|
20.8 Simple Angular Application, angular cli, routing |
|
00:15:00 |
|
20.9 Module Summary |
|
00:04:00 |
| 21 Fullstack web development Node, mongodb, hosting |
|
21.1 This module will be published on Feb 28, 2020 |
|
00:00:00 |
| 22 React Fundamental, JSX, Component, props, state, lifecycle |
|
22.1 This module will be published on Feb 28, 2020 |
|
00:00:00 |
| 23 React SPA, Components interactions, state management, API |
|
23.1 This module will be published on Feb 28, 2020 |
|
00:00:00 |
| 24 React Complete app, Routing, oAuth, Payment, deploy |
|
24.1 This module will be published on Feb 28, 2020 |
|
00:00:00 |
| 25 React homework 1 (Hot Onion- a complete Restaurant website) |
|
25.1 This module will be published on March 3, 2020 |
|
00:00:00 |
| 26 React homework 2 (Ulta Care- a Hospital management website) |
|
26.1 This module will be published on March 3, 2020 |
|
00:00:00 |
| 27 React homework 3 (Athlete Buddy- a fitness club website) |
|
27.1 This module will be published on March 3, 2020 |
|
00:00:00 |
| 28 Advanced React, Redux, React Native, Unit Test overview |
|
28.1 This module will be published on March 3, 2020 |
|
00:00:00 |
| 29 Interview tips and tricks, Resume, LinkedIn, Networking |
|
29.1 This module will be published on March 3, 2020 |
|
00:00:00 |
| 30 Certificate, Next Steps, Final Remarks |
|
30.1 This module will be published on March 3, 2020 |
|
00:00:00 |
| 31 [Bonus] D3, Chart, Chartjs |
|
31.1 This module will be published on March 3, 2020 |
|
00:00:00 |
| 32 [Bonus] Random topics Requested by you |
|
32.1 This module will be published on March 3, 2020 |
|
00:00:00 |
| 33 [Secret Small Group] Super Charged Intervieee wClub(SCIC) |
|
33.1 This module will be published on March 3, 2020 |
|
00:00:00 |
