diff --git a/pages/hack-school/js.mdx b/pages/hack-school/js.mdx
index a6084e4..cdb2e28 100644
--- a/pages/hack-school/js.mdx
+++ b/pages/hack-school/js.mdx
@@ -1,3 +1,5 @@
+import ToggleCodeBlock from './toggle_component';
+
# Week 2: JavaScript
## What is JavaScript?
@@ -136,6 +138,18 @@ const communites = ["Hack", "AI", "Cyber", "Design"];
const date = new Date("10-18-2023");
```
+## Exercise 1: Javascript Syntax Quiz
+Create a variable called firstName, that has your first name as it's value.
+Then, create a variable called lastName, that has your last name as it's value.
+Using the console.log() function, print the two variables together.
+
+```javascript copy showLineNumbers
+let firstName = "Nishant"
+let lastName = "Balaji"
+console.log(firstName + " " + lastName) // Nishant Balaji
+```
+
+
## Operators
Operators in JavaScript perform actions on values and variables.
These include arithmetic, comparison, logical, and assignment operators.
@@ -238,7 +252,24 @@ console.log(organization[age]);; // prints 6
organization.hackschool(); // prints "JavaScript Workshop"
```
+## Exercise 2: Creating and Manipulating Objects
+Create an object representing a UCSD student. Include properties such as name, college, year, and favorite subject.
+Then, write a function that updates the student's favorite subject.
+
+
+```javascript copy showLineNumbers
+let student = {
+ name: "Billy",
+ college: "Sixth",
+ year: "Freshman",
+ favoriteSubject: "Math",
+}
+function updateFavoriteSubject(student, subject) {
+ student.favoriteSubject = subject
+}
+```
+
## Loops
Loops allow you to execute a block of code repeatedly. Common loop types are `while`and `for` loops.
@@ -405,6 +436,28 @@ obj.greeting();
// prints window
```
+## Exercise 3: Creating Functions
+Create your own array of food items.
+Then, write a function findFood() that takes in the array and a food item.
+It will loop through the array and return true if the item exists in the array, and false otherwise.
+
+```javascript copy showLineNumbers
+let foodList = ["banana", "apple", "peach", "orange"]
+
+function findFood(foodList, food){
+ for (item in foodList){
+ if (item === food){
+ return true
+ }
+ }
+ return false
+}
+
+console.log(findFood(foodList, "apple")) // true
+console.log(findFood(foodList, "kiwi")) // false
+```
+
+
## Callbacks
Callbacks are functions passed as arguments to other functions. They are commonly used for asynchronous programming and event handling.
@@ -494,4 +547,35 @@ findUser()
console.log("Age:", age + 5);
})
.catch((error) => console.error("Error:", error.message));
-```
\ No newline at end of file
+```
+
+## Exercise 4: Async await practice
+
+Create an async function fetchData that simulates an API call to fetch user data. The function should return a promise that resolves after 2 seconds with a user object containing name and email.
+
+Then, write another async function displayUser that uses await to call fetchData and logs the user's information to the console.
+
+
+```javascript copy showLineNumbers
+// Simulate API call using a Promise that resolves after 2 seconds
+async function fetchData() {
+ return new Promise((resolve) => {
+ setTimeout(() => {
+ resolve({ name: "John Doe", email: "john.doe@example.com" });
+ }, 2000);
+ });
+}
+
+// Use async/await to fetch and display user data
+async function displayUser() {
+ try {
+ const user = await fetchData();
+ console.log("User Name:", user.name);
+ console.log("User Email:", user.email);
+ } catch (error) {
+ console.error("Error:", error.message);
+ }
+}
+// Call the displayUser function displayUser();
+```
+
\ No newline at end of file
diff --git a/pages/hack-school/toggle_component.tsx b/pages/hack-school/toggle_component.tsx
new file mode 100644
index 0000000..f85017e
--- /dev/null
+++ b/pages/hack-school/toggle_component.tsx
@@ -0,0 +1,25 @@
+import { useState, FC, ReactNode } from 'react';
+
+const ToggleCodeBlock: FC<{ children: ReactNode }> = ({ children }) => {
+ const [isVisible, setIsVisible] = useState(false);
+
+ return (
+