Menu

FullStack Morning Apr 2023

FullStack Morning Apr 2023

HTML CSS FILES

JS #3

// // // let age = 30;

// // // if (age >= 21) {
// // // 	console.log('You are allowed to enter.');
// // // }

// // // console.log('Hello World');

// // // let num = NaN;

// // // if (num % 2 === 0) {
// // // 	console.log('Number is even');
// // // } else if (num % 2 !== 0) {
// // // 	console.log('Number is odd');
// // // } else {
// // // 	console.log('Invalid number');
// // // }

// // let age = 21;

// // if (age >= 65) {
// // 	console.log('Drink are free');
// // } else if (age >= 21) {
// // 	console.log('You can enter and drink');
// // } else if (age >= 18) {
// // 	console.log("You can enter but you can't drink");
// // } else {
// // 	console.log('You are not allowed');
// // }

// let password = 'hello';

// if (password.length > 8) {
// 	if (password.indexOf(' ') === -1) {
// 		console.log('Valid Password');
// 	} else {
// 		console.log('Password cannot contain spaces');
// 	}
// } else {
// 	console.log('Invalid password');
// }

// let loggedInUser = 0;

// if (loggedInUser) {
// 	console.log('Welcome here');
// } else {
// 	console.log('You have to login to view the content.');
// }

// let age = 88;

// if (age >= 18 && age < 21) {
// 	console.log("You can enter but you can't drink");
// } else if (age >= 21 && age < 65) {
// 	console.log('You can enter and drink');
// } else if (age >= 65) {
// 	console.log('Drink are free');
// } else {
// 	console.log('You are not allowed');
// }

// let day = 2;

// if (day === 0) {
// 	console.log('Sunday');
// } else if (day === 1) {
// 	console.log('Monday');
// } else if (day === 2) {
// 	console.log('Tuesday');
// } else {
// 	console.log('Invalid day code');
// }

// let day = 0;

// switch (day) {
// 	case 0:
// 		console.log('Sunday');
// 		break;
// 	case 1:
// 		console.log('Monday');
// 		break;
// 	case 'hello':
// 		console.log('Something else');
// 		break;
// 	default:
// 		console.log('Invalid day code');
// }

let status = 'idle';
let color =
	status === 'online' ? 'green' : status === 'offline' ? 'red' : 'yellow';

// let color;

// if (status === 'online') {
// 	color = 'green';
// } else {
// 	color = 'red';
// }

console.log(color);

JS #4 and #5

// const products = [
// 	['iPhone 14', 'Apple', 'Some desc...', 500, 100000, true],
// 	['iPhone 14', 'Apple', 'Some desc...', 500, 100000, true],
// 	['iPhone 14', 'Apple', 'Some desc...', 500, 100000, true],
// ];

// const prod1 = ['iPhone 14', 'Apple', 'Some desc...', 100000, 500, true];
// console.log(prod1[3]);

const prod2 = {
	brand: 'Apple',
	description: 'Some description...',
	price: 100000,
	inStock: 500,
	name: 'iPhone 14',
	discounted: true,
	info: {
		firstName: 'John',
		lastName: 'Doe',
	},
	10000: true,
	'hello world': false,
};
console.log(prod2.info);
console.log(prod2['10000']);
console.log(prod2['hello world']);




// // // const pallette = {
// // // 	red: '#eb4d4b',
// // // 	yellow: '#f9ca24',
// // // 	blue: '#30336b',
// // // };

// // // let color = 'yellow';

// // // console.log(pallette[color]);

// // const fitnessData = {
// // 	totalSteps: 400000,
// // 	totalKms: 253.32,
// // 	avgCalorieBurn: 2300,
// // 	workoutsThisWeek: '5 of 7',
// // 	avgSleep: '5:45',
// // };

// // delete fitnessData.avgSleep;

// // fitnessData.hello = 'world';
// // fitnessData.totalSteps++;
// // console.log(fitnessData);

// // const student = {
// // 	firstName: 'John',
// // 	lastName: 'Doe',
// // 	frameworks: ['ReactJS', 'Express.js'],
// // 	levels: {
// // 		backend: 50,
// // 		frontend: 45,
// // 		data: 5,
// // 	},
// // };

// // console.log(student.frameworks[1]);

// // const shoppingCart = [
// // 	{
// // 		product: 'Apple iPhone',
// // 		price: 100000,
// // 		quantity: 100,
// // 	},
// // 	{
// // 		product: 'One Plus Nord',
// // 		price: 60000,
// // 		quantity: 1000,
// // 	},
// // 	{
// // 		product: 'Alienware M15',
// // 		price: 299999,
// // 		quantity: 1,
// // 	},
// // ];

// // console.log(shoppingCart[1].price);

// // for (let count = 0; count < 99999999999; count++) {
// // 	console.log(`${count}*${count}=${count * count}`);
// // }

// // for (let count = 10; count >= 0; count++) {
// // 	console.log(count);
// // }

// // const nums = [12, 34, 56, 34, 78, 54, 23, 12];

// // for (let i = 0; i < nums.length; i++) {
// // 	console.log(nums[i]);
// // }

// // for (let i = 0; i < nums.length; i++) {
// // 	console.log(`The value at index ${i} is ${nums[i]}`);
// // }

// const movies = [
// 	{ movieName: 'Inception', rating: 3.8 },
// 	{ movieName: 'Avengers', rating: 3.4 },
// 	{ movieName: 'Iron Man', rating: 2.9 },
// ];

// for (let i = 0; i < movies.length; i++) {
// 	const movie = movies[i];
// 	console.log(`${movie.movieName} has a rating of ${movie.rating}.`);
// }

// const word = 'Hello World';

// // for (let i = 0; i < word.length; i++) {
// // 	console.log(word[i]);
// // }

// let reversedWord = '';
// for (let i = word.length - 1; i >= 0; i--) {
// 	// console.log(word[i]);
// 	reversedWord += word[i];
// }

// console.log(reversedWord);

// for (let i = 1; i < 6; i++) {
// 	console.log('OUTER LOOP:', i);
// 	for (let j = 1; j < 6; j++) {
// 		console.log('\tINNER LOOP', j);
// 	}
// }

// const gameBoard = [
// 	[4, 64, 8, 4],
// 	[128, 32, 4, 16],
// 	[16, 4, 4, 32],
// 	[2, 16, 16, 2],
// ];

// let total = 0;

// for (let i = 0; i < gameBoard.length; i++) {
// 	for (let j = 0; j < gameBoard[i].length; j++) {
// 		console.log(gameBoard[i][j]);
// 		total += gameBoard[i][j];
// 	}
// }

// console.log(total);

// for (let i = 0; i < 10; i++) {
// 	console.log(i);
// }

// let count = 0;
// while (count < 10) {
// 	console.log(count);
// 	count++;
// }

// const target = Math.floor(Math.random() * 10) + 1;
// let guess = Math.floor(Math.random() * 10) + 1;

// while (guess !== target) {
// 	if (guess === 2) {
// 		break;
// 	}
// 	console.log(`TARGET: ${target} | COMP GUESS: ${guess}`);
// 	guess = Math.floor(Math.random() * 10) + 1;
// }

// console.log(`TARGET: ${target} | COMP GUESS: ${guess}`);

// const target = Math.floor(Math.random() * 10) + 1;
// let guess = Math.floor(Math.random() * 10) + 1;

// while (true) {
// 	if (guess === target) {
// 		break;
// 	}
// 	console.log(`TARGET: ${target} | COMP GUESS: ${guess}`);
// 	guess = Math.floor(Math.random() * 10) + 1;
// }

// console.log(`TARGET: ${target} | COMP GUESS: ${guess}`);

const nums = [12, 34, 56, 34, 78, 54, 23, 12];

// for (let i = 0; i < nums.length; i++) {
// 	console.log(nums[i]);
// }

// for (let num of nums) {
// 	console.log(num);
// }

// for (let char of 'hello world') {
// 	console.log(char);
// }

// const matrix = [
// 	[1, 4, 7],
// 	[9, 7, 2],
// 	[9, 4, 6],
// ];

// let total = 0;

// for (let arr of matrix) {
// 	for (let num of arr) {
// 		total += num;
// 	}
// }

// console.log(total);

// const cats = ['fashion', 'mobiles', 'books'];
// const prods = ['tshirt', 'samsung', '1984'];

// for (let i = 0; i < cats.length; i++) {
// 	console.log(cats[i], prods[i]);
// }

const productPrices = {
	Apple: 80000,
	OnePlus: 50000,
	Samsung: 90000,
};

for (let key of Object.keys(productPrices)) {
	console.log(key, productPrices[key]);
}

for (let key in productPrices) {
	console.log(key, productPrices[key]);
}

JS #6

// // function greet() {
// // 	console.log('Hello World');
// // 	console.log('Hello World');
// // 	console.log('Hello World');
// // 	console.log('Hello World');
// // }

// // for (let i = 0; i < 10; i++) {
// // 	greet();
// // }

// // function rollDie() {
// // 	let roll = Math.floor(Math.random() * 6) + 1;
// // 	console.log(`Rolled: ${roll}`);
// // }

// // function throwDice(times) {
// // 	for (let i = 0; i < times; i++) {
// // 		rollDie();
// // 	}
// // }

// // throwDice(50);

// // function greet(person, message) {
// // 	console.log(`${message} ${person}`);
// // }

// // greet('John Doe', 'Hello', 'world', true, 100);
// // greet('Jane Smith');

// // function greet(name, message) {
// // 	return `${message} ${person}`;
// // }

// // console.log(greet('Jane Doe', 'Hello'));

// // function isNumber(val) {
// // 	if (typeof val === 'number') {
// // 		return true;
// // 	}
// // 	return false;
// // }

// // console.log(isNumber(10));

// // let firstName = 'Jane';

// // function greet() {
// // 	let firstName = 'John';
// // 	console.log(firstName);
// // }

// // greet();
// // console.log(firstName);

// // var firstName = 'Jane';

// // if (true) {
// // 	var firstName = 'John';
// // 	console.log(firstName);
// // }

// // console.log(firstName);

// // for (var i = 0; i < 10; i++) {
// // 	console.log('Inside the for loop', i);
// // }

// // console.log('Outside the for loop', i);

// // function outer() {
// // 	const firstName = 'John';

// // 	function inner() {
// // 		const firstName = 'Jane';
// // 		console.log(firstName);
// // 	}

// // 	inner();
// // }

// // outer();

// // function greet() {
// // 	console.log('Hello World');
// // }

// // const hello = greet;

// // hello();

// function math(a, b, fn) {
// 	return fn(a, b);
// }

// function add(a, b) {
// 	return a + b;
// }
// function sub(a, b) {
// 	return a - b;
// }

// console.log(math(10, 2, sub));
// console.log(
// 	math(10, 6, function (a, b) {
// 		return a ** b;
// 	})
// );

// // const square = function (a) {
// // 	return a ** 2;
// // };

// // console.log(square(10));

// const math = [
// 	function (a, b) {
// 		return a + b;
// 	},
// 	function (a, b) {
// 		return a - b;
// 	},
// 	function (a, b) {
// 		return a * b;
// 	},
// 	function (a, b) {
// 		return a / b;
// 	},
// ];

// console.log(math[2](10, 5));

const math = {
	add: function (a, b) {
		return a + b;
	},
	sub: function (a, b) {
		return a - b;
	},
	mul: function (a, b) {
		return a * b;
	},
	div: function (a, b) {
		return a / b;
	},
};

console.log(math.add(10, 5));

JS #7

// // // // function math(a, b, fn) {
// // // // 	return fn(a, b);
// // // // }

// // // // function sub(a, b) {
// // // // 	return a - b;
// // // // }

// // // // console.log(math(10, 5, sub));

// // // let total = 0;

// // // function getValue(val) {
// // // 	val = val + 10;
// // // 	return val;
// // // }

// // // console.log(getValue(total));
// // // console.log(getValue(total));
// // // console.log(getValue(total));
// // // console.log(getValue(total));

// // // // Example 2
// // // function repeat(func, num) {
// // //   for (let i = 0; i < num; i++) {
// // //     func()
// // //   }
// // // }

// // // function sayHello() {
// // //   console.log('Hello World!')
// // // }
// // // function sayGoodbye() {
// // //   console.log('Bye World!')
// // // }

// // // repeat(sayHello, 10)
// // // repeat(sayGoodbye, 5)
// // // // Example 3
// // // function randomPick(f1, f2) {
// // //   let randNum = Math.random()
// // //   if (randNum < 0.5) {
// // //     f1()
// // //   } else {
// // //     f2()
// // //   }
// // // }

// // // randomPick(sayHello, sayGoodbye)

// // function raiseBy(num) {
// // 	return function (x) {
// // 		return x ** num;
// // 	};
// // }

// // let square = raiseBy(2);
// // let cube = raiseBy(3);
// // let hypercube = raiseBy(4);

// // console.log(hypercube(2));

// // function isBetween(x, y) {
// //   return function (num) {
// //     return num >= x && num <= y
// //   }
// // }

// // const isUnderAge = isBetween(0, 18)
// // const canEnterButNotDrink = isBetween(18, 21)
// // const canDrink = isBetween(21, 65)
// // const isSenior = isBetween(65, 100)

// // console.log(isUnderAge(5))
// // console.log(canEnterButNotDrink(20))
// // console.log(canDrink(30))
// // console.log(isSenior(70))

// // setInterval(function () {
// // 	console.log('Hello World');
// // }, 1000);

// // (function () {
// // 	console.log('Hello World');
// // })();

// // console.log(
// // 	(function (num) {
// // 		return function (x) {
// // 			return x ** num;
// // 		};
// // 	})(10)(5)
// // );

// // // console.log(result(5));

// // greet();

// // function greet() {
// // 	console.log('Hello World');
// // }

// console.log(hello);

// let hello = 'world';

// const nums = ['jane', 'jack', 'hello', true, false, 0, null, undefined];

// // for (let num of nums) {
// // 	console.log(num);
// // }

// nums.forEach(function (num, i) {
// 	console.log(i, num, 'Hello');
// });

// const movies = [
// 	{
// 		title: 'Avengers',
// 		rating: 4.1,
// 	},
// 	{
// 		title: 'Dr. Strange',
// 		rating: 3.9,
// 	},
// 	{
// 		title: 'Tenet',
// 		rating: 4.3,
// 	},
// 	{
// 		title: 'Joker',
// 		rating: 4.7,
// 	},
// ];

// movies.forEach(function (movie) {
// 	console.log(movie.title.toUpperCase());
// });

// const names = ['john', 'jack', 'jane', 'james'];

// const uppercasedNames = names.map(function (name) {
// 	return 'hello';
// });

// // const uppercasedNames = [];

// // for (let name of names) {
// // 	uppercasedNames.push(name.toUpperCase());
// // }

// console.log(uppercasedNames);

const nums = [2, 3, 4, 7, 6, 8, 13, 10, 19, 12, 14, 22, 21, 16];

const doubles = nums.map(function (num) {
	return {
		number: num,
		isEven: num % 2 === 0,
	};
});

console.log(doubles);

JS #8

// // // let nums = [1, 2, 3, 4, 5];

// // // let doubles = nums.map(function (num) {
// // // 	return num * 2;
// // // });

