JavaScript DOM

Git.md

@@ -0,0 +1,37 @@
+<img src="https://github.com/Vishal-raj-1/Frontend-Development-Essentials/blob/main/Assets/Icons/git.png" width="200px" />
+
+# Git CheatSheet
+
+
+| Command                                                  | Explanation                                        |
+| ---------------------------------------------------------| -------------------------------------------------- |
+| `git config`                                             | Configure Git settings.                            |
+| `git config --global user.name "Your Name"`              | Set your name for Git.                       |
+| `git config --global user.email "[email protected]"` | Set your email for Git.                  |
+| `git config --global color.ui true`                      | Enable color output.                               |
+| `git init`                                               | Initialize a new Git repository.                   |
+| `git clone <repository url>`                             | Clone an existing repository to your local machine.[either using https or SSH(when you have linked github with your computer using SSH keys) link]                 |
+| `git status`                                             | Show the status of your working directory and staging area.|
+| `git add <file>`                                         | Add a file to the staging area.                     |
+| `git commit -m "Commit message"`                         | Commit changes in the staging area with a message.  |
+| `git branch`                                             | Show a list of all branches in the repository.[your current working branch will be green coloured with * mark before it]      |
+| `git branch <branch name>`                               | Create a new branch with the given name.            |
+| `git checkout <branch name>`                             | Switch to the branch with the given name.           |
+| `git merge <branch name>`                                | Merge changes from the specified branch into the current branch.|
+| `git remote -v`                                          | Show a list of all remote repositories.             |
+| `git remote add <remote name> <remote url>`              | Add a new remote repository.                  |
+| `git push <remote name> <branch name>`                   | Push changes to the remote repository.              |
+| `git pull <remote name> <branch name>`                   | Pull changes from the remote repository.            |
+| `git log`                                                | Show a log of all commits in the repository.        |
+| `git diff`                                               | Show a diff of all changes made since the last commit.|
+| `git stash`                                              | Temporarily save changes without committing them.   |
+| `git reset`                                              | Unstage changes in the staging area.                |
+| `git revert <commit hash>`                               | Undo changes made in a specific commit.             |
+
+# Learn More about Github from here:
+
+<div align="center">
+  <a href="https://youtu.be/ng_3YZHnz8U" >
+    <img src="http://img.youtube.com/vi/ng_3YZHnz8U/0.jpg" alt="Git & GitHub Crash Course" />
+  </a>
+</div>

javascriptDOM.md

@@ -0,0 +1,94 @@
+<img src="https://github.com/Vishal-raj-1/Frontend-Development-Essentials/blob/main/Assets/Icons/js.png" width="200px" />
+
+# JavaScript DOM Cheatsheet
+
+### What is DOM?
+
+The Document Object Model (DOM) is a programming interface for HTML documents. It represents the page so that programs can change the document structure, style, and content.
+
+## DOM Methods to find HTML elements:
+
+### Get Element by Id
+
+Returns the element that has the ID attribute with the specified value.
+
+```jsx
+let element = document.getElementById("myElement");
+```
+
+### Get Elements By Class Name
+
+Returns a collection of all elements in the document with the specified class name.
+
+```jsx
+let elements = document.getElementsByClassName("myClass");
+```
+
+### Get Elements By Tag Name
+
+Returns a collection of all elements in the document with the specified tag name.
+
+```jsx
+let elements = document.getElementsByTagName("p");
+```
+
+### Query Selector All
+
+Returns all elements that matches a specified CSS selector(s) in the document
+
+```jsx
+let elements = document.querySelectorAll(".myClass");
+```
+
+### InnerHTML
+
+Gets or sets the HTML content within an element.
+
+```jsx
+element.innerHTML = "<p>New HTML content</p>";
+```
+
+### InnerText
+
+Gets or sets the text content within an element.
+
+```jsx
+element.innerText = "New text content";
+```
+
+### Add Class
+
+Adds one or more class names to an element.
+
+```jsx
+element.classList.add("newClass");
+```
+
+### Remove Class
+
+Removes one or more class names from an element.
+
+```jsx
+element.classList.remove("oldClass");
+```
+
+### Add Event Listener
+
+Attaches an event handler to the specified element.
+
+```jsx
+const myButton = document.getElementById("myButton");
+
+myButton.addEventListener("click", function() {
+  console.log("Button clicked!");
+});
+```
+
+
+# Learn More about JavaScript DOM from here:
+
+<div align="center">
+  <a href="https://youtu.be/85jzHRTVdsc" >
+    <img src="http://img.youtube.com/vi/85jzHRTVdsc/0.jpg" alt="JavaScript DOM Manipulation Crash Course" />
+  </a>
+</div>