In this repository I shared my learning and code about Javascript. This is the complete javascript course with advanced topics. The course is by Jonas Schmedtmann which is available on Udemy. Course contains 15 important sections. An overview of sections and what I learnt in that is as follows.
Section contains basic Javascript
- Hello world
- Values and Variables
- Data Types
- let, const and var
- Basic Operators
- Operator Precedence
- Coding Challenge 01
- Strings and Template Literals
- If_else Statements
- Coding Challenge 02
- Type Conversion and Coercion
- Truthy and Falsy Values
- Equality Operators
- Boolean Logic
- Logical Operators
- Coding Challenge 03
- The Switch Statement
- Statements and Expressions
- The Conditional (Ternary) Operator
- Coding Challenge 04
Section contains basic Javascript
- Strict Mode
- Functions
- Function Declaration vs. Expression
- Arrow Functions
- Functions Calling Other Functions
- Reviewing Functions
- Coding Challenge 01
- Introduction to Arrays
- Array Methods
- Coding Challenge 02
- Introduction to Objects
- Dot vs. and Bracket Notation
- Object Methods
- Coding Challenge 03
- Iteration_The For Loop
- Break and Continue
- Looping Backwards & Loops in Loop
- The While Loop
- Coding Challenge 04
Section contains Skills required as a developer and Editor setup
- Setting up Prettier and VS Code
- Installing Node.js
- Setting up Dev Environment
- Using Google, StackOverflow and MDN
- Debugging (Fixing Errors)
- Debugging with the Console and Breakpoint
- Coding Challenge 01
Section Contains about how javascript works on Browser and DOM and Basics Events Fundamentals. Created 3 simple projects as follows
PROJECT 01_ Guess My Number
- DOM and DOM Manipulation
- Selecting and Manipulating Elements
- Handling Click Events
- Implementing the Game Logic
- Manipulating CSS Style
- Coding Challenge 01
- Implementing Highscores
- Refactoring Code_The DRY Principle
PROJECT 02_ Modal Window
- Working with Classes
- Handling an_Esc_Keyprerss Event
PROJECt 03_ Pig Game
- Rolling the Dice
- Switching the Active Player
- Holding Current Score
- Resetting the Game
Section contains all about overview on how actually Javascript works behind the scenes
- An High-Level Overview of JavaScript
- The JavaScript Engine and Runtime
- Execution Contexts and The Call Stack
- Scope and The Scope Chain
- Scoping in Practice
- Variable Environment Hoisting and The TDZ (Temporal DeadZone)
- Hoisting and TDZ in Practice
- The this Keyword
- The this Keyword in Practice
- Regular Functions vs. Arrow Functions
- Primitive vs. Objects (Primitive vs. Reference Types
- Primitives vs. Objects in Practice
Section contains Data Structure used in Javascript. An indepth overview on how modern operators and string works in practice
- Destructuring Arrays
- Destructuring Objects
- Spread operator (...)
- Rest Patterns and Parameters
- Short Circuiting
- The Nullish Coalescing Operator
- Coding Challenge 01
- Looping Arrays_The for-Of Loop
- Enhanced Object Literals
- Optional chaining
- Looping Objects_Object Keys, Values and Entries
- Coding Challenge 02
- Sets
- Maps_Fundamentals
- Maps_Iteration
- summary_Which Data Structures Use
- Coding Challenge 03
- Working with Strings part 1
- Working with Strings part 2
- Working with Strings part 3
- Coding Challenge 04
- String Methods Practice
Section contains all about Functions and Function methods in deep
- Default Parameters
- How Passing Arguments Works_Values vs. Reference
- First-Class and Higher-Order Functions
- Functions Accepting Callback Functions
- Functions Returning Functions
- The call and apply Methods
- The bind Method
- Coding Challenge 01
- Immediately Invoked Function Expressions (IIFE)
- Closures
- More Closure Examples
- Coding Challenge 02
Section contains all about Arrays in Javascript. Created a project called Array Bankist
- Simple Array Methods
- Looping Arrays-forEach
- forEach with Maps and Sets
PROJECT_ Bankist (Fake "log in" with user js and PIN 1111)
- Creating DOM Elements
- Coding Challenge 01
- Data Transformations_map, filter, reduce
- The map Method
- The filter Method
- The reduce Method
- Coding Challenge 02
- The Magic of Chaining Methods
- Coding Challenge 03
- The find Method
- Implementing Login
- Implementing Transfers
- The findIndex Method
- some and every
- flat and flatMap
- Sorting Arrays
- More Ways of Creating and Filling Arrays
- Summary
- Array Methods Practice
- Coding Challenge 04
Section contains advanced properties like numbers, dates, timers and etc.
- Converting and Checking Numbers
- Math and Rounding
- The Remainder Operator
- Working with BigInt
- Creating Dates
- Adding Dates to Bankist_App
- Operations with Dates
- Internationalizing Dates (Intl)
- Internationalizing Numbers (Intl)
- Timers_setTimeOut and setInterval
- Implementing a Countdown Timer in Bankist App
Section contains brief information about DOM in advance and Events. Created a Bankist website with it
PROJECT_ Bankist Site
- How the DOM Really Works
- Selecting, Creating and Deleting Elements
- Styles, Attributes and Classes
- Implementing Smooth Scrolling
- Types of Events and Event Handlers
- Event Propagation_Bubbling and Capturing
- Event Propagation in Practice
- Event Delegation
- DOM Traversing
- Building a Tabbed Component
- Passing Arguments to Event Handlers
- Implementing a Sticky Navigation
- Intersection Observer API
- Revealing Elements on Scroll
- Lazy Loading Images
- Building a Slider Component
- Lifecycle DOM Events
- Efficient Script Loading defer and async
Overview:
- What is OOP
- OOP in JavaScript
- Constructor Functions and the new Operator
- Prototypes
- Prototypal Inheritence and The Prototype Chain
- Prototypal Inheritence on Built in objects
- Coding Challenge 01
- ES6 Classes
- Setters and Getters
- Static Methods
- object.create
- Coding Challenge 02
- Inheritance between Classes_Constructor Function
- Inheritance between Classes_ES6 Classes
- Inheritance between Classes_Object.create
- Another Class Examples
- Encapsulation_Protected Properties and Methods
- Chaining Methods
- ES6 Classes Summary
- Coding Challenge 04
Section contains advanced topics like Geolocation, External libraries and lot more. Created a real world project called Mapty App
PROJECT_ Mapty
- How to Plan a Web Project
- Using the Geolocation API
- Displaying a Map Using Leaflet Library
- Displaying a Map Marker
- Rendering Workout Input Form
- Project Architecture
- Refactoring for Project Architecture
- Managing Workout Data_Creating Classes
- Creating a New Workout
- Rendering Workouts
- Move to Marker On Click
- Working with localStorage
Section contains an hight level overview of Asynchronous JavaScript. Promises, Async-Await and AJAX
- Asynchronous Javascript, AJAX an APIs
- First AJAX Call_XMLHttpRequest
- How the Web Works
- CallBack Hell
- Promises and the Fetch API
- Consuming Promises
- Chaining Promises
- Handling Rejected Promises
- Throwing Errors Manually
- Coding Challenge 01
- Asynchronous Behind the Scenes_The Event Loop
- The Event Loop in Practice
- Building a Simple Promise
- Promisifying the Geolocation API
- Coding Challenge 02
- Consuming Promises with Async_Await
- Error Handling with try...catch
- Returning Values from Async Functions
- Running Promises in Parallel
- Other Promise Combinators_race, allSettled and any
- Coding Challenge 03
Section contains an high level overview of modern Javascript development. Using Mudules, Tooling and Functional
- An Overview of Modern JavaScript Development
- An Overview of Modules in JavaScript
- Importing and Exporting in ES6 Modules
- The Module Pattern
- Common JS Modules
- Bundling with Parcel and NPM Scripts
- Configuring Babel and Polyfilling
- Review_Writing Clean and Modern JavaScript
- Fix Some Bad Code_Part 1
- Declarative and Functional JavaScript Principles
- Let's Fix Some Bad Code_Part 2
Section contains a project called Forkify App. It's a Modern Application created with all the advanced topics which I learnt in this Course
PROJECT_ forkify
- Project Overview and Planning (I)
- Loading a Recipe from API
- Rendering the Recipe
- Listening For load and hashchange Events
- The MVC Architecture
- Refactoring for MVC
- Helpers and Configuration Files
- Event Handlers in MVC
- Implementing Error and Success Messages
- Implementing Search and Results
- Implementing Pagination
- Project Planning (II)
- Updating Recipe servings
- Developing a DOM Updating Algorithm
- Implementing Bookmarks
- Storing Bookmarks with localStorage
- Project Planning (III)
- Uploading a New Recipe
- Wrapping Up_Final Considerations