// // // console.log(doubles);

// // // function square(x) {
// // // 	return x ** 2;
// // // }

// // // const square2 = x => x ** 2

// // // console.log(square2(2))

// // let nums = [1, 2, 3, 4, 5];

// // let doubles = nums.map((num) => num * 2);
// // console.log(doubles);

// // let movies = ['The Terminator', 'The Avengers', 'Jurassic Park', 'Titanic'];

// // const result = movies.find((movie) => movie[0] === 'J');
// // console.log(result);

// // const books = [
// // 	{
// // 		title: 'The Shining',
// // 		author: 'Stephen King',
// // 		rating: 4.1,
// // 	},
// // 	{
// // 		title: 'Sacred Games',
// // 		author: 'Vikram Chandra',
// // 		rating: 4.5,
// // 	},
// // 	{
// // 		title: '1984',
// // 		author: 'George Orwell',
// // 		rating: 4.9,
// // 	},
// // 	{
// // 		title: 'The Alchemist',
// // 		author: 'Paulo Coelho',
// // 		rating: 3.5,
// // 	},
// // 	{
// // 		title: 'The Great Gatsby',
// // 		author: 'F. Scott Fitzgerald',
// // 		rating: 3.8,
// // 	},
// // ];

// // const result = books.find((book) => book.rating < 4);
// // console.log(result);

// // const goodBook = books.find((b) => b.rating >= 4.3);

// // const georgeBook = books.find((b) => b.author.includes('George'));

// // const lowRated = books.find((book) => {
// // 	return book.rating < 4;
// // });

// // console.log(goodBook);
// // console.log(georgeBook);

// const books = [
// 	{
// 		title: 'The Shining',
// 		author: 'Stephen King',
// 		rating: 4.1,
// 	},
// 	{
// 		title: 'Sacred Games',
// 		author: 'Vikram Chandra',
// 		rating: 4.5,
// 	},
// 	{
// 		title: '1984',
// 		author: 'George Orwell',
// 		rating: 4.9,
// 	},
// 	{
// 		title: 'The Alchemist',
// 		author: 'Paulo Coelho',
// 		rating: 3.5,
// 	},
// 	{
// 		title: 'The Great Gatsby',
// 		author: 'F. Scott Fitzgerald',
// 		rating: 3.8,
// 	},
// ];

// const result = books.filter((book) => book.rating < 4);
// console.log(result);

// const goodBook = books.filter((b) => b.rating >= 4.3);

// const georgeBooks = books.filter((b) => b.author.includes('George'));

// const lowRated = books.filter((book) => {
// 	return book.rating < 4;
// });

// let query = 'the';
// const filteredBooks = books.filter((book) => {
// 	const title = book.title.toLowerCase();
// 	return title.includes(query);
// });

// console.log(goodBook);
// console.log(georgeBooks);
// console.log(lowRated);
// console.log(booksWithThe);

// const names = ['jack', 'james', 'john', 'jane', 'josh', 'jrad'];

// const result = names.every((name) => name[0] == 'j');
// console.log(result);

// const bestBooks = books.every((book) => book.rating >= 4);

// const notAuthor = books.every(
// 	(book) => book.author.toLowerCase() !== 'chetan bhagat'
// );

// console.log(bestBooks);
// console.log(notAuthor);

// const names = ['jack', 'james', 'john', 'jane', 'josh', 'jrad'];

// const result = names.some((name) => name[0] === 'b');
// console.log(result);

// const prices = [500.4, 211, 23, 5, 4, 22.2, -23.2, 9233];

// const result = prices.sort((a, b) => a - b);
// console.log(result);

// const nums = [1, 2, 3, 4, 5];

// const result = nums.reduce((acc, currVal) => acc * currVal);
// console.log(result);

// // acc     currVal
// // 1       2
// // 3			 3
// // 6       4
// // 10      5
// // 15

// let nums = [21, 221, 2, 1, 34, 123, 4342, 56, 4];

// const maxVal = nums.reduce((acc, currVal) => {
// 	if (currVal > acc) {
// 		return currVal;
// 	}
// 	return acc;
// });

// acc     currVal
// 21			 221
// 221		 2
// 221		 1
// 221     34
// 221     4342
// 4342

// // Example 2 -> Product (multiply everything)
// [3, 2, 4, 6, 9].reduce((total, currentVal) => {
// 	return total * currentVal;
// });

// // Example 3 -> Finding max value
// let nums = [21, 221, 2, 1, 34, 123, 4342, 56, 4];

// const maxVal = nums.reduce((max, currentVal) => {
// 	if (currentVal > max) {
// 		return currentVal;
// 	}
// 	return max;
// });
// console.log(maxVal); // 4342

// // A shorter way is to use the Math.max and implicit return
// const maxVal = nums.reduce((max, currVal) => Math.max(max, currVal));
// console.log(maxVal);

const nums = [1, 2, 3, 4, 5];

console.log(nums.reduce((acc, currVal) => acc + currVal, 100));

JS #9

// // // function add(a = 0, b = 0) {
// // // 	return a + b;
// // // }

// // // console.log(add(5, 30));

// // // function printVals(a, b, c) {
// // // 	console.log(a);
// // // 	console.log(b);
// // // 	console.log(c);
// // // }

// // // const data = ['hello', 'world', 'test'];

// // // printVals(...'hello');

// // // function add(...nums) {
// // // 	return nums.reduce((acc, currVal) => acc + currVal);
// // // }

// // // console.log(add(10, 5, 43, 1, 21, 123, 344));

// // // function printNames(name1, name2, ...others) {
// // // 	console.log(name1);
// // // 	console.log(name2);
// // // 	console.log(others);
// // // }

// // // printNames('john', 'jane', 'jack', 'josh');

// // function profile({ firstName, lastName, age }) {
// // 	console.log(
// // 		`Hello, my name is ${firstName} ${lastName} and I am ${age} years old`
// // 	);
// // }

// // profile({ firstName: 'John', lastName: 'Doe', age: 20 });

// const movieReviews = [4.5, 5.0, 3.2, 2.1, 4.7, 3.8, 3.1, 3.9, 4.4];
// const highest = Math.max(...movieReviews);
// const lowest = Math.min(...movieReviews);

// let total = 0;
// movieReviews.forEach((rating) => (total += rating));
// const average = total / movieReviews.length;

// const info1 = { highest, lowest, average, hello: 'world' };
// console.log(info1);

// const getReviewDetails = (arr) => {
// 	const highest = Math.max(...arr);
// 	const lowest = Math.min(...arr);
// 	const total = arr.reduce((accumulator, nextVal) => accumulator + nextVal);
// 	const average = total / arr.length;

// 	return {
// 		highest,
// 		lowest,
// 		total,
// 		average,
// 	};
// };

// const reviewList = [4.5, 5.0, 3.2, 2.1, 4.7, 3.8, 3.1, 3.9, 4.4];

// const statistics = getReviewDetails(reviewList);

// const username = 'janedoe';
// const role = 'admin';

// const user1 = {
// 	[role.toUpperCase()]: username,
// };

// console.log(user1);

const addProperty = (obj, k, v) => {
	return { ...obj, [k]: v };
};
console.log(addProperty({ name: 'John' }, 'age', 25));

JS #10

// // const math = {
// // 	multiply(x, y) {
// // 		return x * y;
// // 	},
// // 	divide(x, y) {
// // 		return x / y;
// // 	},
// // 	square(x) {
// // 		return x ** 2;
// // 	},
// // };

// // console.log(math.multiply(2, 5));

// // console.log('Hello World!');

// // function namaste() {
// // 	console.log('Hello World');
// // 	console.log(this);
// // 	// this =
// // }

// // namaste();

// function namaste() {
// 	console.log(`Hello, my name is ${this.firstName} ${this.lastName}.`);
// }

// const profile1 = {
// 	firstName: 'John',
// 	lastName: 'Doe',
// 	namaste,
// };
// const profile2 = {
// 	firstName: 'Jane',
// 	lastName: 'Smith',
// 	namaste,
// };

// const hello = profile2.namaste;

// hello();

// // namaste();
// // profile1.namaste();
// // profile2.namaste();

// const hello = {
// 	messages: [
// 		'hello world',
// 		'hello universe',
// 		'hello darkness',
// 		'hello hello',
// 		'heylo',
// 	],
// 	pickMsg() {
// 		const index = Math.floor(Math.random() * this.messages.length);
// 		return this.messages[index];
// 	},
// 	start() {
// 		setInterval(() => {
// 			// this = hello
// 			console.log(this.pickMsg());
// 		}, 1000);
// 	},
// };

// hello.start();

const user1 = {
	firstName: 'John',
	lastName: 'Doe',
	greet: () => {
		console.log(`Hello my name is ${this.firstName} ${this.lastName}`);
	},
};

user1.greet();

JS #11

// // const title = document.getElementById('special');
// // console.dir(title);

// // const listItems = document.getElementsByTagName('li');
// // console.log(listItems);

// const hellos = document.getElementsByClassName('hello');
// // console.log(hellos[1]);

// const list = hellos[1];
// // const listItems = document.getElementsByTagName('li');

// // console.log(listItems);

// // console.log(list);
// const listItems = list.getElementsByTagName('li');
// console.log(listItems);

// const result = document.querySelectorAll('#special');
// console.log(result);

// const h1 = document.querySelector('h1');
// console.log(h1.innerText);
// h1.innerText = 'This is something else';

// setInterval(function () {
// 	h1.innerText = Math.random();
// }, 1000);

// const ul = document.querySelector('ul');
// console.log(ul);
// ul.innerText = 'Hello';

// const p = document.querySelector('p');
// // console.log(p.textContent);

// p.innerHTML = 'Hello <strong>World</strong>';
// p.innerHTML += ' <em>this is more content</em>';

// const a = document.querySelector('a');
// // a.href = 'https://yahoo.co.in';
// a.setAttribute('href', 'https://hey.com');

// // console.log(a.href);
// console.log(a.getAttribute('href'));

// const li = document.querySelector('.li');
// // console.log(li.previousElementSibling);
// // console.log(li.nextElementSibling.nextElementSibling);
// console.log(li.parentElement.parentElement);

// const lis = document.querySelectorAll('li');

// for (let li of lis) {
// 	li.innerText = Math.random();
// }

// const h1 = document.querySelector('h1');
// h1.style.color = 'red';
// h1.style.backgroundColor = 'black';
// h1.style.padding = '20px 40px';
// h1.style.borderRadius = '50%';
// h1.style.textAlign = 'center';

// const lis = document.querySelectorAll('li');
// const colors = ['red', 'yellow', 'green', 'orange', 'teal'];

// for (li of lis) {
// 	li.style.color = colors[Math.floor(Math.random() * colors.length)];
// 	li.style.fontSize = '20';
// 	li.style.fontWeight = 'bold';
// 	li.style.backgroundColor = 'black';
// 	li.style.fontFamily = 'Helvetica, sans-serif';
// }

// const h1 = document.querySelector('h1');
// const h1Styles = getComputedStyle(h1);
// console.log(h1Styles.color);

// const li = document.querySelector('li');
// // li.className = 'todo done';
// li.classList.add('hello');
// // li.classList.remove('todo');
// // li.classList.toggle('todo');

// console.log(li.classList);

const root = document.querySelector('#root');

const title = document.createElement('h1');
title.innerText = 'Hello World. This is an element created using JavaScript.';
title.style.color = 'red';
title.style.textDecoration = 'underline';

const container = document.createElement('div');
container.style.padding = '40px 100px';
container.style.border = '1px solid red';

container.appendChild(title);
root.appendChild(container);

// ----------------

const li = document.createElement('li');
li.innerText = 'Hello World';

const ul = document.querySelector('ul');
const targetLi = ul.querySelector('li');

ul.insertBefore(li, targetLi);

Task DATA

