Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/monciego/mastering-javascript
Explore JavaScript fundamentals and more with example code.
https://github.com/monciego/mastering-javascript
javacript javascript-fudamentals learn-javascript vanilla-javascript
Last synced: about 5 hours ago
JSON representation
Explore JavaScript fundamentals and more with example code.
- Host: GitHub
- URL: https://github.com/monciego/mastering-javascript
- Owner: monciego
- License: mit
- Created: 2021-12-11T06:13:24.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2023-09-24T05:03:29.000Z (about 1 year ago)
- Last Synced: 2023-09-24T12:40:06.627Z (about 1 year ago)
- Topics: javacript, javascript-fudamentals, learn-javascript, vanilla-javascript
- Language: JavaScript
- Homepage:
- Size: 109 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.MD
- License: LICENSE
Awesome Lists containing this project
README
# **Mastering JavaScript**
Welcome to my "Mastering JavaScript" repository! This collection of topics and exercises is designed to help you learn and master the fundamentals of JavaScript.
Explore the various sections below to deepen your understanding of JavaScript's key concepts:
## Fundamentals
Covering essential JavaScript topics from variables and data types to conditional statements and loops.
## Connecting the Dots
Building on the fundamentals, these sections connect the dots and delve into more advanced concepts like string manipulation, array methods, and working with the DOM.
## DOM (Document Object Model)
Uncover the power of JavaScript in the web browser by learning how to manipulate HTML and interact with users through the Document Object Model.
Each topic includes code examples to illustrate key concepts and practices. Feel free to explore, learn, and use these resources to enhance your JavaScript skills.
Happy coding!
### [Fundamentals](https://github.com/monciego/mastering-javascript/tree/main/fundamentals)
| # | Topic | Code |
| :-- | :-------------------------------- | :--------------------------------------------------------------------------------------------------------------- |
| 00 | Inline | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/00-inline) |
| 01 | Internal | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/01-internal) |
| 02 | External | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/02-external) |
| 03 | Helper Methods | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/03-helper-methods) |
| 04 | Variables | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/04-variables) |
| 05 | Variable Naming Rules | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/05-variable-naming-rules) |
| 06 | Javascript Keywords | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/06-javascript-keywords) |
| 07 | let, const, var | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/07-let-const-var) |
| 08 | String Concatenation | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/08-string-concatenation) |
| 09 | Number Basics | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/09-number-basics) |
| 10 | Numbers - Additional Features | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/10-more-numbers) |
| 11 | Implicit Type Conversion | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/11-implicit-type-conversion) |
| 12 | Data Types | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/12-data-types) |
| 13 | Arrays | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/13-arrays) |
| 14 | Functions - Declare, Invoke | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/14-functions-declare-invoke) |
| 15 | Functions - Parameters, Arguments | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/15-functions-parameters-arguments) |
| 16 | Functions - Return | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/16-functions-return) |
| 17 | Functions - Expressions | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/17-functions-expression) |
| 18 | Arrow Functions | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/18-arrow-functions) |
| 19 | Hoisting | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/19-hoisting) |
| 20 | Objects | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/20-objects) |
| 21 | Conditional Statements | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/21-conditional-statements) |
| 22 | if, else, else if | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/22-if-else-elseif) |
| 23 | Equality | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/23-equality) |
| 24 | Logical Operators | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/24-logical-operators) |
| 25 | Switch Statement | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/25-switch-statement) |
| 26 | While Loops | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/26-while-loop) |
| 27 | Do While Loops | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/27-do-while-loop) |
| 28 | For Loop | [>](https://github.com/monciego/mastering-javascript/tree/main/fundamentals/28-for-loop) |
### [Connecting the dots](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots)
| # | Topic | Code |
| :-- | :----------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------------- |
| 29 | String Properties And Methods | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/29-string-properties-and-methods) |
| 30 | Template Literals | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/30-template-literals) |
| 31 | Array Properties And Methods | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/31-array-properties-and-methods) |
| 32 | Array and for loop - Exercise | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/32-array-and-forloop-exercise) |
| 33 | Calculate - Exercise | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/33-calculate-exercise) |
| 34 | Value Vs. Reference | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/34-value-vs-reference) |
| 35 | Null And Undefined | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/35-null-and-undefined) |
| 36 | Truthy And Falsy | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/36-truthy-and-falsy) |
| 37 | Ternary Operator | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/37-ternary-operator) |
| 38 | Global Scope | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/38-global-scope) |
| 39 | Local Scope | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/39-local-scope) |
| 40 | Variable Lookup | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/40-variable-lookup) |
| 41 | Callback Functions, Higher Order Functions | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/41-callback-functions-and-high-order-functions) |
| 42 | Array Iterators | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/42-array-iterators) |
| 43 | For Each | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/43-forEach) |
| 44 | Map | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/44-map) |
| 45 | Filter | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/45-filter) |
| 46 | Find | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/46-find) |
| 47 | Reduce | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/47-reduce) |
| 48 | Math Object | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/48-math-object) |
| 49 | Date Object | [>](https://github.com/monciego/mastering-javascript/tree/main/connecting-the-dots/49-date-object) |
### [DOM](https://github.com/monciego/mastering-javascript/tree/main/dom)
| # | Topic | Code |
| :-- | :------------------------------------------- | :---------------------------------------------------------------------------------------------------------------- |
| 50 | DOM - General Concepts | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/50-dom-general-concepts) |
| 51 | Window And Document Overview | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/51-window-and-document) |
| 52 | GetElementById | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/52-getElementById) |
| 53 | Get Elements By Tag Name | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/53-getElementByTagName) |
| 54 | Get Elements By Class Name | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/54-getElementByClassName) |
| 55 | QuerySelector And QuerySelectorAll | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/55-querySelector-querySelectorAll) |
| 56 | Navigate The Dom - Children | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/56-children) |
| 57 | Navigate The Dom - Parent Element | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/57-parent-element) |
| 58 | Navigate The Dom - NextSibling, PrevSibling | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/58-nextSibling-prevSibling) |
| 59 | Navigate The Dom - Next/Prev Element Sibling | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/59-nextElementSibling-prevElementSibling) |
| 60 | TextContent And NodeValue | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/60-textContent-nodeValue) |
| 61 | GetAttribute(), SetAttribute() | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/61-getAttribute-setAttribute) |
| 62 | ClassList And ClassName | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/62-classList-className) |
| 63 | CreateElement | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/63-createElement-createTextNode-appendChild) |
| 64 | InsertBefore | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/64-insertBefore) |
| 65 | ReplaceChild | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/65-replace-child) |
| 66 | Prepend InnerText | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/66-prepend-innerText) |
| 67 | Remove And RemoveChild | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/67-remove-removeChild) |
| 68 | InnerHTML And TextContent | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/68-innerHTML-textContent) |
| 69 | Change CSS With Style Property | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/69-changing-css) |
| 70 | Click Event | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/70-click-event) |
| 71 | Function Reference | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/71-function-reference) |
| 72 | Mouse Events | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/72-mouse-events) |
| 73 | Key Events | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/73-key-events) |
| 74 | Event Object | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/74-event-object) |
| 75 | CurrentTarget Vs Target | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/75-currentTarget-target) |
| 76 | Event Bubbling Capturing | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/76-event-bubbling-and-capturing) |
| 77 | Event Propogation Example | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/77-event-propogation-example) |
| 78 | Form Submit | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/78-form-submit) |
| 79 | Local Storage | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/79-local-storage) |
| 80 | Local Storage With Multiple Values | [>](https://github.com/monciego/mastering-javascript/tree/main/dom/80-local-storage-with-mulitple-values) |
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
## Contributing
**Interested in contributing?**
Please read our [Contributing Guide](CONTRIBUTING.md) to get started.
## Acknowledgment
The code examples and topics covered in this repository are directly sourced from the tutorials and content created by [Coding Addict](https://www.youtube.com/c/CodingAddict) (John Smilga) on YouTube. We acknowledge and thank John Smilga for his exceptional tutorials, which form the foundation of this project.