인프런 커뮤니티 질문&답변

작성한 질문수

웹 애니메이션을 위한 GSAP 가이드 Part.02

Practice (2)

map으로 배열을 만들지 않아도 괜찮을까요?

해결된 질문

작성

·

250

1

planet.forEach(planetName => {
  /* html */
  $('.space').insertAdjacentHTML(
    'beforeend',
    `<div class="solar_system"
    data-planet-name="${planetName}">
      <div class="planet ${planetName}">
        <div class="overlay"></div>
        <h2>${planetName}</h2>
      </div>
    </div>`
  );
});

이렇게 처음부터 forEach로 요소를 만들어도 괜찮나요?

HTML/CSS javascript 인터랙티브-웹 gsap

답변 1

0

지식공유자

안녕하세요 jay k 님 :)

행성의 이름으로 태그 배열을 만들어서 insert하는 방법과

바로 태그를 생성하는 방법과는 기능적으로 차이가 없으므로 둘 다 사용이 가능합니다.

다만, 저는 컴퓨터 과학인 관심사의 분리 (Separation of concerns) 로 봤을 때

'태그를 생성하는 일' 과 '태그를 html에 붙여넣는 일' 은 엄연히 다르다고 생각했기 때문에 두가지의 기능을 분리 하여 따로 코드를 작성한 것 입니다 😄

여러 프레임워크 (vue, react, etc..)를 사용해보셨다면 더욱 이해가 쉬울 것 같습니다.

오늘날의 프로그래밍은 컴포넌트를 기준으로 하는 모듈 프로그래밍 방식을 주로 사용하고 있기 때문에

서로의 기능을 분리하여 관리하고 사용하는 관점으로의 접근이 필요합니다.

하지만 이는 정해진 규칙은 아니며 개발자의 성향과 회사의 개발 컨벤션에 따라 달라질 수 있습니다.

감사합니다 :)

질문자

친절한 답변 감사합니다 !

강의 멈추고 혼자 써보고 듣는식으로 수강하다보니 궁금한점이 많이 생기네요 😂

Part3도 오픈 하자마자 수강신청 했습니다 잘부탁드립니다 ! 🙇🏻

지식공유자

jay k 님은 성장하는 학습법을 너무 잘 알고 계시는군요 👏

파트3 완강까지 응원하겠습니다 파이팅 💪

작성한 질문수