const products = [
	{
		id: 1,
		title: 'iPhone 9',
		description: 'An apple mobile which is nothing like apple',
		price: 549,
		discountPercentage: 12.96,
		rating: 4.69,
		stock: 94,
		brand: 'Apple',
		category: 'smartphones',
		thumbnail: 'https://sample.com/data/products/1/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/1/1.jpg',
			'https://sample.com/data/products/1/2.jpg',
			'https://sample.com/data/products/1/3.jpg',
			'https://sample.com/data/products/1/4.jpg',
			'https://sample.com/data/products/1/thumbnail.jpg',
		],
	},
	{
		id: 2,
		title: 'iPhone X',
		description:
			'SIM-Free, Model A19211 6.5-inch Super Retina HD display with OLED technology A12 Bionic chip with ...',
		price: 899,
		discountPercentage: 17.94,
		rating: 4.44,
		stock: 34,
		brand: 'Apple',
		category: 'smartphones',
		thumbnail: 'https://sample.com/data/products/2/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/2/1.jpg',
			'https://sample.com/data/products/2/2.jpg',
			'https://sample.com/data/products/2/3.jpg',
			'https://sample.com/data/products/2/thumbnail.jpg',
		],
	},
	{
		id: 3,
		title: 'Samsung Universe 9',
		description:
			"Samsung's new variant which goes beyond Galaxy to the Universe",
		price: 1249,
		discountPercentage: 15.46,
		rating: 4.09,
		stock: 36,
		brand: 'Samsung',
		category: 'smartphones',
		thumbnail: 'https://sample.com/data/products/3/thumbnail.jpg',
		images: ['https://sample.com/data/products/3/1.jpg'],
	},
	{
		id: 4,
		title: 'OPPOF19',
		description: 'OPPO F19 is officially announced on April 2021.',
		price: 280,
		discountPercentage: 17.91,
		rating: 4.3,
		stock: 123,
		brand: 'OPPO',
		category: 'smartphones',
		thumbnail: 'https://sample.com/data/products/4/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/4/1.jpg',
			'https://sample.com/data/products/4/2.jpg',
			'https://sample.com/data/products/4/3.jpg',
			'https://sample.com/data/products/4/4.jpg',
			'https://sample.com/data/products/4/thumbnail.jpg',
		],
	},
	{
		id: 5,
		title: 'Huawei P30',
		description:
			'Huawei’s re-badged P30 Pro New Edition was officially unveiled yesterday in Germany and now the device has made its way to the UK.',
		price: 499,
		discountPercentage: 10.58,
		rating: 4.09,
		stock: 32,
		brand: 'Huawei',
		category: 'smartphones',
		thumbnail: 'https://sample.com/data/products/5/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/5/1.jpg',
			'https://sample.com/data/products/5/2.jpg',
			'https://sample.com/data/products/5/3.jpg',
		],
	},
	{
		id: 6,
		title: 'MacBook Pro',
		description:
			'MacBook Pro 2021 with mini-LED display may launch between September, November',
		price: 1749,
		discountPercentage: 11.02,
		rating: 4.57,
		stock: 83,
		brand: 'Apple',
		category: 'laptops',
		thumbnail: 'https://sample.com/data/products/6/thumbnail.png',
		images: [
			'https://sample.com/data/products/6/1.png',
			'https://sample.com/data/products/6/2.jpg',
			'https://sample.com/data/products/6/3.png',
			'https://sample.com/data/products/6/4.jpg',
		],
	},
	{
		id: 7,
		title: 'Samsung Galaxy Book',
		description:
			'Samsung Galaxy Book S (2020) Laptop With Intel Lakefield Chip, 8GB of RAM Launched',
		price: 1499,
		discountPercentage: 4.15,
		rating: 4.25,
		stock: 50,
		brand: 'Samsung',
		category: 'laptops',
		thumbnail: 'https://sample.com/data/products/7/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/7/1.jpg',
			'https://sample.com/data/products/7/2.jpg',
			'https://sample.com/data/products/7/3.jpg',
			'https://sample.com/data/products/7/thumbnail.jpg',
		],
	},
	{
		id: 8,
		title: 'Microsoft Surface Laptop 4',
		description:
			'Style and speed. Stand out on HD video calls backed by Studio Mics. Capture ideas on the vibrant touchscreen.',
		price: 1499,
		discountPercentage: 10.23,
		rating: 4.43,
		stock: 68,
		brand: 'Microsoft Surface',
		category: 'laptops',
		thumbnail: 'https://sample.com/data/products/8/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/8/1.jpg',
			'https://sample.com/data/products/8/2.jpg',
			'https://sample.com/data/products/8/3.jpg',
			'https://sample.com/data/products/8/4.jpg',
			'https://sample.com/data/products/8/thumbnail.jpg',
		],
	},
	{
		id: 9,
		title: 'Infinix INBOOK',
		description:
			'Infinix Inbook X1 Ci3 10th 8GB 256GB 14 Win10 Grey – 1 Year Warranty',
		price: 1099,
		discountPercentage: 11.83,
		rating: 4.54,
		stock: 96,
		brand: 'Infinix',
		category: 'laptops',
		thumbnail: 'https://sample.com/data/products/9/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/9/1.jpg',
			'https://sample.com/data/products/9/2.png',
			'https://sample.com/data/products/9/3.png',
			'https://sample.com/data/products/9/4.jpg',
			'https://sample.com/data/products/9/thumbnail.jpg',
		],
	},
	{
		id: 10,
		title: 'HP Pavilion 15-DK1056WM',
		description:
			'HP Pavilion 15-DK1056WM Gaming Laptop 10th Gen Core i5, 8GB, 256GB SSD, GTX 1650 4GB, Windows 10',
		price: 1099,
		discountPercentage: 6.18,
		rating: 4.43,
		stock: 89,
		brand: 'HP Pavilion',
		category: 'laptops',
		thumbnail: 'https://sample.com/data/products/10/thumbnail.jpeg',
		images: [
			'https://sample.com/data/products/10/1.jpg',
			'https://sample.com/data/products/10/2.jpg',
			'https://sample.com/data/products/10/3.jpg',
			'https://sample.com/data/products/10/thumbnail.jpeg',
		],
	},
	{
		id: 11,
		title: 'perfume Oil',
		description:
			'Mega Discount, Impression of Acqua Di Gio by GiorgioArmani concentrated attar perfume Oil',
		price: 13,
		discountPercentage: 8.4,
		rating: 4.26,
		stock: 65,
		brand: 'Impression of Acqua Di Gio',
		category: 'fragrances',
		thumbnail: 'https://sample.com/data/products/11/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/11/1.jpg',
			'https://sample.com/data/products/11/2.jpg',
			'https://sample.com/data/products/11/3.jpg',
			'https://sample.com/data/products/11/thumbnail.jpg',
		],
	},
	{
		id: 12,
		title: 'Brown Perfume',
		description: 'Royal_Mirage Sport Brown Perfume for Men & Women - 120ml',
		price: 40,
		discountPercentage: 15.66,
		rating: 4,
		stock: 52,
		brand: 'Royal_Mirage',
		category: 'fragrances',
		thumbnail: 'https://sample.com/data/products/12/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/12/1.jpg',
			'https://sample.com/data/products/12/2.jpg',
			'https://sample.com/data/products/12/3.png',
			'https://sample.com/data/products/12/4.jpg',
			'https://sample.com/data/products/12/thumbnail.jpg',
		],
	},
	{
		id: 13,
		title: 'Fog Scent Xpressio Perfume',
		description:
			'Product details of Best Fog Scent Xpressio Perfume 100ml For Men cool long lasting perfumes for Men',
		price: 13,
		discountPercentage: 8.14,
		rating: 4.59,
		stock: 61,
		brand: 'Fog Scent Xpressio',
		category: 'fragrances',
		thumbnail: 'https://sample.com/data/products/13/thumbnail.webp',
		images: [
			'https://sample.com/data/products/13/1.jpg',
			'https://sample.com/data/products/13/2.png',
			'https://sample.com/data/products/13/3.jpg',
			'https://sample.com/data/products/13/4.jpg',
			'https://sample.com/data/products/13/thumbnail.webp',
		],
	},
	{
		id: 14,
		title: 'Non-Alcoholic Concentrated Perfume Oil',
		description:
			'Original Al Munakh® by Mahal Al Musk | Our Impression of Climate | 6ml Non-Alcoholic Concentrated Perfume Oil',
		price: 120,
		discountPercentage: 15.6,
		rating: 4.21,
		stock: 114,
		brand: 'Al Munakh',
		category: 'fragrances',
		thumbnail: 'https://sample.com/data/products/14/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/14/1.jpg',
			'https://sample.com/data/products/14/2.jpg',
			'https://sample.com/data/products/14/3.jpg',
			'https://sample.com/data/products/14/thumbnail.jpg',
		],
	},
	{
		id: 15,
		title: 'Eau De Perfume Spray',
		description:
			'Genuine  Al-Rehab spray perfume from UAE/Saudi Arabia/Yemen High Quality',
		price: 30,
		discountPercentage: 10.99,
		rating: 4.7,
		stock: 105,
		brand: 'Lord - Al-Rehab',
		category: 'fragrances',
		thumbnail: 'https://sample.com/data/products/15/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/15/1.jpg',
			'https://sample.com/data/products/15/2.jpg',
			'https://sample.com/data/products/15/3.jpg',
			'https://sample.com/data/products/15/4.jpg',
			'https://sample.com/data/products/15/thumbnail.jpg',
		],
	},
	{
		id: 16,
		title: 'Hyaluronic Acid Serum',
		description:
			"L'Oréal Paris introduces Hyaluron Expert Replumping Serum formulated with 1.5% Hyaluronic Acid",
		price: 19,
		discountPercentage: 13.31,
		rating: 4.83,
		stock: 110,
		brand: "L'Oreal Paris",
		category: 'skincare',
		thumbnail: 'https://sample.com/data/products/16/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/16/1.png',
			'https://sample.com/data/products/16/2.webp',
			'https://sample.com/data/products/16/3.jpg',
			'https://sample.com/data/products/16/4.jpg',
			'https://sample.com/data/products/16/thumbnail.jpg',
		],
	},
	{
		id: 17,
		title: 'Tree Oil 30ml',
		description:
			'Tea tree oil contains a number of compounds, including terpinen-4-ol, that have been shown to kill certain bacteria,',
		price: 12,
		discountPercentage: 4.09,
		rating: 4.52,
		stock: 78,
		brand: 'Hemani Tea',
		category: 'skincare',
		thumbnail: 'https://sample.com/data/products/17/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/17/1.jpg',
			'https://sample.com/data/products/17/2.jpg',
			'https://sample.com/data/products/17/3.jpg',
			'https://sample.com/data/products/17/thumbnail.jpg',
		],
	},
	{
		id: 18,
		title: 'Oil Free Moisturizer 100ml',
		description:
			'Dermive Oil Free Moisturizer with SPF 20 is specifically formulated with ceramides, hyaluronic acid & sunscreen.',
		price: 40,
		discountPercentage: 13.1,
		rating: 4.56,
		stock: 88,
		brand: 'Dermive',
		category: 'skincare',
		thumbnail: 'https://sample.com/data/products/18/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/18/1.jpg',
			'https://sample.com/data/products/18/2.jpg',
			'https://sample.com/data/products/18/3.jpg',
			'https://sample.com/data/products/18/4.jpg',
			'https://sample.com/data/products/18/thumbnail.jpg',
		],
	},
	{
		id: 19,
		title: 'Skin Beauty Serum.',
		description:
			'Product name: rorec collagen hyaluronic acid white face serum riceNet weight: 15 m',
		price: 46,
		discountPercentage: 10.68,
		rating: 4.42,
		stock: 54,
		brand: 'ROREC White Rice',
		category: 'skincare',
		thumbnail: 'https://sample.com/data/products/19/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/19/1.jpg',
			'https://sample.com/data/products/19/2.jpg',
			'https://sample.com/data/products/19/3.png',
			'https://sample.com/data/products/19/thumbnail.jpg',
		],
	},
	{
		id: 20,
		title: 'Freckle Treatment Cream- 15gm',
		description:
			"Fair & Clear is Pakistan's only pure Freckle cream which helpsfade Freckles, Darkspots and pigments. Mercury level is 0%, so there are no side effects.",
		price: 70,
		discountPercentage: 16.99,
		rating: 4.06,
		stock: 140,
		brand: 'Fair & Clear',
		category: 'skincare',
		thumbnail: 'https://sample.com/data/products/20/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/20/1.jpg',
			'https://sample.com/data/products/20/2.jpg',
			'https://sample.com/data/products/20/3.jpg',
			'https://sample.com/data/products/20/4.jpg',
			'https://sample.com/data/products/20/thumbnail.jpg',
		],
	},
	{
		id: 21,
		title: '- Daal Masoor 500 grams',
		description: 'Fine quality Branded Product Keep in a cool and dry place',
		price: 20,
		discountPercentage: 4.81,
		rating: 4.44,
		stock: 133,
		brand: 'Saaf & Khaas',
		category: 'groceries',
		thumbnail: 'https://sample.com/data/products/21/thumbnail.png',
		images: [
			'https://sample.com/data/products/21/1.png',
			'https://sample.com/data/products/21/2.jpg',
			'https://sample.com/data/products/21/3.jpg',
		],
	},
	{
		id: 22,
		title: 'Elbow Macaroni - 400 gm',
		description: 'Product details of Bake Parlor Big Elbow Macaroni - 400 gm',
		price: 14,
		discountPercentage: 15.58,
		rating: 4.57,
		stock: 146,
		brand: 'Bake Parlor Big',
		category: 'groceries',
		thumbnail: 'https://sample.com/data/products/22/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/22/1.jpg',
			'https://sample.com/data/products/22/2.jpg',
			'https://sample.com/data/products/22/3.jpg',
		],
	},
	{
		id: 23,
		title: 'Orange Essence Food Flavou',
		description:
			'Specifications of Orange Essence Food Flavour For Cakes and Baking Food Item',
		price: 14,
		discountPercentage: 8.04,
		rating: 4.85,
		stock: 26,
		brand: 'Baking Food Items',
		category: 'groceries',
		thumbnail: 'https://sample.com/data/products/23/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/23/1.jpg',
			'https://sample.com/data/products/23/2.jpg',
			'https://sample.com/data/products/23/3.jpg',
			'https://sample.com/data/products/23/4.jpg',
			'https://sample.com/data/products/23/thumbnail.jpg',
		],
	},
	{
		id: 24,
		title: 'cereals muesli fruit nuts',
		description:
			'original fauji cereal muesli 250gm box pack original fauji cereals muesli fruit nuts flakes breakfast cereal break fast faujicereals cerels cerel foji fouji',
		price: 46,
		discountPercentage: 16.8,
		rating: 4.94,
		stock: 113,
		brand: 'fauji',
		category: 'groceries',
		thumbnail: 'https://sample.com/data/products/24/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/24/1.jpg',
			'https://sample.com/data/products/24/2.jpg',
			'https://sample.com/data/products/24/3.jpg',
			'https://sample.com/data/products/24/4.jpg',
			'https://sample.com/data/products/24/thumbnail.jpg',
		],
	},
	{
		id: 25,
		title: 'Gulab Powder 50 Gram',
		description: 'Dry Rose Flower Powder Gulab Powder 50 Gram • Treats Wounds',
		price: 70,
		discountPercentage: 13.58,
		rating: 4.87,
		stock: 47,
		brand: 'Dry Rose',
		category: 'groceries',
		thumbnail: 'https://sample.com/data/products/25/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/25/1.png',
			'https://sample.com/data/products/25/2.jpg',
			'https://sample.com/data/products/25/3.png',
			'https://sample.com/data/products/25/4.jpg',
			'https://sample.com/data/products/25/thumbnail.jpg',
		],
	},
	{
		id: 26,
		title: 'Plant Hanger For Home',
		description:
			'Boho Decor Plant Hanger For Home Wall Decoration Macrame Wall Hanging Shelf',
		price: 41,
		discountPercentage: 17.86,
		rating: 4.08,
		stock: 131,
		brand: 'Boho Decor',
		category: 'home-decoration',
		thumbnail: 'https://sample.com/data/products/26/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/26/1.jpg',
			'https://sample.com/data/products/26/2.jpg',
			'https://sample.com/data/products/26/3.jpg',
			'https://sample.com/data/products/26/4.jpg',
			'https://sample.com/data/products/26/5.jpg',
			'https://sample.com/data/products/26/thumbnail.jpg',
		],
	},
	{
		id: 27,
		title: 'Flying Wooden Bird',
		description:
			'Package Include 6 Birds with Adhesive Tape Shape: 3D Shaped Wooden Birds Material: Wooden MDF, Laminated 3.5mm',
		price: 51,
		discountPercentage: 15.58,
		rating: 4.41,
		stock: 17,
		brand: 'Flying Wooden',
		category: 'home-decoration',
		thumbnail: 'https://sample.com/data/products/27/thumbnail.webp',
		images: [
			'https://sample.com/data/products/27/1.jpg',
			'https://sample.com/data/products/27/2.jpg',
			'https://sample.com/data/products/27/3.jpg',
			'https://sample.com/data/products/27/4.jpg',
			'https://sample.com/data/products/27/thumbnail.webp',
		],
	},
	{
		id: 28,
		title: '3D Embellishment Art Lamp',
		description:
			'3D led lamp sticker Wall sticker 3d wall art light on/off button  cell operated (included)',
		price: 20,
		discountPercentage: 16.49,
		rating: 4.82,
		stock: 54,
		brand: 'LED Lights',
		category: 'home-decoration',
		thumbnail: 'https://sample.com/data/products/28/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/28/1.jpg',
			'https://sample.com/data/products/28/2.jpg',
			'https://sample.com/data/products/28/3.png',
			'https://sample.com/data/products/28/4.jpg',
			'https://sample.com/data/products/28/thumbnail.jpg',
		],
	},
	{
		id: 29,
		title: 'Handcraft Chinese style',
		description:
			'Handcraft Chinese style art luxury palace hotel villa mansion home decor ceramic vase with brass fruit plate',
		price: 60,
		discountPercentage: 15.34,
		rating: 4.44,
		stock: 7,
		brand: 'luxury palace',
		category: 'home-decoration',
		thumbnail: 'https://sample.com/data/products/29/thumbnail.webp',
		images: [
			'https://sample.com/data/products/29/1.jpg',
			'https://sample.com/data/products/29/2.jpg',
			'https://sample.com/data/products/29/3.webp',
			'https://sample.com/data/products/29/4.webp',
			'https://sample.com/data/products/29/thumbnail.webp',
		],
	},
	{
		id: 30,
		title: 'Key Holder',
		description:
			'Attractive DesignMetallic materialFour key hooksReliable & DurablePremium Quality',
		price: 30,
		discountPercentage: 2.92,
		rating: 4.92,
		stock: 54,
		brand: 'Golden',
		category: 'home-decoration',
		thumbnail: 'https://sample.com/data/products/30/thumbnail.jpg',
		images: [
			'https://sample.com/data/products/30/1.jpg',
			'https://sample.com/data/products/30/2.jpg',
			'https://sample.com/data/products/30/3.jpg',
			'https://sample.com/data/products/30/thumbnail.jpg',
		],
	},
];

