restore old commit

_sidebar.md

@@ -0,0 +1,29 @@
+* [Admin](admin/README.md)
+* [Ajax   Object Oriented Programming](ajax---object-oriented-programming/README.md)
+* [Algorithms   Data Structures](algorithms---data-structures/README.md)
+* [Archive](archive/README.md)
+* [Asynchronous Codes](asynchronous-codes/README.md)
+* [Career Development](career-development/README.md)
+* [Challenges](challenges/README.md)
+* [Css Extra](css-extra/README.md)
+* [Design](design/README.md)
+* [Environment Setup](environment-setup/README.md)
+* [Extended Content](extended-content/README.md)
+* [Git Collab](git-collab/README.md)
+* [Intro](intro/README.md)
+* [Mid Exam](mid-exam/README.md)
+* [Mongodb](mongodb/README.md)
+* [Python](python/README.md)
+* [R Ds](r-ds/README.md)
+* [React Advanced](react-advanced/README.md)
+* [React Basics](react-basics/README.md)
+* [Resources](resources/README.md)
+* [Servers](servers/README.md)
+* [Solutions](solutions/README.md)
+* [Sql Basics](sql-basics/README.md)
+* [State Management](state-management/README.md)
+* [Typescript](typescript/README.md)
+* [Unit Testings](unit-testings/README.md)
+* [Web Development Basics](web-development-basics/README.md)
+* [Web Development Basics Advanced](web-development-basics-advanced/README.md)
+* [Web Security   Osi Model  Python Backend ](web-security---osi-model--python-backend-/README.md)

admin/README.md

@@ -0,0 +1,3 @@
+# Admin
+
+- [Readme](readme/README.md)

admin/readme/README.md

@@ -0,0 +1,3 @@
+# Page 1
+
+# Sample content Page 1

ajax---object-oriented-programming/README.md

@@ -0,0 +1,15 @@
+# Ajax   Object Oriented Programming
+
+- [Ajax   Intro To Apis](ajax---intro-to-apis/README.md)
+- [Css  Tools For Modern Design](css--tools-for-modern-design/README.md)
+- [Css  Tools For Responsive Design](css--tools-for-responsive-design/README.md)
+- [Es6 Array Methods](es6-array-methods/README.md)
+- [Handlebars](handlebars/README.md)
+- [Intro To Json](intro-to-json/README.md)
+- [Local Storage](local-storage/README.md)
+- [My People   Handlebars   Api Project  Optional ](my-people---handlebars---api-project--optional-/README.md)
+- [Object Oriented Programming Intro  Oop ](object-oriented-programming-intro--oop-/README.md)
+- [Oop Inheritance](oop-inheritance/README.md)
+- [Oop Singleton   Dependency Injection](oop-singleton---dependency-injection/README.md)
+- [Promises](promises/README.md)
+- [Random User Page Api Project](random-user-page-api-project/README.md)

ajax---object-oriented-programming/ajax---intro-to-apis/README.md

@@ -0,0 +1,3 @@
+# Ajax Overview Video
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/xyluWPi6Ajo" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ajax---object-oriented-programming/ajax---intro-to-apis/_sidebar.md

@@ -0,0 +1,12 @@
+- [⬅ Back to Ajax   Object Oriented Programming](../README.md)
+
+- [Ajax Overview Video](./AJAX-Overview-Video.md)
+- [Api Requests   Jquery](./API-Requests---Jquery.md)
+- [Asynchronous](./Asynchronous.md)
+- [Comprehension Check](./Comprehension-Check.md)
+- [Exercises](./Exercises.md)
+- [Extracting Data](./Extracting-Data.md)
+- [Get Request   Error Handling Video](./GET-Request---Error-Handling-Video.md)
+- [Intro   Ajax](./Intro---AJAX.md)
+- [Requests  Success   Error](./Requests--Success---Error.md)
+- [Jquery Get Request Video](./jQuery-GET-Request-Video.md)

ajax---object-oriented-programming/css--tools-for-modern-design/README.md

@@ -0,0 +1,18 @@
+# Intro
+
+This isn't so much a lesson as much as a resource for several good tools you should be aware of and using in your projects.
+
+
+
+Now, this isn't a UI (user interface) or UX (user experience) course, but we should be able to make something that looks reasonably good, and there are simple tools out there for that. As such, it is beneficial to learn them.
+
+
+
+In particular, we will cover:
+
+-   Font-Awesome
+-   Flat-UI Colors
+-   Color Scheme Generator
+-   Website Color Scheme
+-   Google Fonts
+-   Design Tips

ajax---object-oriented-programming/css--tools-for-responsive-design/README.md

