From 44718f1fe1d818ada9e342acd3c204319e71e9ca Mon Sep 17 00:00:00 2001
From: Neil Chauhan <31568159+neilchauhan2@users.noreply.github.com>
Date: Mon, 22 Oct 2018 20:20:13 +0530
Subject: [PATCH 1/2] Created a Cheat Sheet with all the basic concepts of
 React JS

---
 CheatSheets/react-cheatsheet    |   1 -
 CheatSheets/react-cheatsheet.md | 171 ++++++++++++++++++++++++++++++++
 2 files changed, 171 insertions(+), 1 deletion(-)
 delete mode 100644 CheatSheets/react-cheatsheet
 create mode 100644 CheatSheets/react-cheatsheet.md

diff --git a/CheatSheets/react-cheatsheet b/CheatSheets/react-cheatsheet
deleted file mode 100644
index 933933e..0000000
--- a/CheatSheets/react-cheatsheet
+++ /dev/null
@@ -1 +0,0 @@
-Create a descriptive well formatted cheatsheet for all the things you should know about React JS 
\ No newline at end of file
diff --git a/CheatSheets/react-cheatsheet.md b/CheatSheets/react-cheatsheet.md
new file mode 100644
index 0000000..78fa746
--- /dev/null
+++ b/CheatSheets/react-cheatsheet.md
@@ -0,0 +1,171 @@
+# React JS CheatSheet
+## Import
+```jsx
+import React from 'react'
+import ReactDOM from 'react-dom'
+```
+## Components
+### Class Component
+```jsx
+class Welcome extends React.Component {
+  render() {
+    return <h1>Hello, {this.props.name}</h1>;
+  }
+}
+```
+### Function Component
+```jsx
+function Welcome(props) {
+  return <h1>Hello, {props.name}</h1>;
+}
+```
+## Render method
+```jsx
+function Welcome(props) {
+  return <h1>Hello, {props.name}</h1>;
+}
+
+const element = <Welcome name="Sara" />;
+ReactDOM.render(
+  element,
+  document.getElementById('root')
+);
+```
+## State
+```jsx
+function tick() {
+  const element = (
+    <div>
+      <h1>Hello, world!</h1>
+      <h2>It is {new Date().toLocaleTimeString()}.</h2>
+    </div>
+  );
+  ReactDOM.render(
+    element,
+    document.getElementById('root')
+  );
+}
+
+setInterval(tick, 1000);
+```
+## Lifecycle Methods
+```jsx
+componentDidMount() {
+    this.timerID = setInterval(
+      () => this.tick(),
+      1000
+    );
+  }
+```
+```jsx
+componentWillUnmount() {
+    clearInterval(this.timerID);
+  }
+```
+##### Other Lifecycle Methods:
+```jsx
+componentWillMount()
+```
+
+```jsx
+componentDidCatch()
+```
+
+## Event Handling
+```jsx
+function ActionLink() {
+  function handleClick(e) {
+    e.preventDefault();
+    console.log('The link was clicked.');
+  }
+
+  return (
+    <a href="#" onClick={handleClick}>
+      Click me
+    </a>
+  );
+}
+```
+## Conditionals
+```jsx
+function Greeting(props) {
+  const isLoggedIn = props.isLoggedIn;
+  if (isLoggedIn) {
+    return <UserGreeting />;
+  }
+  return <GuestGreeting />;
+}
+
+ReactDOM.render(
+  // Try changing to isLoggedIn={true}:
+  <Greeting isLoggedIn={false} />,
+  document.getElementById('root')
+);
+```
+## Lists
+```jsx
+function NumberList(props) {
+  const numbers = props.numbers;
+  const listItems = numbers.map((number) =>
+    <li>{number}</li>
+  );
+  return (
+    <ul>{listItems}</ul>
+  );
+}
+
+const numbers = [1, 2, 3, 4, 5];
+ReactDOM.render(
+  <NumberList numbers={numbers} />,
+  document.getElementById('root')
+);
+
+```
+## Keys
+```jsx
+const numbers = [1, 2, 3, 4, 5];
+const listItems = numbers.map((number) =>
+  <li key={number.toString()}>
+    {number}
+  </li>
+);
+```
+## Forms
+```jsx
+class FlavorForm extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {value: 'coconut'};
+
+    this.handleChange = this.handleChange.bind(this);
+    this.handleSubmit = this.handleSubmit.bind(this);
+  }
+
+  handleChange(event) {
+    this.setState({value: event.target.value});
+  }
+
+  handleSubmit(event) {
+    alert('Your favorite flavor is: ' + this.state.value);
+    event.preventDefault();
+  }
+
+  render() {
+    return (
+      <form onSubmit={this.handleSubmit}>
+        <label>
+          Pick your favorite flavor:
+          <select value={this.state.value} onChange={this.handleChange}>
+            <option value="grapefruit">Grapefruit</option>
+            <option value="lime">Lime</option>
+            <option value="coconut">Coconut</option>
+            <option value="mango">Mango</option>
+          </select>
+        </label>
+        <input type="submit" value="Submit" />
+      </form>
+    );
+  }
+}
+```
+

From dd343d03a44e57fceaac93d14a9b0b587823536a Mon Sep 17 00:00:00 2001
From: Neil Chauhan <31568159+neilchauhan2@users.noreply.github.com>
Date: Mon, 22 Oct 2018 22:48:55 +0530
Subject: [PATCH 2/2] Binary Search using JavaScript

---
 Problem-Solving/BinarySearch.js | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 Problem-Solving/BinarySearch.js

diff --git a/Problem-Solving/BinarySearch.js b/Problem-Solving/BinarySearch.js
new file mode 100644
index 0000000..51c3031
--- /dev/null
+++ b/Problem-Solving/BinarySearch.js
@@ -0,0 +1,21 @@
+let binarySearch = function(arr, x, start, end) {
+  if (start > end) return false;
+
+  let mid = Math.floor((start + end) / 2);
+
+  if (arr[mid] === x) return true;
+
+  if (arr[mid] > x) return binarySearch(arr, x, start, mid - 1);
+  else return binarySearch(arr, x, mid + 1, end);
+};
+
+let arr = [1, 3, 5, 7, 8, 9];
+let x = 5;
+
+if (binarySearch(arr, x, 0, arr.length - 1)) console.log("Element is present");
+else console.log("Element not present");
+
+x = 6;
+
+if (binarySearch(arr, x, 0, arr.length - 1)) console.log("Element is present");
+else console.log("Element not present");