const users = [
	{
		id: 1,
		firstName: 'Terry',
		lastName: 'Medhurst',
		maidenName: 'Smitham',
		age: 50,
		gender: 'male',
		email: '[email protected]',
		phone: '+63 791 675 8914',
		username: 'atuny0',
		password: '9uQFF1Lh',
		birthDate: '2000-12-25',
		image: 'https://robohash.org/hicveldicta.png',
		bloodGroup: 'A−',
		height: 189,
		weight: 75.4,
		eyeColor: 'Green',
		hair: {
			color: 'Black',
			type: 'Strands',
		},
		domain: 'slashdot.org',
		ip: '117.29.86.254',
		address: {
			address: '1745 T Street Southeast',
			city: 'Washington',
			coordinates: {
				lat: 38.867033,
				lng: -76.979235,
			},
			postalCode: '20020',
			state: 'DC',
		},
		macAddress: '13:69:BA:56:A3:74',
		university: 'Capitol University',
		bank: {
			cardExpire: '06/22',
			cardNumber: '50380955204220685',
			cardType: 'maestro',
			currency: 'Peso',
			iban: 'NO17 0695 2754 967',
		},
		company: {
			address: {
				address: '629 Debbie Drive',
				city: 'Nashville',
				coordinates: {
					lat: 36.208114,
					lng: -86.58621199999999,
				},
				postalCode: '37076',
				state: 'TN',
			},
			department: 'Marketing',
			name: "Blanda-O'Keefe",
			title: 'Help Desk Operator',
		},
		ein: '20-9487066',
		ssn: '661-64-2976',
		userAgent:
			'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/12.0.702.0 Safari/534.24',
	},
	{
		id: 2,
		firstName: 'Sheldon',
		lastName: 'Quigley',
		maidenName: 'Cole',
		age: 28,
		gender: 'male',
		email: '[email protected]',
		phone: '+7 813 117 7139',
		username: 'hbingley1',
		password: 'CQutx25i8r',
		birthDate: '2003-08-02',
		image: 'https://robohash.org/doloremquesintcorrupti.png',
		bloodGroup: 'O+',
		height: 187,
		weight: 74,
		eyeColor: 'Brown',
		hair: {
			color: 'Blond',
			type: 'Curly',
		},
		domain: '51.la',
		ip: '253.240.20.181',
		address: {
			address: '6007 Applegate Lane',
			city: 'Louisville',
			coordinates: {
				lat: 38.1343013,
				lng: -85.6498512,
			},
			postalCode: '40219',
			state: 'KY',
		},
		macAddress: '13:F1:00:DA:A4:12',
		university: 'Stavropol State Technical University',
		bank: {
			cardExpire: '10/23',
			cardNumber: '5355920631952404',
			cardType: 'mastercard',
			currency: 'Ruble',
			iban: 'MD63 L6YC 8YH4 QVQB XHIK MTML',
		},
		company: {
			address: {
				address: '8821 West Myrtle Avenue',
				city: 'Glendale',
				coordinates: {
					lat: 33.5404296,
					lng: -112.2488391,
				},
				postalCode: '85305',
				state: 'AZ',
			},
			department: 'Services',
			name: 'Aufderhar-Cronin',
			title: 'Senior Cost Accountant',
		},
		ein: '52-5262907',
		ssn: '447-08-9217',
		userAgent:
			'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/534.30 (KHTML, like Gecko) Ubuntu/11.04 Chromium/12.0.742.112 Chrome/12.0.742.112 Safari/534.30',
	},
	{
		id: 3,
		firstName: 'Terrill',
		lastName: 'Hills',
		maidenName: 'Hoeger',
		age: 38,
		gender: 'male',
		email: '[email protected]',
		phone: '+63 739 292 7942',
		username: 'rshawe2',
		password: 'OWsTbMUgFc',
		birthDate: '1992-12-30',
		image: 'https://robohash.org/consequunturautconsequatur.png',
		bloodGroup: 'A−',
		height: 200,
		weight: 105.3,
		eyeColor: 'Gray',
		hair: {
			color: 'Blond',
			type: 'Very curly',
		},
		domain: 'earthlink.net',
		ip: '205.226.160.3',
		address: {
			address: '560 Penstock Drive',
			city: 'Grass Valley',
			coordinates: {
				lat: 39.213076,
				lng: -121.077583,
			},
			postalCode: '95945',
			state: 'CA',
		},
		macAddress: 'F2:88:58:64:F7:76',
		university: 'University of Cagayan Valley',
		bank: {
			cardExpire: '10/23',
			cardNumber: '3586082982526703',
			cardType: 'jcb',
			currency: 'Peso',
			iban: 'AT24 1095 9625 1434 9703',
		},
		company: {
			address: {
				address: '18 Densmore Drive',
				city: 'Essex',
				coordinates: {
					lat: 44.492953,
					lng: -73.101883,
				},
				postalCode: '05452',
				state: 'VT',
			},
			department: 'Marketing',
			name: 'Lindgren LLC',
			title: 'Mechanical Systems Engineer',
		},
		ein: '48-3951994',
		ssn: '633-89-1926',
		userAgent:
			'Mozilla/5.0 (Windows NT 6.2; Win64; x64; rv:21.0.0) Gecko/20121011 Firefox/21.0.0',
	},
	{
		id: 4,
		firstName: 'Miles',
		lastName: 'Cummerata',
		maidenName: 'Maggio',
		age: 49,
		gender: 'male',
		email: '[email protected]',
		phone: '+86 461 145 4186',
		username: 'yraigatt3',
		password: 'sRQxjPfdS',
		birthDate: '1969-01-16',
		image: 'https://robohash.org/facilisdignissimosdolore.png',
		bloodGroup: 'B+',
		height: 157,
		weight: 95.9,
		eyeColor: 'Gray',
		hair: {
			color: 'Blond',
			type: 'Very curly',
		},
		domain: 'homestead.com',
		ip: '243.20.78.113',
		address: {
			address: '150 Carter Street',
			city: 'Manchester',
			coordinates: {
				lat: 41.76556000000001,
				lng: -72.473091,
			},
			postalCode: '06040',
			state: 'CT',
		},
		macAddress: '03:45:58:59:5A:7B',
		university: 'Shenyang Pharmaceutical University',
		bank: {
			cardExpire: '07/24',
			cardNumber: '3580047879369323',
			cardType: 'jcb',
			currency: 'Yuan Renminbi',
			iban: 'KZ43 658B M6VS TZOU OXSO',
		},
		company: {
			address: {
				address: '210 Green Road',
				city: 'Manchester',
				coordinates: {
					lat: 41.7909099,
					lng: -72.51195129999999,
				},
				postalCode: '06042',
				state: 'CT',
			},
			department: 'Business Development',
			name: 'Wolff and Sons',
			title: 'Paralegal',
		},
		ein: '71-3644334',
		ssn: '487-28-6642',
		userAgent:
			'Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.17 Safari/537.11',
	},
	{
		id: 5,
		firstName: 'Mavis',
		lastName: 'Schultz',
		maidenName: 'Yundt',
		age: 38,
		gender: 'male',
		email: '[email protected]',
		phone: '+372 285 771 1911',
		username: 'kmeus4',
		password: 'aUTdmmmbH',
		birthDate: '1968-11-03',
		image: 'https://robohash.org/adverovelit.png',
		bloodGroup: 'O+',
		height: 188,
		weight: 106.3,
		eyeColor: 'Brown',
		hair: {
			color: 'Brown',
			type: 'Curly',
		},
		domain: 'columbia.edu',
		ip: '103.72.86.183',
		address: {
			address: '2721 Lindsay Avenue',
			city: 'Louisville',
			coordinates: {
				lat: 38.263793,
				lng: -85.700243,
			},
			postalCode: '40206',
			state: 'KY',
		},
		macAddress: 'F8:04:9E:ED:C0:68',
		university: 'Estonian University of Life Sciences',
		bank: {
			cardExpire: '01/24',
			cardNumber: '4917245076693618',
			cardType: 'visa-electron',
			currency: 'Euro',
			iban: 'IT41 T114 5127 716J RGYB ZRUX DSJ',
		},
		company: {
			address: {
				address: '8398 West Denton Lane',
				city: 'Glendale',
				coordinates: {
					lat: 33.515353,
					lng: -112.240812,
				},
				postalCode: '85305',
				state: 'AZ',
			},
			department: 'Support',
			name: 'Adams Inc',
			title: 'Web Developer I',
		},
		ein: '18-7178563',
		ssn: '667-98-5357',
		userAgent:
			'Mozilla/5.0 (Windows NT 6.0) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/13.0.782.1 Safari/535.1',
	},
	{
		id: 6,
		firstName: 'Alison',
		lastName: 'Reichert',
		maidenName: 'Franecki',
		age: 21,
		gender: 'female',
		email: '[email protected]',
		phone: '+351 527 735 3642',
		username: 'jtreleven5',
		password: 'zY1nE46Zm',
		birthDate: '1969-07-21',
		image: 'https://robohash.org/laboriosamfacilisrem.png',
		bloodGroup: 'A+',
		height: 149,
		weight: 105.7,
		eyeColor: 'Amber',
		hair: {
			color: 'Blond',
			type: 'Straight',
		},
		domain: 'bandcamp.com',
		ip: '49.201.206.36',
		address: {
			address: '18 Densmore Drive',
			city: 'Essex',
			coordinates: {
				lat: 44.492953,
				lng: -73.101883,
			},
			postalCode: '05452',
			state: 'VT',
		},
		macAddress: '6C:34:D0:4B:4E:81',
		university: 'Universidade da Beira Interior',
		bank: {
			cardExpire: '03/22',
			cardNumber: '345675888286047',
			cardType: 'americanexpress',
			currency: 'Euro',
			iban: 'LB69 1062 QCY5 XS5T VOKU KJFG XP4S',
		},
		company: {
			address: {
				address: '6231 North 67th Avenue',
				city: 'Glendale',
				coordinates: {
					lat: 33.5279666,
					lng: -112.2022551,
				},
				postalCode: '85301',
				state: 'AZ',
			},
			department: 'Accounting',
			name: "D'Amore and Sons",
			title: 'Civil Engineer',
		},
		ein: '78-3192791',
		ssn: '158-68-0184',
		userAgent:
			'Mozilla/5.0 (Windows; U; Windows NT 6.0; nb-NO) AppleWebKit/533.18.1 (KHTML, like Gecko) Version/5.0.2 Safari/533.18.5',
	},
	{
		id: 7,
		firstName: 'Oleta',
		lastName: 'Abbott',
		maidenName: 'Wyman',
		age: 31,
		gender: 'female',
		email: '[email protected]',
		phone: '+62 640 802 7111',
		username: 'dpettegre6',
		password: 'YVmhktgYVS',
		birthDate: '1982-02-21',
		image: 'https://robohash.org/cupiditatererumquos.png',
		bloodGroup: 'B−',
		height: 172,
		weight: 78.1,
		eyeColor: 'Blue',
		hair: {
			color: 'Chestnut',
			type: 'Wavy',
		},
		domain: 'ovh.net',
		ip: '25.207.107.146',
		address: {
			address: '637 Britannia Drive',
			city: 'Vallejo',
			coordinates: {
				lat: 38.10476999999999,
				lng: -122.193849,
			},
			postalCode: '94591',
			state: 'CA',
		},
		macAddress: '48:2D:A0:67:19:E0',
		university: 'Institut Sains dan Teknologi Al Kamal',
		bank: {
			cardExpire: '10/23',
			cardNumber: '3589640949470047',
			cardType: 'jcb',
			currency: 'Rupiah',
			iban: 'GI97 IKPF 9DUO X25M FG8D UXY',
		},
		company: {
			address: {
				address: '1407 Walden Court',
				city: 'Crofton',
				coordinates: {
					lat: 39.019306,
					lng: -76.660653,
				},
				postalCode: '21114',
				state: 'MD',
			},
			department: 'Product Management',
			name: 'Schimmel, Wilderman and Orn',
			title: 'Sales Associate',
		},
		ein: '29-1568401',
		ssn: '478-11-2206',
		userAgent:
			'Mozilla/5.0 (Windows; U; Windows NT 5.1; ru-RU) AppleWebKit/533.18.1 (KHTML, like Gecko) Version/5.0.2 Safari/533.18.5',
	},
	{
		id: 8,
		firstName: 'Ewell',
		lastName: 'Mueller',
		maidenName: 'Durgan',
		age: 29,
		gender: 'male',
		email: '[email protected]',
		phone: '+86 946 297 2275',
		username: 'ggude7',
		password: 'MWwlaeWcOoF6',
		birthDate: '1964-08-24',
		image: 'https://robohash.org/quiaharumsapiente.png',
		bloodGroup: 'A−',
		height: 146,
		weight: 52.1,
		eyeColor: 'Blue',
		hair: {
			color: 'Chestnut',
			type: 'Wavy',
		},
		domain: 'homestead.com',
		ip: '91.200.56.127',
		address: {
			address: '5601 West Crocus Drive',
			city: 'Glendale',
			coordinates: {
				lat: 33.6152469,
				lng: -112.179737,
			},
			postalCode: '85306',
			state: 'AZ',
		},
		macAddress: '72:DA:1B:D7:30:E9',
		university: 'Wenzhou Medical College',
		bank: {
			cardExpire: '09/23',
			cardNumber: '30549925358905',
			cardType: 'diners-club-carte-blanche',
			currency: 'Yuan Renminbi',
			iban: 'CY02 9914 5346 0PMT G6XW TP0R AWRZ',
		},
		company: {
			address: {
				address: '81 Seaton Place Northwest',
				city: 'Washington',
				coordinates: {
					lat: 38.9149499,
					lng: -77.01170259999999,
				},
				postalCode: '20001',
				state: 'DC',
			},
			department: 'Services',
			name: 'Corkery, Reichert and Hodkiewicz',
			title: 'Clinical Specialist',
		},
		ein: '88-4396827',
		ssn: '238-41-5528',
		userAgent:
			'Mozilla/5.0 (X11; Linux amd64) AppleWebKit/534.36 (KHTML, like Gecko) Chrome/13.0.766.0 Safari/534.36',
	},
	{
		id: 9,
		firstName: 'Demetrius',
		lastName: 'Corkery',
		maidenName: 'Gleason',
		age: 22,
		gender: 'male',
		email: '[email protected]',
		phone: '+86 356 590 9727',
		username: 'nloiterton8',
		password: 'HTQxxXV9Bq4',
		birthDate: '1971-03-11',
		image: 'https://robohash.org/excepturiiuremolestiae.png',
		bloodGroup: 'A+',
		height: 170,
		weight: 97.1,
		eyeColor: 'Green',
		hair: {
			color: 'Brown',
			type: 'Strands',
		},
		domain: 'goodreads.com',
		ip: '78.170.185.120',
		address: {
			address: '5403 Illinois Avenue',
			city: 'Nashville',
			coordinates: {
				lat: 36.157077,
				lng: -86.853827,
			},
			postalCode: '37209',
			state: 'TN',
		},
		macAddress: '98:EE:94:A2:91:C4',
		university: 'Nanjing University of Economics',
		bank: {
			cardExpire: '02/24',
			cardNumber: '5372664789004621',
			cardType: 'mastercard',
			currency: 'Yuan Renminbi',
			iban: 'BR68 9829 0581 3669 5088 5533 025N V',
		},
		company: {
			address: {
				address: '12245 West 71st Place',
				city: 'Arvada',
				coordinates: {
					lat: 39.8267078,
					lng: -105.1366798,
				},
				postalCode: '80004',
				state: 'CO',
			},
			department: 'Human Resources',
			name: 'Gorczany Group',
			title: 'Community Outreach Specialist',
		},
		ein: '14-1066382',
		ssn: '717-26-3759',
		userAgent:
			'Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10_4_11; de) AppleWebKit/528.4+ (KHTML, like Gecko) Version/4.0dp1 Safari/526.11.2',
	},
	{
		id: 10,
		firstName: 'Eleanora',
		lastName: 'Price',
		maidenName: 'Cummings',
		age: 37,
		gender: 'female',
		email: '[email protected]',
		phone: '+60 184 408 0824',
		username: 'umcgourty9',
		password: 'i0xzpX',
		birthDate: '1958-08-11',
		image: 'https://robohash.org/aliquamcumqueiure.png',
		bloodGroup: 'O+',
		height: 198,
		weight: 48,
		eyeColor: 'Blue',
		hair: {
			color: 'Chestnut',
			type: 'Wavy',
		},
		domain: 'alibaba.com',
		ip: '73.15.179.178',
		address: {
			address: '8821 West Myrtle Avenue',
			city: 'Glendale',
			coordinates: {
				lat: 33.5404296,
				lng: -112.2488391,
			},
			postalCode: '85305',
			state: 'AZ',
		},
		macAddress: 'BC:A9:D8:98:CB:0B',
		university: 'Melaka City Polytechnic',
		bank: {
			cardExpire: '01/24',
			cardNumber: '3557806620295254',
			cardType: 'jcb',
			currency: 'Ringgit',
			iban: 'GT40 DWAD 9UHA VEOZ ZF4J 2Y0F OOFD',
		},
		company: {
			address: {
				address: '1649 Timberridge Court',
				city: 'Fayetteville',
				coordinates: {
					lat: 36.084563,
					lng: -94.206082,
				},
				postalCode: '72704',
				state: 'AR',
			},
			department: 'Marketing',
			name: 'Bins Group',
			title: 'Senior Sales Associate',
		},
		ein: '21-5278484',
		ssn: '544-66-0745',
		userAgent:
			'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.6 Safari/537.11',
	},
	{
		id: 11,
		firstName: 'Marcel',
		lastName: 'Jones',
		maidenName: 'Smith',
		age: 39,
		gender: 'male',
		email: '[email protected]',
		phone: '+967 253 210 0344',
		username: 'acharlota',
		password: 'M9lbMdydMN',
		birthDate: '1961-09-12',
		image: 'https://robohash.org/impeditautest.png',
		bloodGroup: 'B−',
		height: 203,
		weight: 63.7,
		eyeColor: 'Amber',
		hair: {
			color: 'Black',
			type: 'Straight',
		},
		domain: 'feedburner.com',
		ip: '137.235.164.173',
		address: {
			address: '2203 7th Street Road',
			city: 'Louisville',
			coordinates: {
				lat: 38.218107,
				lng: -85.779006,
			},
			postalCode: '40208',
			state: 'KY',
		},
		macAddress: '59:E8:70:5A:E5:D6',
		university: 'Hodeidah University',
		bank: {
			cardExpire: '05/24',
			cardNumber: '5893925889459720',
			cardType: 'maestro',
			currency: 'Rial',
			iban: 'NL97 UWMY 2503 2999 43',
		},
		company: {
			address: {
				address: '308 Woodleaf Court',
				city: 'Glen Burnie',
				coordinates: {
					lat: 39.1425931,
					lng: -76.6238441,
				},
				postalCode: '21061',
				state: 'MD',
			},
			department: 'Business Development',
			name: 'Kuhn-Harber',
			title: 'Account Executive',
		},
		ein: '09-3791007',
		ssn: '342-54-8422',
		userAgent:
			'Mozilla/5.0 (Windows NT 5.2) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.792.0 Safari/535.1',
	},
	{
		id: 12,
		firstName: 'Assunta',
		lastName: 'Rath',
		maidenName: 'Heller',
		age: 42,
		gender: 'female',
		email: '[email protected]',
		phone: '+380 962 542 6549',
		username: 'rhallawellb',
		password: 'esTkitT1r',
		birthDate: '1990-12-14',
		image: 'https://robohash.org/namquaerataut.png',
		bloodGroup: 'O−',
		height: 168,
		weight: 96.8,
		eyeColor: 'Gray',
		hair: {
			color: 'Black',
			type: 'Very curly',
		},
		domain: '123-reg.co.uk',
		ip: '74.80.53.208',
		address: {
			address: '6463 Vrain Street',
			city: 'Arvada',
			coordinates: {
				lat: 39.814056,
				lng: -105.046913,
			},
			postalCode: '80003',
			state: 'CO',
		},
		macAddress: '9B:DC:21:C2:30:A3',
		university: 'Kiev Slavonic University',
		bank: {
			cardExpire: '09/22',
			cardNumber: '5602230671060360',
			cardType: 'bankcard',
			currency: 'Hryvnia',
			iban: 'KW76 VNLA LX0Y DMDE PFS8 FVKP VMDF AV',
		},
		company: {
			address: {
				address: '388 East Main Street',
				coordinates: {
					lat: 43.9727945,
					lng: -73.1023187,
				},
				postalCode: '05753',
				state: 'VT',
			},
			department: 'Product Management',
			name: 'Goodwin-Skiles',
			title: 'Developer II',
		},
		ein: '14-1242349',
		ssn: '116-51-6131',
		userAgent:
			'Mozilla/5.0 (X11; CrOS i686 4319.74.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.57 Safari/537.36',
	},
	{
		id: 13,
		firstName: 'Trace',
		lastName: 'Douglas',
		maidenName: 'Lemke',
		age: 26,
		gender: 'male',
		email: '[email protected]',
		phone: '+1 609 937 3468',
		username: 'lgribbinc',
		password: 'ftGj8LZTtv9g',
		birthDate: '1967-07-23',
		image: 'https://robohash.org/voluptatemsintnulla.png',
		bloodGroup: 'O+',
		height: 181,
		weight: 56.5,
		eyeColor: 'Amber',
		hair: {
			color: 'Auburn',
			type: 'Straight',
		},
		domain: 'histats.com',
		ip: '163.245.232.27',
		address: {
			address: '87 Horseshoe Drive',
			city: 'West Windsor',
			coordinates: {
				lat: 43.4731793,
				lng: -72.4967532,
			},
			postalCode: '05037',
			state: 'VT',
		},
		macAddress: 'B9:21:ED:9F:B8:9E',
		university: 'Dallas Christian College',
		bank: {
			cardExpire: '01/23',
			cardNumber: '3556299106119514',
			cardType: 'jcb',
			currency: 'Dollar',
			iban: 'AE47 4194 4544 3401 3419 286',
		},
		company: {
			address: {
				address: '310 Timrod Road',
				city: 'Manchester',
				coordinates: {
					lat: 41.756758,
					lng: -72.493501,
				},
				postalCode: '06040',
				state: 'CT',
			},
			department: 'Research and Development',
			name: 'Casper Inc',
			title: 'Sales Associate',
		},
		ein: '94-0648182',
		ssn: '217-05-3082',
		userAgent:
			'Mozilla/5.0 (Windows; U; Windows NT 5.1; ru-RU) AppleWebKit/533.19.4 (KHTML, like Gecko) Version/5.0.3 Safari/533.19.4',
	},
	{
		id: 14,
		firstName: 'Enoch',
		lastName: 'Lynch',
		maidenName: 'Heidenreich',
		age: 21,
		gender: 'male',
		email: '[email protected]',
		phone: '+94 912 100 5118',
		username: 'mturleyd',
		password: 'GyLnCB8gNIp',
		birthDate: '1979-08-25',
		image: 'https://robohash.org/quisequienim.png',
		bloodGroup: 'O+',
		height: 150,
		weight: 100.3,
		eyeColor: 'Green',
		hair: {
			color: 'Auburn',
			type: 'Strands',
		},
		domain: 'icio.us',
		ip: '174.238.43.126',
		address: {
			address: '60 Desousa Drive',
			city: 'Manchester',
			coordinates: {
				lat: 41.7409259,
				lng: -72.5619104,
			},
			postalCode: '06040',
			state: 'CT',
		},
		macAddress: '52:11:E1:31:35:C1',
		university: 'University of Sri Jayawardenapura',
		bank: {
			cardExpire: '11/23',
			cardNumber: '5339467937996728',
			cardType: 'mastercard',
			currency: 'Rupee',
			iban: 'SI28 0812 7967 0952 944',
		},
		company: {
			address: {
				address: '21950 Arnold Center Road',
				city: 'Carson',
				coordinates: {
					lat: 33.8272706,
					lng: -118.2302826,
				},
				postalCode: '90810',
				state: 'CA',
			},
			department: 'Sales',
			name: 'Schoen Inc',
			title: 'Professor',
		},
		ein: '61-8316825',
		ssn: '742-81-1714',
		userAgent:
			'Mozilla/5.0 (Windows; U; Windows NT 5.0; en-en) AppleWebKit/533.16 (KHTML, like Gecko) Version/4.1 Safari/533.16',
	},
	{
		id: 15,
		firstName: 'Jeanne',
		lastName: 'Halvorson',
		maidenName: 'Cummerata',
		age: 26,
		gender: 'female',
		email: '[email protected]',
		phone: '+86 581 108 7855',
		username: 'kminchelle',
		password: '0lelplR',
		birthDate: '1996-02-02',
		image: 'https://robohash.org/autquiaut.png',
		bloodGroup: 'A+',
		height: 176,
		weight: 45.7,
		eyeColor: 'Amber',
		hair: {
			color: 'Blond',
			type: 'Straight',
		},
		domain: 'google.co.uk',
		ip: '78.43.74.226',
		address: {
			address: '4 Old Colony Way',
			city: 'Yarmouth',
			coordinates: {
				lat: 41.697168,
				lng: -70.189992,
			},
			postalCode: '02664',
			state: 'MA',
		},
		macAddress: 'D9:DB:D9:5A:01:09',
		university: 'Donghua University, Shanghai',
		bank: {
			cardExpire: '10/23',
			cardNumber: '3588859507772914',
			cardType: 'jcb',
			currency: 'Yuan Renminbi',
			iban: 'FO12 1440 0396 8902 56',
		},
		company: {
			address: {
				address: '22572 Toreador Drive',
				city: 'Salinas',
				coordinates: {
					lat: 36.602449,
					lng: -121.699071,
				},
				postalCode: '93908',
				state: 'CA',
			},
			department: 'Marketing',
			name: 'Hahn-MacGyver',
			title: 'Software Test Engineer IV',
		},
		ein: '62-0561095',
		ssn: '855-43-8639',
		userAgent:
			'Mozilla/5.0 (X11; Linux i686) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/11.0.696.14 Safari/534.24',
	},
	{
		id: 16,
		firstName: 'Trycia',
		lastName: 'Fadel',
		maidenName: 'Rosenbaum',
		age: 41,
		gender: 'female',
		email: '[email protected]',
		phone: '+420 833 708 0340',
		username: 'dpierrof',
		password: 'Vru55Y4tufI4',
		birthDate: '1963-07-03',
		image: 'https://robohash.org/porronumquamid.png',
		bloodGroup: 'B+',
		height: 166,
		weight: 87.2,
		eyeColor: 'Gray',
		hair: {
			color: 'Black',
			type: 'Very curly',
		},
		domain: 'tamu.edu',
		ip: '82.170.69.15',
		address: {
			address: '314 South 17th Street',
			city: 'Nashville',
			coordinates: {
				lat: 36.1719075,
				lng: -86.740228,
			},
			postalCode: '37206',
			state: 'TN',
		},
		macAddress: '3D:21:5B:9F:76:FF',
		university: 'Technical University of Mining and Metallurgy Ostrava',
		bank: {
			cardExpire: '07/23',
			cardNumber: '6378941710246212',
			cardType: 'instapayment',
			currency: 'Koruna',
			iban: 'CH94 4961 5QY1 VPV1 NGIP P',
		},
		company: {
			address: {
				address: '1407 Walden Court',
				city: 'Crofton',
				coordinates: {
					lat: 39.019306,
					lng: -76.660653,
				},
				postalCode: '21114',
				state: 'MD',
			},
			department: 'Research and Development',
			name: 'Steuber, Considine and Padberg',
			title: 'Geological Engineer',
		},
		ein: '75-1816504',
		ssn: '677-73-1525',
		userAgent:
			'Mozilla/5.0 (Windows NT 5.1) AppleWebKit/535.2 (KHTML, like Gecko) Chrome/15.0.872.0 Safari/535.2',
	},
	{
		id: 17,
		firstName: 'Bradford',
		lastName: 'Prohaska',
		maidenName: 'Bins',
		age: 43,
		gender: 'male',
		email: '[email protected]',
		phone: '+420 874 628 3710',
		username: 'vcholdcroftg',
		password: 'mSPzYZfR',
		birthDate: '1975-10-20',
		image: 'https://robohash.org/accusantiumvoluptateseos.png',
		bloodGroup: 'O−',
		height: 199,
		weight: 94.3,
		eyeColor: 'Brown',
		hair: {
			color: 'Black',
			type: 'Curly',
		},
		domain: 'wix.com',
		ip: '75.75.234.243',
		address: {
			address: '1649 Timberridge Court',
			city: 'Fayetteville',
			coordinates: {
				lat: 36.084563,
				lng: -94.206082,
			},
			postalCode: '72704',
			state: 'AR',
		},
		macAddress: '47:FA:F7:94:7B:5D',
		university: 'Technical University of Mining and Metallurgy Ostrava',
		bank: {
			cardExpire: '05/24',
			cardNumber: '3574627048005672',
			cardType: 'jcb',
			currency: 'Koruna',
			iban: 'SI81 7221 0344 9088 864',
		},
		company: {
			address: {
				address: '20930 Todd Valley Road',
				city: 'Foresthill',
				coordinates: {
					lat: 38.989466,
					lng: -120.883108,
				},
				postalCode: '95631',
				state: 'CA',
			},
			department: 'Sales',
			name: 'Bogisich and Sons',
			title: 'Operator',
		},
		ein: '92-8837697',
		ssn: '795-36-7752',
		userAgent:
			'Mozilla/5.0 (Windows NT 5.2) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.813.0 Safari/535.1',
	},
	{
		id: 18,
		firstName: 'Arely',
		lastName: 'Skiles',
		maidenName: 'Monahan',
		age: 42,
		gender: 'male',
		email: '[email protected]',
		phone: '+55 886 766 8617',
		username: 'sberminghamh',
		password: 'cAjfb8vg',
		birthDate: '1958-02-05',
		image: 'https://robohash.org/nihilharumqui.png',
		bloodGroup: 'AB−',
		height: 192,
		weight: 97,
		eyeColor: 'Amber',
		hair: {
			color: 'Brown',
			type: 'Straight',
		},
		domain: 'seesaa.net',
		ip: '29.82.54.30',
		address: {
			address: '5461 West Shades Valley Drive',
			city: 'Montgomery',
			coordinates: {
				lat: 32.296422,
				lng: -86.34280299999999,
			},
			postalCode: '36108',
			state: 'AL',
		},
		macAddress: '61:0C:8F:92:48:D5',
		university: 'Universidade Estadual do Ceará',
		bank: {
			cardExpire: '09/24',
			cardNumber: '3578078357052002',
			cardType: 'jcb',
			currency: 'Real',
			iban: 'FR79 7925 2903 77HF 2ZY6 TU4M T84',
		},
		company: {
			address: {
				address: '3162 Martin Luther King Junior Boulevard',
				city: 'Fayetteville',
				coordinates: {
					lat: 36.05233310000001,
					lng: -94.2056987,
				},
				postalCode: '72704',
				state: 'AR',
			},
			department: 'Support',
			name: 'Metz Group',
			title: 'VP Accounting',
		},
		ein: '55-4062919',
		ssn: '551-74-1349',
		userAgent:
			'Mozilla/5.0 (Windows NT 5.1; rv:31.0) Gecko/20100101 Firefox/31.0',
	},
	{
		id: 19,
		firstName: 'Gust',
		lastName: 'Purdy',
		maidenName: 'Abshire',
		age: 46,
		gender: 'male',
		email: '[email protected]',
		phone: '+86 886 889 0258',
		username: 'bleveragei',
		password: 'UZGAiqPqWQHQ',
		birthDate: '1989-10-15',
		image: 'https://robohash.org/delenitipraesentiumvoluptatum.png',
		bloodGroup: 'A−',
		height: 167,
		weight: 65.3,
		eyeColor: 'Amber',
		hair: {
			color: 'Black',
			type: 'Straight',
		},
		domain: 'homestead.com',
		ip: '90.202.216.39',
		address: {
			address: '629 Debbie Drive',
			city: 'Nashville',
			coordinates: {
				lat: 36.208114,
				lng: -86.58621199999999,
			},
			postalCode: '37076',
			state: 'TN',
		},
		macAddress: '22:98:8D:97:2D:AE',
		university: 'Xinjiang University',
		bank: {
			cardExpire: '05/22',
			cardNumber: '5602214306858976',
			cardType: 'bankcard',
			currency: 'Yuan Renminbi',
			iban: 'GB94 MOIU 1274 8449 9733 05',
		},
		company: {
			address: {
				address: '6463 Vrain Street',
				city: 'Arvada',
				coordinates: {
					lat: 39.814056,
					lng: -105.046913,
				},
				postalCode: '80003',
				state: 'CO',
			},
			department: 'Sales',
			name: 'Bahringer, Auer and Wehner',
			title: 'Financial Analyst',
		},
		ein: '53-7190545',
		ssn: '809-93-2422',
		userAgent:
			'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/11.0.696.3 Safari/534.24',
	},
	{
		id: 20,
		firstName: 'Lenna',
		lastName: 'Renner',
		maidenName: 'Schumm',
		age: 41,
		gender: 'female',
		email: '[email protected]',
		phone: '+1 904 601 7177',
		username: 'aeatockj',
		password: 'szWAG6hc',
		birthDate: '1980-01-19',
		image: 'https://robohash.org/ipsumutofficiis.png',
		bloodGroup: 'O−',
		height: 175,
		weight: 68,
		eyeColor: 'Green',
		hair: {
			color: 'Black',
			type: 'Strands',
		},
		domain: 'sourceforge.net',
		ip: '59.43.194.22',
		address: {
			address: '22572 Toreador Drive',
			city: 'Salinas',
			coordinates: {
				lat: 36.602449,
				lng: -121.699071,
			},
			postalCode: '93908',
			state: 'CA',
		},
		macAddress: 'ED:64:AE:91:49:C9',
		university: 'Moraine Valley Community College',
		bank: {
			cardExpire: '07/22',
			cardNumber: '3565173055875732',
			cardType: 'jcb',
			currency: 'Dollar',
			iban: 'GT39 KL9Z CZYV XF26 UPYW SFPT H74U',
		},
		company: {
			address: {
				address: '491 Arabian Way',
				city: 'Grand Junction',
				coordinates: {
					lat: 39.07548999999999,
					lng: -108.474785,
				},
				postalCode: '81504',
				state: 'CO',
			},
			department: 'Support',
			name: 'Hoppe Group',
			title: 'Geologist III',
		},
		ein: '88-6715551',
		ssn: '389-03-0381',
		userAgent:
			'Mozilla/5.0 (X11; Linux i686) AppleWebKit/534.24 (KHTML, like Gecko) Ubuntu/10.10 Chromium/12.0.702.0 Chrome/12.0.702.0 Safari/534.24',
	},
	{
		id: 21,
		firstName: 'Doyle',
		lastName: 'Ernser',
		maidenName: 'Feeney',
		age: 23,
		gender: 'male',
		email: '[email protected]',
		phone: '+86 634 419 6839',
		username: 'ckensleyk',
		password: 'tq7kPXyf',
		birthDate: '1983-01-22',
		image: 'https://robohash.org/providenttemporadelectus.png',
		bloodGroup: 'A−',
		height: 173,
		weight: 69.9,
		eyeColor: 'Brown',
		hair: {
			color: 'Black',
			type: 'Curly',
		},
		domain: 'free.fr',
		ip: '87.213.156.73',
		address: {
			address: '3034 Mica Street',
			city: 'Fayetteville',
			coordinates: {
				lat: 36.0807929,
				lng: -94.2066449,
			},
			postalCode: '72704',
			state: 'AR',
		},
		macAddress: 'E2:5A:A5:85:9B:6D',
		university: 'Nanjing University of Traditional Chinese Medicine',
		bank: {
			cardExpire: '06/24',
			cardNumber: '30464640811198',
			cardType: 'diners-club-carte-blanche',
			currency: 'Yuan Renminbi',
			iban: 'BE41 7150 0766 2980',
		},
		company: {
			address: {
				address: '5906 Milton Avenue',
				city: 'Deale',
				coordinates: {
					lat: 38.784451,
					lng: -76.54125499999999,
				},
				postalCode: '20751',
				state: 'MD',
			},
			department: 'Product Management',
			name: 'Brekke Group',
			title: 'Programmer Analyst I',
		},
		ein: '23-4116115',
		ssn: '562-46-9709',
		userAgent:
			'Mozilla/5.0 (Windows NT 6.2) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1061.0 Safari/536.3',
	},
	{
		id: 22,
		firstName: 'Tressa',
		lastName: 'Weber',
		maidenName: 'Williamson',
		age: 41,
		gender: 'female',
		email: '[email protected]',
		phone: '+34 517 104 6248',
		username: 'froachel',
		password: 'rfVSKImC',
		birthDate: '1987-11-11',
		image: 'https://robohash.org/temporarecusandaeest.png',
		bloodGroup: 'B−',
		height: 164,
		weight: 87.1,
		eyeColor: 'Green',
		hair: {
			color: 'Black',
			type: 'Strands',
		},
		domain: 'indiatimes.com',
		ip: '71.57.235.192',
		address: {
			address: '3729 East Mission Boulevard',
			city: 'Fayetteville',
			coordinates: {
				lat: 36.0919353,
				lng: -94.10654219999999,
			},
			postalCode: '72703',
			state: 'AR',
		},
		macAddress: 'A4:8B:56:BC:ED:98',
		university: 'Universitat Rámon Llull',
		bank: {
			cardExpire: '12/21',
			cardNumber: '342220243660686',
			cardType: 'americanexpress',
			currency: 'Euro',
			iban: 'CY09 2675 2653 QNEJ JNSA 0E2V ONMM',
		},
		company: {
			address: {
				address: '8800 Cordell Circle',
				city: 'Anchorage',
				coordinates: {
					lat: 61.1409305,
					lng: -149.9437822,
				},
				postalCode: '99502',
				state: 'AK',
			},
			department: 'Research and Development',
			name: 'Durgan Group',
			title: 'VP Quality Control',
		},
		ein: '78-2846180',
		ssn: '155-87-0243',
		userAgent:
			'Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10_4_11; de-de) AppleWebKit/533.16 (KHTML, like Gecko) Version/4.1 Safari/533.16',
	},
	{
		id: 23,
		firstName: 'Felicity',
		lastName: "O'Reilly",
		maidenName: 'Rosenbaum',
		age: 46,
		gender: 'female',
		email: '[email protected]',
		phone: '+63 919 564 1690',
		username: 'beykelhofm',
		password: 'zQwaHTHbuZyr',
		birthDate: '1967-10-05',
		image: 'https://robohash.org/odioquivero.png',
		bloodGroup: 'O−',
		height: 151,
		weight: 96.7,
		eyeColor: 'Brown',
		hair: {
			color: 'Brown',
			type: 'Curly',
		},
		domain: 'tamu.edu',
		ip: '141.14.53.176',
		address: {
			address: '5114 Greentree Drive',
			city: 'Nashville',
			coordinates: {
				lat: 36.0618539,
				lng: -86.738508,
			},
			postalCode: '37211',
			state: 'TN',
		},
		macAddress: '4D:AB:8D:9A:E5:02',
		university: 'University of lloilo',
		bank: {
			cardExpire: '06/22',
			cardNumber: '6333837222395642',
			cardType: 'switch',
			currency: 'Peso',
			iban: 'FR40 3929 7903 26S5 QL9A HUSV Z09',
		},
		company: {
			address: {
				address: '1770 Colony Way',
				city: 'Fayetteville',
				coordinates: {
					lat: 36.0867,
					lng: -94.229754,
				},
				postalCode: '72704',
				state: 'AR',
			},
			department: 'Legal',
			name: 'Romaguera, Williamson and Kessler',
			title: 'Assistant Manager',
		},
		ein: '92-4814248',
		ssn: '441-72-1229',
		userAgent:
			'Mozilla/5.0 (Windows NT 5.1) AppleWebKit/535.2 (KHTML, like Gecko) Chrome/15.0.872.0 Safari/535.2',
	},
	{
		id: 24,
		firstName: 'Jocelyn',
		lastName: 'Schuster',
		maidenName: 'Dooley',
		age: 19,
		gender: 'male',
		email: '[email protected]',
		phone: '+7 968 462 1292',
		username: 'brickeardn',
		password: 'bMQnPttV',
		birthDate: '1966-06-02',
		image: 'https://robohash.org/odiomolestiaealias.png',
		bloodGroup: 'O+',
		height: 166,
		weight: 93.3,
		eyeColor: 'Brown',
		hair: {
			color: 'Brown',
			type: 'Curly',
		},
		domain: 'pen.io',
		ip: '116.92.198.102',
		address: {
			address: '3466 Southview Avenue',
			city: 'Montgomery',
			coordinates: {
				lat: 32.341227,
				lng: -86.2846859,
			},
			postalCode: '36111',
			state: 'AL',
		},
		macAddress: 'AF:AA:20:8E:CA:CD',
		university: 'Bashkir State Medical University',
		bank: {
			cardExpire: '11/21',
			cardNumber: '5007666357943463',
			cardType: 'mastercard',
			currency: 'Ruble',
			iban: 'NL22 YBPM 0101 6695 08',
		},
		company: {
			address: {
				address: '80 North East Street',
				city: 'Holyoke',
				coordinates: {
					lat: 42.2041219,
					lng: -72.5977704,
				},
				postalCode: '01040',
				state: 'MA',
			},
			department: 'Product Management',
			name: 'Wintheiser-Boehm',
			title: 'Research Nurse',
		},
		ein: '77-6259466',
		ssn: '291-72-5526',
		userAgent:
			'Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_6_7; ja-jp) AppleWebKit/533.20.25 (KHTML, like Gecko) Version/5.0.4 Safari/533.20.27',
	},
	{
		id: 25,
		firstName: 'Edwina',
		lastName: 'Ernser',
		maidenName: 'Kiehn',
		age: 21,
		gender: 'female',
		email: '[email protected]',
		phone: '+86 376 986 8945',
		username: 'dfundello',
		password: 'k9zgV68UKw8m',
		birthDate: '2000-09-28',
		image: 'https://robohash.org/doloremautdolores.png',
		bloodGroup: 'O+',
		height: 180,
		weight: 102.1,
		eyeColor: 'Blue',
		hair: {
			color: 'Brown',
			type: 'Wavy',
		},
		domain: 'apple.com',
		ip: '48.30.193.203',
		address: {
			address: '1513 Cathy Street',
			city: 'Savannah',
			coordinates: {
				lat: 32.067416,
				lng: -81.125331,
			},
			postalCode: '31415',
			state: 'GA',
		},
		macAddress: 'EC:59:D3:FC:65:92',
		university: 'Wuhan University of Technology',
		bank: {
			cardExpire: '10/23',
			cardNumber: '3558628665594956',
			cardType: 'jcb',
			currency: 'Yuan Renminbi',
			iban: 'RS85 6347 5884 2820 5764 23',
		},
		company: {
			address: {
				address: '125 John Street',
				city: 'Santa Cruz',
				coordinates: {
					lat: 36.950901,
					lng: -122.046881,
				},
				postalCode: '95060',
				state: 'CA',
			},
			department: 'Marketing',
			name: 'Volkman Group',
			title: 'Cost Accountant',
		},
		ein: '14-6307509',
		ssn: '266-43-5297',
		userAgent:
			'Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1063.0 Safari/536.3',
	},
	{
		id: 26,
		firstName: 'Griffin',
		lastName: 'Braun',
		maidenName: 'Deckow',
		age: 35,
		gender: 'male',
		email: '[email protected]',
		phone: '+62 511 790 0161',
		username: 'lgronaverp',
		password: '4a1dAKDv9KB9',
		birthDate: '1965-09-06',
		image: 'https://robohash.org/laboriosammollitiaut.png',
		bloodGroup: 'O−',
		height: 146,
		weight: 65.5,
		eyeColor: 'Blue',
		hair: {
			color: 'Blond',
			type: 'Wavy',
		},
		domain: 'foxnews.com',
		ip: '93.246.47.59',
		address: {
			address: '600 West 19th Avenue',
			city: 'Anchorage',
			coordinates: {
				lat: 61.203115,
				lng: -149.894107,
			},
			postalCode: '99503',
			state: 'AK',
		},
		macAddress: '34:06:26:95:37:D6',
		university: 'Universitas Bojonegoro',
		bank: {
			cardExpire: '07/24',
			cardNumber: '3587188969123346',
			cardType: 'jcb',
			currency: 'Rupiah',
			iban: 'AD24 9240 6903 OD2X OW1Y WD1K',
		},
		company: {
			address: {
				address: '1508 Massachusetts Avenue Southeast',
				city: 'Washington',
				coordinates: {
					lat: 38.887255,
					lng: -76.98318499999999,
				},
				postalCode: '20003',
				state: 'DC',
			},
			department: 'Engineering',
			name: 'Boyle, Boyer and Lang',
			title: 'Senior Cost Accountant',
		},
		ein: '38-0997138',
		ssn: '407-02-8915',
		userAgent:
			'Mozilla/5.0 (iPad; CPU OS 6_0 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10A5355d Safari/8536.25',
	},
	{
		id: 27,
		firstName: 'Piper',
		lastName: 'Schowalter',
		maidenName: 'Wuckert',
		age: 47,
		gender: 'female',
		email: '[email protected]',
		phone: '+60 785 960 7918',
		username: 'fokillq',
		password: 'xZnWSWnqH',
		birthDate: '1983-06-07',
		image: 'https://robohash.org/nequeodiosapiente.png',
		bloodGroup: 'A−',
		height: 197,
		weight: 71.5,
		eyeColor: 'Brown',
		hair: {
			color: 'Black',
			type: 'Curly',
		},
		domain: 'toplist.cz',
		ip: '100.159.51.104',
		address: {
			address: '1208 Elkader Court North',
			city: 'Nashville',
			coordinates: {
				lat: 36.080049,
				lng: -86.60116099999999,
			},
			postalCode: '37013',
			state: 'TN',
		},
		macAddress: '1F:42:5D:8C:66:3D',
		university: 'Sultanah Bahiyah Polytechnic',
		bank: {
			cardExpire: '09/22',
			cardNumber: '6762169351744592',
			cardType: 'maestro',
			currency: 'Ringgit',
			iban: 'BH05 STDW HECU HD4S L8U1 C6',
		},
		company: {
			address: {
				address: '600 West 19th Avenue',
				city: 'Anchorage',
				coordinates: {
					lat: 61.203115,
					lng: -149.894107,
				},
				postalCode: '99503',
				state: 'AK',
			},
			department: 'Human Resources',
			name: "O'Hara and Sons",
			title: 'Sales Representative',
		},
		ein: '11-3129153',
		ssn: '408-90-5986',
		userAgent:
			'Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2224.3 Safari/537.36',
	},
	{
		id: 28,
		firstName: 'Kody',
		lastName: 'Terry',
		maidenName: 'Larkin',
		age: 28,
		gender: 'male',
		email: '[email protected]',
		phone: '+81 859 545 8951',
		username: 'xisherwoodr',
		password: 'HLDqN5vCF',
		birthDate: '1979-01-09',
		image: 'https://robohash.org/consequunturabnon.png',
		bloodGroup: 'B−',
		height: 172,
		weight: 90.2,
		eyeColor: 'Blue',
		hair: {
			color: 'Brown',
			type: 'Wavy',
		},
		domain: 'elpais.com',
		ip: '51.102.180.216',
		address: {
			address: '210 Green Road',
			city: 'Manchester',
			coordinates: {
				lat: 41.7909099,
				lng: -72.51195129999999,
			},
			postalCode: '06042',
			state: 'CT',
		},
		macAddress: 'B4:B6:17:3C:41:E5',
		university: 'Science University of Tokyo',
		bank: {
			cardExpire: '05/23',
			cardNumber: '201443655632569',
			cardType: 'diners-club-enroute',
			currency: 'Yen',
			iban: 'GT70 4NNE RDSR 0AJV 6AQI 4XH1 RWOC',
		},
		company: {
			address: {
				address: '109 Summit Street',
				city: 'Burlington',
				coordinates: {
					lat: 44.4729749,
					lng: -73.2026566,
				},
				postalCode: '05401',
				state: 'VT',
			},
			department: 'Support',
			name: 'Leffler, Beatty and Kilback',
			title: 'Recruiting Manager',
		},
		ein: '09-1129306',
		ssn: '389-74-9456',
		userAgent:
			'Mozilla/6.0 (Macintosh; I; Intel Mac OS X 11_7_9; de-LI; rv:1.9b4) Gecko/2012010317 Firefox/10.0a4',
	},
	{
		id: 29,
		firstName: 'Macy',
		lastName: 'Greenfelder',
		maidenName: 'Koepp',
		age: 45,
		gender: 'female',
		email: '[email protected]',
		phone: '+81 915 649 2384',
		username: 'jissetts',
		password: 'ePawWgrnZR8L',
		birthDate: '1976-09-07',
		image: 'https://robohash.org/amettemporeea.png',
		bloodGroup: 'A−',
		height: 166,
		weight: 93.7,
		eyeColor: 'Amber',
		hair: {
			color: 'Black',
			type: 'Straight',
		},
		domain: 'ibm.com',
		ip: '197.37.13.163',
		address: {
			address: '49548 Road 200',
			city: "O'Neals",
			coordinates: {
				lat: 37.153463,
				lng: -119.648192,
			},
			postalCode: '93645',
			state: 'CA',
		},
		macAddress: 'D7:14:C5:45:69:C1',
		university: "Fuji Women's College",
		bank: {
			cardExpire: '04/24',
			cardNumber: '633413352570887921',
			cardType: 'solo',
			currency: 'Yen',
			iban: 'IS23 8410 4605 1294 9479 5900 11',
		},
		company: {
			address: {
				address: '5403 Illinois Avenue',
				city: 'Nashville',
				coordinates: {
					lat: 36.157077,
					lng: -86.853827,
				},
				postalCode: '37209',
				state: 'TN',
			},
			department: 'Product Management',
			name: 'Bruen and Sons',
			title: 'Structural Analysis Engineer',
		},
		ein: '31-6688179',
		ssn: '391-33-1550',
		userAgent:
			'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_2) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.45 Safari/535.19',
	},
	{
		id: 30,
		firstName: 'Maurine',
		lastName: 'Stracke',
		maidenName: 'Abshire',
		age: 31,
		gender: 'female',
		email: '[email protected]',
		phone: '+48 143 590 6847',
		username: 'kdulyt',
		password: '5t6q4KC7O',
		birthDate: '1964-12-18',
		image: 'https://robohash.org/perferendisideveniet.png',
		bloodGroup: 'O−',
		height: 170,
		weight: 107.2,
		eyeColor: 'Blue',
		hair: {
			color: 'Blond',
			type: 'Wavy',
		},
		domain: 'ow.ly',
		ip: '97.11.116.84',
		address: {
			address: '81 Seaton Place Northwest',
			city: 'Washington',
			coordinates: {
				lat: 38.9149499,
				lng: -77.01170259999999,
			},
			postalCode: '20001',
			state: 'DC',
		},
		macAddress: '42:87:72:A1:4D:9A',
		university: 'Poznan School of Banking',
		bank: {
			cardExpire: '02/24',
			cardNumber: '6331108070510590026',
			cardType: 'switch',
			currency: 'Zloty',
			iban: 'MT70 MKRC 8244 59Z4 9UG1 1HY7 TKM6 1YX',
		},
		company: {
			address: {
				address: '816 West 19th Avenue',
				city: 'Anchorage',
				coordinates: {
					lat: 61.203221,
					lng: -149.898655,
				},
				postalCode: '99503',
				state: 'AK',
			},
			department: 'Support',
			name: 'Balistreri-Kshlerin',
			title: 'Quality Engineer',
		},
		ein: '51-7727524',
		ssn: '534-76-0952',
		userAgent:
			'Mozilla/5.0 (X11; Linux i686) AppleWebKit/535.11 (KHTML, like Gecko) Chrome/17.0.963.66 Safari/535.11',
	},
];