@@ -0,0 +1,52 @@
+# Intro
+
+Today, and probably in the future, screen sizes vary. Sometimes users are on their desktop with a wide-screen, sometimes on a smaller laptop, tablet, or phone - either way, we would like our web-apps to look reasonable on any display.
+
+
+
+The answer to this conundrum is built up of a few things, but today we will talk about these in particular:
+
+
+
+-   The Viewport
+-   max/min width/height
+-   Flexible units (instead of using pixels)
+-   Media Queries - _the_ tool for responsive design
+-   Emulating other devices on Chrome
+
+It may sound like a lot, but these are pretty small, but useful tools, so let's dive in.
+
+
+
+
+
+----------
+
+
+
+
+
+#### **THE VIEWPORT**
+
+
+
+
+
+The **viewport** is the area of the window in which web content can be seen ([quote](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta)) - that is to say, the visible area of a webpage. Naturally, this changes from device to device. We will be referencing this term throughout the lesson.
+
+
+
+To accommodate different viewports, we can add this `meta` tag to our root (usually _index_) HTML file:
+
+
+
+```html
+<meta name="viewport" content="width=device-width, initial-scale=1">
+```
+
+
+The above goes in the `head` tag, usually at the top. You can read all the details about this [here](https://developer.mozilla.org/en-US/docs/Web/CSS/Viewport_concepts), but the gist is that it sets the width of the page to be the width of the _device_.
+
+
+
+Generally there's not much more to do with the viewport aside from having this `meta` tag in our HTML, so we won't go into more detail about this.

ajax---object-oriented-programming/es6-array-methods/README.md

@@ -0,0 +1,3 @@
+# Array Methods Video
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/dlds4i9jV3E" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ajax---object-oriented-programming/handlebars/README.md

@@ -0,0 +1,3 @@
+# Handlebars Video
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/0AkrWvzf63c" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ajax---object-oriented-programming/intro-to-json/README.md

@@ -0,0 +1,3 @@
+# JSON Video
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/kANuvXsTH3k" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ajax---object-oriented-programming/local-storage/README.md

@@ -0,0 +1,3 @@
+# Local Storage Video
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/JNYe9qJw-2g" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ajax---object-oriented-programming/my-people---handlebars---api-project--optional-/README.md

@@ -0,0 +1,10 @@
+# Intro
+
+![.guides/img/my-ppl-hbars-apis-ex](./my-ppl-hbars-apis-ex.PNG)
+
+
+Knowing both Handlebars and how to make simple GET requests is great - both are very powerful tools.
+
+
+
+Let's take advantage of these and create a simple (static) directory of people, with a bit of CSS Grid for flare.

ajax---object-oriented-programming/object-oriented-programming-intro--oop-/README.md

@@ -0,0 +1,3 @@
+# OOP Intro Video
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/G8pKQ3FDD6o" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ajax---object-oriented-programming/oop-inheritance/README.md

@@ -0,0 +1,9 @@
+# Comprehension Check
+
+{Check It!|assessment}(multiple-choice-2241612772)
+{Check It!|assessment}(multiple-choice-3123031327)
+{Check It!|assessment}(multiple-choice-3000189069)
+{Check It!|assessment}(multiple-choice-2755130575)
+{Check It!|assessment}(multiple-choice-3542748998)
+{Check It!|assessment}(multiple-choice-376880610)
+{Check It!|assessment}(multiple-choice-1382738689)

ajax---object-oriented-programming/oop-inheritance/_sidebar.md

@@ -0,0 +1,16 @@
+- [⬅ Back to Ajax   Object Oriented Programming](../README.md)
+
+- [Comprehension Check](./Comprehension-Check.md)
+- [Custom  Inherited  Attributes](./Custom--inherited--Attributes.md)
+- [Deeper Inheritance](./Deeper-Inheritance.md)
+- [Exercises](./Exercises.md)
+- [Intro](./Intro.md)
+- [Method Overriding](./Method-Overriding.md)
+- [Oop Inheritance Intro Video](./OOP-Inheritance-Intro-Video.md)
+- [Object   Prototype Video](./Object---Prototype-Video.md)
+- [Object   Prototype](./Object---Prototype.md)
+- [Spot Check 1](./Spot-Check-1.md)
+- [Spot Check 2](./Spot-Check-2.md)
+- [Spot Check 3](./Spot-Check-3.md)
+- [Instanceof   Polymorphism Video](./instanceof---Polymorphism-Video.md)
+- [Instanceof   Polymorphism](./instanceof---Polymorphism.md)

ajax---object-oriented-programming/oop-singleton---dependency-injection/README.md

@@ -0,0 +1,3 @@
+# Singleton & Dependency Injection Video
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/BO-f6RNzkf0" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ajax---object-oriented-programming/promises/README.md

@@ -0,0 +1,107 @@
+# A Function That Returns A Promise
+
+Mostly we will work with functions that return promises, such as making http request.
+But in our example we need the example functions to return a promise.
+
+Here is a code that change our functions to return promises:
+```js
+const getRandomWord = function () {
+    let words = ['Bonanza', 'Elusive', 'Hindrance', 'Astute', 'Polaroid', 'Phonic', 'Yonder']
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            resolve(words[Math.floor(Math.random() * words.length)])
+        }, 1000);
+    })
+}
+
+const getSynonyms = function (word) {
+    let thesauraus = {
+        'Absolute': ['Definitive', 'Certain', 'Sure', 'Unequivocal'],
+        'Astute': ['Sharp', 'Poignant', 'Clever'],
+        'Azure': ['Blue', 'Cyan', 'Sky-blue'],
+        'Bright': ['Luminous', 'Brilliant'],
+        'Bonanza': ['Plethora', 'Smorgasboard', 'Copious', 'Plenty'],
+        'Elusive': ['Slick', 'Slippery', 'Ethereal', 'Loose'],
+        'Erode': ['Destroy', 'Wear out', 'Tarnish'],
+        'Hindrance': ['Bother', 'Disturbance', 'Problematic'],
+        'Phonic': ['Soundful'],
+        'Ploy': ['Plan', 'Ruse'],
+        'Polaroid': ['Photograph'],
+        'Yap': ['Bark', 'Blab', 'Chatter'],
+        'Yonder': ['There', 'Away', 'Far', 'Afar']
+    }
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            resolve(thesauraus[word])
+        }, 1000);
+    })
+}
+
+const getSentiment = function (word) {
+    let wordSentiment = {
+        'Definitive': 1,
+        'Sharp': 1,
+        'Blue': 0,
+        'Luminous': 1,
+        'Plethora': 1,
+        'Slick': -1,
+        'Destroy': -1,
+        'Bother': -1,
+        'Soundful': 0,
+        'Plan': 0,
+        'Photograph': 0,
+        'Bark': -1,
+        'There': -1
+    }
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            resolve(wordSentiment[word])
+        }, 1000);
+    })
+}
+
+// No need for promises here
+const getSentimentDescription = function (sentiment) {
+    return sentiment === 1 ? "Positive" : sentiment === -1 ? "Negative" : "Neutral"
+}
+```
+
+Use it so that you can run the code and add a `then`.
+
+This is out side of the lesson scope.
+If you are short in time move on to the next page.
+
+# Extension 
+If you have extra time, here is a basic explanation.
+To write a function that returns a promise, you can do the following:
+
+* Create a new promise using the Promise constructor, passing in a function with two arguments: resolve and reject.
+* Inside the function, perform the asynchronous operation.
+
+* If the operation succeeds, call the resolve function with the result of the operation as an argument.
+
+* If the operation fails, call the reject function with an error as an argument.
+
+Here is an example of a function that returns a promise that resolves with the result of an asynchronous HTTP request:
+
+```js
+function getData() {
+  return new Promise((resolve, reject) => {
+    fetch('https://example.com/data')
+      .then(response => {
+        if (response.ok) {
+          return response.json();
+        }
+        throw new Error('Request failed');
+      })
+      .then(data => {
+        resolve(data);
+      })
+      .catch(error => {
+        reject(error);
+      });
+  });
+}
+```
+
+If you want to read more about it you can do it [here](https://www.freecodecamp.org/news/how-to-write-a-javascript-promise-4ed8d44292b8/), or search online.

ajax---object-oriented-programming/promises/_sidebar.md

@@ -0,0 +1,17 @@
+- [⬅ Back to Ajax   Object Oriented Programming](../README.md)
+
+- [A Function That Returns A Promise](./A-Function-that-Returns-a-Promise.md)
+- [Applications](./Applications.md)
+- [Async Operation](./Async-Operation.md)
+- [Callback Hell](./Callback-Hell.md)
+- [Chaining](./Chaining.md)
+- [Comprehension Check](./Comprehension-Check.md)
+- [Exercises](./Exercises.md)
+- [Intro](./Intro.md)
+- [New Page](./New-Page.md)
+- [Promise All](./Promise-All.md)
+- [Promise](./Promise.md)
+- [Spot Check](./Spot-Check.md)
+- [Test Case](./Test-Case.md)
+- [Understanding Async Functions](./Understanding-Async-Functions.md)
+- [Understanding Callbacks](./Understanding-Callbacks.md)

ajax---object-oriented-programming/random-user-page-api-project/README.md

@@ -0,0 +1,27 @@
+# Extensions
+
+**1.** Render the pokemon name on your page in "Proper Case" ("Pikachu" instead of "pikachu")
+
+-   Hint: Create your own Handlebars Helper to do this.
+
+
+
+**2.** Add in two more buttons - a "Save User Page" button and a "Load User Page".
+
+
+
+-   Your "Save User Page" button should save a snapshot of your current user to local storage
+-   Your "Load User Page" button should load the user that you saved and render the exact user page back on the page - that means the same user, the quote, pokemon, meatText and friends they came with.
+
+
+
+**2.1** Save multiple users
+
+
+
+-   Edit the object you're saving in Local Storage to be a users object. You'll be adding each user you want to save to this object.
+-   Add a drop-down menu with the list of saved users. Now, when you click on the "Load User Page" button, it should load the saved user you select from the drop-down menu
+
+####   
+
+#### **DONE FOR REAL NOW**

ajax---object-oriented-programming/random-user-page-api-project/_sidebar.md

@@ -0,0 +1,7 @@
+- [⬅ Back to Ajax   Object Oriented Programming](../README.md)
+
+- [Extensions](./Extensions.md)
+- [Instructions Ii](./Instructions-II.md)
+- [Instructions](./Instructions.md)
+- [Intro](./Intro.md)
+- [Working With New Apis](./Working-with-New-APIs.md)