.card::before {
  content: '★';
  position: absolute;
  top: 10px;
  left: 10px;
}

const items = document.querySelectorAll('.item');
const isArray = Array.isArray(items);
const canMap = typeof items.map === 'function';
console.log(isArray, canMap);

const btn = document.querySelector('.btn');
btn.dataset.id = '123';
btn.dataset.userName = 'Alice';
console.log(btn.getAttribute('data-user-name'));

.container {
  display: flex;
  align-content: space-between;
  flex-wrap: wrap;
  height: 300px;
}

const str = 'JavaScript';
const char1 = str[0];
const char2 = str.charAt(0);
str[0] = 'j';
console.log(str[0], char1 === char2);

const numbers = [1, 2, 3, 4, 5];
const even = numbers.every(n => n % 2 === 0);
console.log(even);

.menu {
  list-style: none;
  padding: 0;
  margin: 0;
}
.menu li {
  display: inline-block;
  margin-right: 15px;
}

const a = 5;
const b = '5';
const c = 5;
console.log(a == b, a === c);

const word = 'JavaScript';
const upper = word.toUpperCase();
console.log(word, upper);

.button {
  padding: 10px 20px;
  border: 2px solid black;
  border-radius: 5px;
}