JS #12

// // // // const p = document.querySelector('p');

// // // // // const b = document.createElement('b');
// // // // // b.innerText = 'Hello World';
// // // // // const i = document.createElement('i');
// // // // // i.innerText = 'Goodbye World';

// // // // // p.insertAdjacentElement('afterend', b);

// // // // // p.prepend(b, i);

// // // // p.remove();

// // // const btn = document.querySelector('button');
// // // // btn.onclick = function () {
// // // // 	console.log('Hello World');
// // // // };
// // // // btn.onclick = function () {
// // // // 	console.log('Goodbye World');
// // // // };

// // // btn.addEventListener('click', function () {
// // // 	console.log('Hello World');
// // // });

// // // btn.addEventListener('click', function () {
// // // 	console.log('Goodbye World');
// // // });

// // // btn.addEventListener('mouseenter', function () {
// // // 	console.log(Math.random());
// // // });

// // // window.addEventListener('scroll', function () {
// // // 	console.log('Stop Scrolling!');
// // // });

// // const btn = document.querySelector('button');
// // btn.style.position = 'relative';

// // btn.addEventListener('mouseover', function () {
// // 	const height = Math.floor(Math.random() * window.innerHeight);
// // 	const width = Math.floor(Math.random() * window.innerWidth);
// // 	btn.style.left = `${width}px`;
// // 	btn.style.top = `${height}px`;
// // });

