☑️ まとめ未完了

見た目豪華にするには、JS "絶対"必要!!

ページ上の要素 ボタンをクリックすると、boxが1秒かけて大きくなる
const button = document.getElementById('animateButton');
button.addEventListener('click', () => {
  const box = document.getElementById('box');
  box.style.transition = 'transform 1s';
  box.style.transform = 'scale(1.5)';
});


2.スクロールして特定の位置に来たときに、要素がフェードインして表示
window.addEventListener('scroll', () => {
  const element = document.getElementById('fadeInElement');
  if (element.getBoundingClientRect().top < window.innerHeight) {
    element.style.opacity = 1;
    element.style.transition = 'opacity 1s';
  }
});

window.addEventListener('scroll', () => {
  const element = document.getElementById('fade-in');
  if (element.getBoundingClientRect().top < window.innerHeight) {
    element.classList.add('fade-in-active');
  }
});

Cypress 準備と 前提条件や必要条件、具体的プロセス

node -v でnodeインストされてっか確認

P (Projectフォルダ)フォルダで
　npm install cypress --save-dev

次、このコマ
　npx cypress open

 基本的なテストの作成
テストファイルの作成
cypress/integration フォルダに .spec.js という拡張子のファイルを作成し、テストを書く。
例：
describe('My First Test', () => {
  it('Visits the Kitchen Sink', () => {
    cy.visit('https://example.cypress.io')
    cy.contains('type').click()
    cy.url().should('include', '/commands/actions')
  })
})