01 Project Preview

Build an Online Paint Website

Course Overview

Mammoth Interactive Courses Introduction

00b (Prerequisite) Introduction to HTML

01. Course Requirements (2:55)
02. What Is Jsbin (3:15)
03. Setting Up The Html Document (2:41)
04. Header Tags And Paragraphs Tags (4:06)
05. Styles (3:32)
06. Bold Underline And Italic Tags (3:10)
07. Adding In A Link (1:38)
08. Adding In A Image (3:00)
09. Adding A Link To An Image (1:54)
10. Lists (4:03)
11. Tables (3:29)
12. Different Kinds Of Input (4:59)
13. Adding In A Submit Button (3:01)
14. Scripts And Style Tags (3:27)

00c (Prerequisite) Introduction to CSS

01. Course Requirements (3:41)
02. Html Styles Crash Course (4:45)
03. Adding Code To The CSS (4:46)
04. Adding In IDs To The CSS (5:16)
05. Classes In CSS (2:39)
06. Font Families (5:04)
07. Colors In CSS (5:44)
08. Padding In CSS (3:06)
09. Text Align And Transforms (3:14)
10. Margins And Width (5:33)
11. Changing The Body (4:11)
12. Latin Text Generator (1:57)
13. Adding In A Horizontal Menu With HTML And CSS (7:53)
14. Adding A Background Image (4:04)
15. Playing Around With Margins In CSS (2:20)

00d (Prerequisite) Intro to Javascript

00d-2 Variables and Data Types

02 01 What Will We Learn In This Section (0:44)
02 02 Variables (10:21)
02 03 Data Types (5:41)
02 04 Variable Mutation (6:53)
02 05 Type Coercion (6:52)
02 06 Coding Challenge (1:36)
02 07 Coding Challenge Solution (2:43)
02 08 Section Summary (0:46)
Source Files

00d-3 Operators

03 01 What Will We Learn In This Section (0:35)
03 02 Basic Operators (15:32)
03 03 Operator Precedence (5:41)
03 04 Coding Challenge (2:11)
03 05 Coding Challenge Solution (5:52)
03 06 Section Summary (0:56)
Source Files

00d-4 Conditional Statements

04 01 What Will We Learn In This Section (0:36)
04 02 If Else Statements (11:43)
04 03 Boolean Logic (7:57)
04 04 Switch Statements (10:54)
04 05 Truthy And Falsie Values (6:03)
04 06 Equality Operators (4:38)
04 07 Coding Challenge (2:25)
04 08 Coding Challenge Solution (4:54)
04 09 Section Summary (1:07)
Source Files

00d-5 Functions and Arrays

05 01 What Will We Learn In This Section (0:37)
05 02 Functions (9:46)
05 03 Function Statements And Expressions (7:37)
05 04 Arrays (10:09)
05 05 Coding Challenge (3:49)
05 06 Section Summary (1:26)
Source Files

00d-6 Objects

06 01 What Will We Learn In This Section (0:38)
06 02 Objects And Properties (9:49)
06 03 Objects And Methods (12:25)
06 04 Objects Vs Primitives (16:17)
06 05 Coding Challenge (0:51)
06 06 Coding Challenge Solution (5:13)
06 07 Section Summary (0:42)
Source Files

00d-7 Loops

07 01 What Will We Learn In This Section (0:34)
07 02 Loops (15:03)
07 03 Iteration (12:35)
07 04 Coding Challenge (1:01)
07 05 Coding Challenge Solution (6:32)
07 06 Section Summary (0:45)
Source Files

00d-8 JavaScript Execution

08 01 What Will We Learn In This Section (0:52)
08 02 Javasript Parsers And Engines (5:19)
08 03 Execution Contexts And Execution Stack (2:26)
08 04 Creation And Execution Phases (6:23)
08 05 Hoisting (2:13)
08 06 Scoping (4:52)
08 07 Scope Chain (3:20)
08 08 This Keyword (4:16)
08 09 Coding Challenge (0:46)
08 10 Coding Challenge Solution (3:21)
08 11 Section Summary (0:47)
Source Files

01 Build the User Interface

01 Set Up The Project (4:36)
02 Build A Toolbar (8:21)
03 Import Bootstrap Icons (9:28)
04 Build A Canvas (8:11)
Source Files

02 Build Toolbar Functionality

01 Build Main Javascript Files (7:03)
02 Build Tool Controls (8:37)
03 Launch A Server (7:53)
03A Install Http Server (5:59)
03B Disable Cache (6:35)
04 Load An Image From User's Computer (7:40)
04A Where To Find Images (1:19)
05 Put Image Onto Canvas (13:55)
06 Resize Canvas To Fit Image (6:44)
07 Save Image (9:53)
08 Undo An Action (11:16)
09 Redo An Action (7:05)
Source Files

03 Build Drawing Functionality

01 Enable Freehand Drawing Tool (3:44)
02 Listen For Mouse Down (11:32)
03 Listen For Mouse Move (8:28)
04 Listen For Mouse Release (9:54)
05 Highlight Selected Tool (7:30)
Source Files

04 Build Shape Tools

01 Draw A Line (15:54)
02 Create A Temporary Canvas (12:50)
03 Draw A Rectangle (13:27)
04 Draw A Filled Rectangle (9:15)
05 Draw A Circle (16:18)
06 Draw A Filled Circle (6:51)
Source Files

05 Build Color Pickers

01 Build A Stroke Color Picker (7:28)
02 Get User Input Of Stroke Color (7:43)
03 Build A Fill Color Picker (5:37)
04 Get User Input Of Fill Color (10:03)
Source Files

06 Build a Text Tool