// // btn.addEventListener('click', function () {
// // 	btn.innerText = 'You Won!';
// // 	document.body.style.backgroundColor = 'green';
// // });

// const colors = [
// 	'red',
// 	'orange',
// 	'yellow',
// 	'green',
// 	'blue',
// 	'purple',
// 	'indigo',
// 	'violet',
// ];

// const container = document.querySelector('#boxes');
// const span = document.querySelector('span');

// const printColor = function () {
// 	span.innerText = this.style.backgroundColor;
// };

// for (let color of colors) {
// 	const box = document.createElement('div'); // Create a square box

// 	box.style.backgroundColor = color; // Style the box
// 	box.classList.add('box'); // Add a class

// 	container.append(box); // Append box to container

// 	// Add event listener to the box
// 	box.addEventListener('click', printColor);
// }

// // // ---------------------
// // // If the logic we want to apply to each button's event is long,
// // // we can abstract that code from the for loop and add it to it's own function

// // const printColor = function (box) {
// //   console.log(box.style.backgroundColor)
// // }

// // for (let color of colors) {
// //   const box = document.createElement('div') // Create a square box

// //   box.style.backgroundColor = color // Style the box
// //   box.classList.add('box') // Add a class

// //   container.append(box) // Append box to container

// //   // Add event listener to the box
// //   box.addEventListener('click', function() {
// //     printColor(box)
// //   })
// // }

