GitHub Workshop Notes

Commands Cheatsheet

1. git init: Initialize / create a new local repository. (Do this only once)
2. git remote add origin [url without brackets]: Connect your local repo to an online repo. (Do this only once)
3. git add .: Add all files to staging area.
4. git commit -m "first commit": Save the changes with a message.
5. git push origin master: Upload changes to the master branch of your remote repository.
6. git pull origin master: Download and merge changes from the remote repo to your working repo.

Optional Commands

1. git status: List the files you've changed and those you still need to add or commit.
2. git log: Shows commit history.

More Commands

Resources

• Slides
• Getting-Started - YouTube
• Interactive GitHub Tutorial
• Udacity Course - 3 weeks certification

---

JavaScript Workshop Notes

JavaScript Courses

• LearnCode Academy *Highly Recommended

• The New Boston

• Mozilla JS docs

• W3C JS docs

---

DOM - Document Object Model

Basics - window

window.location - Redirect

window.location.href = "https://github.com/dhruvdutt";

window.location - New Tab

window.open("https://github.com/dhruvdutt");

---

Basics - document selectors

getElementById: get by ID

document.getElementById("element-id"); // returns matched element

getElementsByClassName: get by ID

document.getElementsByClassName("element-class"); // returns array of matched elements

createElement: create new element

document.createElement("p");

Examples:

Add element in body

 // create a couple of elements in an otherwise empty HTML page
let heading = document.createElement("h1");
let heading_text = document.createTextNode("Big Head!");
heading.appendChild(heading_text);
document.body.appendChild(heading);

onclick attribute

click listener

element.addEventListener("click", function() {
    console.log("Listener func called");
});

keyDown listener

key codes

<input type="text" id="inp" size="50" onkeydown="keyCode(event)"></input> 

<script>
function keyCode(event) {
    var x = event.keyCode;
    if (x == 27) {
      document.getElementById("inp").value = "";
    }
}
</script>

CSS border example

Timeout: run after x seconds

setTimeout(function() {
  console.log("Will log after 3 seconds");
}, 3000);

Interval: run every x seconds

setInterval(function() {
  console.log("Will log every 3 seconds");
}, 3000);

onkeydown

<p>Enter mobile number:</p>
<input type="number" onkeydown="checkNumber(this.value)">

<script>
function checkNumber(number) {
    console.log(number);
}
</script>

API call fetch

<script>
let URL = "https://cors.io/?http://www.mocky.io/v2/5a7f23442e00005000b56873";

fetch(URL)
  .then(response => response.json())
  .then(response => {
    console.log(response);
  })
  .catch(error => {
    console.log(error);
  })
</script>