// // // -===================
// // // We can make use of `this`
// // const printColor = function () {
// //   console.log(this.style.backgroundColor)
// // }

// // for (let color of colors) {
// //   const box = document.createElement('div') // Create a square box

// //   box.style.backgroundColor = color // Style the box
// //   box.classList.add('box') // Add a class

// //   container.append(box) // Append box to container

// //   // Add event listener to the box
// //   box.addEventListener('click', printColor)
// // }

// // // Change other elements on the DOM
// // const changeColor = function () {
// //   const h1 = document.querySelector('h1')
// //   h1.style.color = this.style.backgroundColor
// //   h1.innerText = this.style.backgroundColor + ' selected'
// // }

// // for (let color of colors) {
// //   const box = document.createElement('div') // Create a square box

// //   box.style.backgroundColor = color // Style the box
// //   box.classList.add('box') // Add a class

// //   container.append(box) // Append box to container

// //   // Add event listener to the box
// //   box.addEventListener('click', printColor)
// //   box.addEventListener('click', changeColor)
// // }

// const btn = document.querySelector('button');

// btn.addEventListener('click', function (event) {
// 	event.target.innerText = 'hello World';
// 	console.log(event.target);
// });

const inp = document.querySelector('input');
const p = document.querySelector('p');

inp.addEventListener('keypress', function (e) {
	p.innerText = e.target.value;
});

Tasks List

// tasks.html

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Task Manager</title>
	</head>
	<body>
		<h4>Add Your Task</h4>
		<form>
			<label for="taskName">Add Task</label>
			<input type="text" id="taskName" />
			<button type="submit">Add</button>
		</form>

		<h4>Your Tasks</h4>
		<ul></ul>

		<script src="./tasks.js"></script>
	</body>
</html>





// tasks.js

const form = document.querySelector('form');
const tasksList = document.querySelector('ul');

form.addEventListener('submit', function (e) {
	e.preventDefault();

	const li = document.createElement('li');
	li.innerText = e.target[0].value;

	const btn = document.createElement('button');
	btn.innerText = 'Delete';
	btn.addEventListener('click', function () {
		li.remove();
	});

	li.append(btn);

	li.addEventListener('click', function () {
		li.style.textDecoration = 'line-through';
	});

	tasksList.append(li);

	e.target[0].value = '';
});

Scratchpad #13

// const multiply = (x, y) => x * y;

// const square = (x) => multiply(x, x);

// const rightTriangle = (a, b, c) => {
// 	return square(a) + square(b) === square(c);
// };

// console.log(rightTriangle(10, 5, 50));

// console.log('The first log');
// alert('An interruption in between');
// console.log('The last log');

console.log('The first log');
setTimeout(function () {
	console.log('Hello World');
}, 3000);
console.log('The last log');

Scratchpad #14

// // // // console.log('The first log');

// // // // setTimeout(() => {
// // // // 	console.log('The log after 4 seconds');
// // // // }, 3000);

// // // // console.log('The second log');

// // // const btn = document.querySelector('button');

// // // setTimeout(() => {
// // // 	btn.style.transform = 'translateX(100px)';
// // // 	setTimeout(() => {
// // // 		btn.style.transform = 'translateX(200px)';
// // // 		setTimeout(() => {
// // // 			btn.style.transform = 'translateX(300px)';
// // // 			setTimeout(() => {
// // // 				btn.style.transform = 'translateX(400px)';
// // // 				setTimeout(() => {
// // // 					btn.style.transform = 'translateX(500px)';
// // // 					setTimeout(() => {
// // // 						btn.style.transform = 'translateX(600px)';
// // // 					}, 1000);
// // // 				}, 1000);
// // // 			}, 1000);
// // // 		}, 1000);
// // // 	}, 1000);
// // // }, 1000);

// // const willGetAPlayStation = new Promise((resolve, reject) => {
// // 	const num = Math.random();

// // 	if (num < 0.5) {
// // 		resolve();
// // 	} else {
// // 		reject();
// // 	}
// // });

// // willGetAPlayStation
// // 	.then(() => {
// // 		console.log('Thank you uncle');
// // 	})
// // 	.catch(() => {
// // 		console.log('F you uncle');
// // 	});

// const makePlayStationPromise = () => {
// 	return new Promise((resolve, reject) => {
// 		setTimeout(() => {
// 			const rand = Math.random();
// 			if (rand < 0.5) {
// 				resolve();
// 			} else {
// 				reject();
// 			}
// 		}, 5000);
// 	});
// };

// makePlayStationPromise()
// 	.then(() => {
// 		console.log('I got a playstation!');
// 	})
// 	.catch(() => {
// 		console.log("[email protected]#$% I didn't get anything!");
// 	});

function fakeRequest(url) {
	return new Promise(function (resolve, reject) {
		setTimeout(() => {
			const pages = {
				'/users': [
					{ id: 1, username: 'john' },
					{ id: 2, username: 'jane' },
				],
				'/about': 'This is the about page',
				'/users/1': {
					id: 1,
					username: 'johndoe',
					topPostId: 53231,
					city: 'mumbai',
				},
				'/users/5': {
					id: 1,
					username: 'janedoe',
					topPostId: 32443,
					city: 'pune',
				},
				'/posts/53231': {
					id: 1,
					title: 'Really amazing post',
					slug: 'really-amazing-post',
				},
			};

			const data = pages[url];

			if (data) {
				resolve({ status: 200, data });
			} else {
				reject({ status: 404 });
			}
		}, 500);
	});
}

fakeRequest('/users')
	.then((response) => {
		const userId = response.data[0].id;
		return fakeRequest(`/users/${userId}`);
	})
	.then((response) => {
		const postId = response.data.topPostId;
		returnfakeRequest(`/posts/${postId}`);
	})
	.then((response) => {
		console.log(response);
	})
	.catch((err) => {
		console.log(err);
	});

Scratchpad #15

// fetch('https://swapi.dev/api/people')
// 	.then((response) => {
// 		if (!response.ok) {
// 			throw new Error();
// 		}
// 		return response.json();
// 	})
// 	.then((data) => {
// 		console.log('USING FETCH', data);
// 	})
// 	.catch((err) => {
// 		console.log('I AM IN THE ERROR BLOCK', err);
// 	});

// const root = document.querySelector('#root');

// const container = document.createElement('div');
// container.style.display = 'grid';
// container.style.gridTemplateColumns = '1fr 1fr 1fr 1fr';
// container.style.gap = '20px';

// axios
// 	.get('https://swapi.dev/api/people')
// 	.then((response) => {
// 		console.log(response.data.results);
// 		for (person of response.data.results) {
// 			const p = document.createElement('p');
// 			p.innerText = `Name: ${person.name}\nGender: ${person.gender}`;
// 			container.append(p);
// 		}
// 	})
// 	.catch((err) => {
// 		console.log(err);
// 	});

// root.append(container);

const root = document.querySelector('#root');

const container = document.createElement('div');
container.style.display = 'grid';
container.style.gridTemplateColumns = '1fr 1fr 1fr 1fr 1fr';
container.style.gap = '20px';

axios
	.get('https://pokeapi.co/api/v2/pokemon?limit=10000')
	.then((response) => {
		for (let pokemon of response.data.results) {
			axios.get(pokemon.url).then((res) => {
				const pokeCard = document.createElement('div');
				pokeCard.style.backgroundColor = 'rgba(0,0,0,0.1)';
				pokeCard.style.display = 'flex';
				pokeCard.style.flexDirection = 'column';
				pokeCard.style.alignItems = 'center';
				const pokeName = document.createElement('p');
				pokeName.innerText = res.data.name;
				pokeName.style.textTransform = 'capitalize';
				pokeName.style.fontWeight = 'bold';
				pokeName.style.fontSize = '30px';
				const pokeImg = document.createElement('img');
				pokeImg.src = res.data.sprites.other['official-artwork'].front_default;
				pokeImg.style.width = '200px';
				pokeCard.append(pokeImg, pokeName);

				container.append(pokeCard);
			});
		}
	})
	.catch((err) => console.log(err));

root.append(container);

Scratchpad #16

// // // function getData() {
// // // 	const response = axios.get('https://pokeapi.co/api/v2/pokemon');
// // // 	response.then((data) => {
// // // 		console.log(data);
// // // 	});
// // // }

// // // getData();

// // async function greet() {
// // 	throw 'Hello World';
// // }

// // function greet3() {
// // 	return new Promise((resolve, reject) => {
// // 		reject('Hello World');
// // 	});
// // }

// // // const greet2 = async () => {
// // // 	return 'hello world';
// // // };

// // console.log(greet());
// // console.log(greet3());

// async function getData() {
// 	try {
// 		const response = await axios.get('https://pokeasdasdapi.co/api/v2/pokemon');
// 		console.log(response.data.results);
// 	} catch (err) {
// 		console.log('ERROR', err);
// 	}
// }

// getData();

async function getPokemon() {
	const pokemon1Promise = axios.get('https://pokeapi.co/api/v2/pokemon/1');
	const pokemon2Promise = axios.get('https://pokeapi.co/api/v2/pokemon/2');
	const pokemon3Promise = axios.get('https://pokeapi.co/api/v2/pokemon/3');

	// const pokemon1 = await pokemon1Promise;
	// const pokemon2 = await pokemon2Promise;
	// const pokemon3 = await pokemon3Promise;
	const results = await Promise.all([
		pokemon1Promise,
		pokemon2Promise,
		pokemon3Promise,
	]);

	// console.log(pokemon1.data);
	// console.log(pokemon2.data);
	// console.log(pokemon3.data);
	console.log(results);
}

getPokemon();

Scratchpad @17

// // function initializeDeck() {
// // 	const deck = [];
// // 	const suits = ['hearts', 'diamonds', 'spades', 'clubs'];
// // 	const values = '2,3,4,5,6,7,8,9,10,J,Q,K,A';
// // 	for (let value of values.split(',')) {
// // 		for (let suit of suits) {
// // 			deck.push({ value, suit });
// // 		}
// // 	}
// // 	return deck;
// // }

// // function drawCard(deck, drawnCards) {
// // 	const card = deck.pop();
// // 	drawnCards.push(card);
// // 	return card;
// // }

// // function drawMultiple(numCards, deck, drawnCards) {
// // 	const cards = [];
// // 	for (let i = 0; i < numCards; i++) {
// // 		cards.push(drawCard(deck, drawnCards));
// // 	}
// // 	return cards;
// // }

// // function shuffle(deck) {
// // 	// loop over array backwards
// // 	for (let i = deck.length - 1; i > 0; i--) {
// // 		// pick random index before current element
// // 		let j = Math.floor(Math.random() * (i + 1));
// // 		[deck[i], deck[j]] = [deck[j], deck[i]];
// // 	}
// // 	return deck;
// // }

// // const deck1 = initializeDeck();

// // shuffle(deck1);
// // const hand = [];

// // drawCard(deck1, hand);
// // drawCard(deck1, hand);
// // drawCard(deck1, hand);
// // drawMultiple(5, deck1, hand);

// // console.log(deck1);
// // console.log(hand);

// function makeDeck() {
// 	return {
// 		deck: [],
// 		drawnCards: [],
// 		suits: ['hearts', 'diamonds', 'spades', 'clubs'],
// 		values: '2,3,4,5,6,7,8,9,10,J,Q,K,A',
// 		initializeDeck() {
// 			for (let value of this.values.split(',')) {
// 				for (let suit of this.suits) {
// 					this.deck.push({ value, suit });
// 				}
// 			}
// 			return this.deck;
// 		},
// 		drawCard() {
// 			const card = this.deck.pop();
// 			this.drawnCards.push(card);
// 			return card;
// 		},
// 		drawMultiple(numCards) {
// 			const cards = [];
// 			for (let i = 0; i < numCards; i++) {
// 				cards.push(this.drawCard());
// 			}
// 			return cards;
// 		},
// 		shuffle() {
// 			const { deck } = this;
// 			for (let i = deck.length - 1; i > 0; i--) {
// 				let j = Math.floor(Math.random() * (i + 1));
// 				[deck[i], deck[j]] = [deck[j], deck[i]];
// 			}
// 		},
// 	};
// }

// const deck1 = makeDeck();
// deck1.initializeDeck();
// deck1.shuffle();
// deck1.drawCard();
// const deck2 = makeDeck();

// console.log(deck1);
// console.log(deck2);

function person(firstName, lastName, age) {
	return {
		firstName,
		lastName,
		age,
		city: 'Mumbai',
	};
}

function Person(firstName, lastName, age) {
	this.firstName = firstName;
	this.lastName = lastName;
	this.age = age;
	this.city = 'Mumbai';
}

john = person('John', 'Doe', 20);
jane = person('Jane', 'Doe', 22);

jack = new Person('Jack', 'Roe', 30);
jill = new Person('Jill', 'Roe', 33);

console.log(john);
console.log(jane);
console.log(jack);
console.log(jill);

Scratchpad #18

// // class Person {
// // 	hello = 'world';

// // 	constructor(firstName, lastName, age, city) {
// // 		this.firstName = firstName;
// // 		this.lastName = lastName;
// // 		this.age = age;
// // 		this.city = city;
// // 	}

// // 	greet() {
// // 		return `Hello my name is ${this.firstName} ${this.lastName}`;
// // 	}
// // }

// // // function Person(firstName, lastName, age, city) {
// // // 	this.firstName = firstName;
// // // 	this.lastName = lastName;
// // // 	this.age = age;
// // // 	this.city = city;
// // // }

// // // Person.prototype.hello = 'world';
// // // Person.prototype.greet = function () {
// // // 	return `Hello my name is ${this.firstName} ${this.lastName}`;
// // // };

// // user1 = new Person('John', 'Doe', 20, 'Mumbai');
// // user2 = new Person('Jane', 'Smith', 22, 'Pune');

// // console.log(user1.greet());
// // console.log(user2.greet());
// // console.log(user2.hello);

// // Refactoring the makeDeck into a class

// class Deck {
// 	constructor() {
// 		this.deck = [];
// 		this.drawnCards = [];
// 		this.suits = ['hearts', 'diamonds', 'spades', 'clubs'];
// 		this.values = '2,3,4,5,6,7,8,9,10,J,Q,K,A';
// 	}

// 	initializeDeck() {
// 		const { suits, values, deck } = this;
// 		for (let value of values.split(',')) {
// 			for (let suit of suits) {
// 				deck.push({ value, suit });
// 			}
// 		}
// 		return deck;
// 	}

// 	drawCard() {
// 		const card = this.deck.pop();
// 		this.drawnCards.push(card);
// 		return card;
// 	}

// 	drawMultiple(numCards) {
// 		const cards = [];
// 		for (let i = 0; i < numCards; i++) {
// 			cards.push(this.drawCard());
// 		}
// 		return cards;
// 	}

// 	shuffle() {
// 		const { deck } = this;
// 		for (let i = deck.length - 1; i > 0; i--) {
// 			let j = Math.floor(Math.random() * (i + 1));
// 			[deck[i], deck[j]] = [deck[j], deck[i]];
// 		}
// 	}
// }

// const deck1 = new Deck();
// deck1.initializeDeck();
// deck1.shuffle();
// const deck2 = new Deck();
// deck2.initializeDeck();
// deck2.shuffle();

// deck1.drawCard();
// deck2.drawCard();
// deck2.drawCard();
// deck2.drawMultiple(2);

// console.log(deck1);
// console.log(deck2);

class User {
	constructor(firstName, lastName, email) {
		this.firstName = firstName;
		this.lastName = lastName;
		this.email = email;
	}

	login() {
		console.log('You have logged in');
	}
	logout() {
		console.log('You have logged out');
	}
}

class Admin extends User {
	constructor(firstName, lastName, email, phone) {
		super(firstName, lastName, email);
		this.phone = phone;
	}

	createGroup(name) {
		console.log(`${name} group was created`);
	}
}

john = new User('John', 'Doe', '[email protected]');
john.login();

jane = new Admin('Jane', 'Doe', '[email protected]');
jane.login();
jane.createGroup('Hello World');

React Scratchpad #1

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<body>
		<div id="root"></div>

		<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
		<script src="https://unpkg.com/[email protected]^16/umd/react.development.js"></script>
		<script src="https://unpkg.com/[email protected]^16/umd/react-dom.development.js"></script>

		<script type="text/babel">
			// const root = document.querySelector('#root');
			// const title = document.createElement('h1');
			// title.innerText = 'Hello World';
			// root.append(title);

			// const title = React.createElement(
			// 	'h1',
			// 	{
			// 		id: 'hello',
			// 		className: 'world',
			// 	},
			// 	'Hello World from React'
			// );

			// const h1 = React.createElement('h1', null, 'Hello World');
			// const p = React.createElement('p', null, 'This is a paragraph');

			// const div = React.createElement('div', {
			// 	children: [h1, p],
			// });

			// const div = React.createElement(
			// 	'div',
			// 	null,
			// 	React.createElement('h1', null, 'Hello World'),
			// 	React.createElement('p', null, 'This is a paragraph')
			// );
			// ReactDOM.render(div, document.querySelector('#root'));

			// const title = React.createElement(
			// 	'h1',
			// 	{ id: 'special' },
			// 	'Hello from React'
			// );

			// const children = 'Hello World. This is the page title';
			// const className = 'title';
			// const props = { children, className };

			// const title2 = (
			// 	<h1 id='special' className='hello'>
			// 		Hello using the JSX syntax
			// 	</h1>
			// );

			// const title2 = <h1 className={className}>{children.toUpperCase()}</h1>; // <h1 children="Hello World" />

			// React.createElement('h1', {id: 'special'}, `${new Date().toUTCString()} Hello using the JSX syntax`)

			// function blogPost(props) {
			// 	return (
			// 		<article>
			// 			<h4>My article title</h4>
			// 			<p>
			// 				<i>Published on 22nd May, 2023 by John Doe</i>
			// 			</p>
			// 			<p>
			// 				Lorem ipsum, dolor sit amet consectetur adipisicing elit.
			// 				Exercitationem aut ducimus qui ratione nobis, facilis est
			// 				doloremque laboriosam, quam iusto id delectus vero ad, officia
			// 				animi voluptates molestias quod quas?...
			// 			</p>
			// 			<a href='#'>Read More</a>
			// 		</article>
			// 	);

			// function BlogPost({ title, date, author, children, url }) {
			// 	return (
			// 		<article>
			// 			<h4>{title}</h4>
			// 			<p>
			// 				<i>
			// 					Published on {date} by {author}
			// 				</i>
			// 			</p>
			// 			<p>{children} ...</p>
			// 			<a href={url}>Read More</a>
			// 		</article>
			// 	);
			// }

			// const content = (
			// 	<div>
			// 		{BlogPost({
			// 			title: 'My article title',
			// 			date: '22nd May, 2023',
			// 			author: 'John Doe',
			// 			children:
			// 				'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Exercitationem aut ducimus qui ratione nobis, facilis est doloremque laboriosam, quam iusto id delectus vero ad, officia animi voluptates molestias quod quas?',
			// 			url: '#',
			// 		})}

			// 		{React.createElement(
			// 			BlogPost,
			// 			{
			// 				title: 'My article title',
			// 				date: '22nd May, 2023',
			// 				author: 'John Doe',
			// 				url: '#',
			// 			},
			// 			'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Exercitationem aut ducimus qui ratione nobis, facilis est doloremque laboriosam, quam iusto id delectus vero ad, officia animi voluptates molestias quod quas?'
			// 		)}

			// 		<BlogPost
			// 			title='My article title'
			// 			date='22nd May, 2023'
			// 			author='John Doe'
			// 			url='#'>
			// 			Lorem ipsum, dolor sit amet consectetur adipisicing elit.
			// 			Exercitationem aut ducimus qui ratione nobis, facilis est doloremque
			// 			laboriosam, quam iusto id delectus vero ad, officia animi voluptates
			// 			molestias quod quas?
			// 		</BlogPost>
			// 	</div>
			// );

			const content = (
				<>
					<p>Hello World</p>
					<p>Hello Universe</p>
				</>
			);

			ReactDOM.render(content, document.querySelector('#root'));
		</script>
	</body>
</html>

React and Node ZIP