westagram wrap up

1. Intro 

- Javascript 작성하고 사용하는데 있어서 구현을 하게 되면 어떤 방식으로 해도 상관은 없다 

- 구현 할 수 있는 다양한 방법이 존재하기 때문에 어렵다고 느낄 수 있다 

- 처음 보는 사람이 code를 보고도 쉽게 이해 가능하도록 구현한 code가 효율적이고 좋은 code라고 할 수 있다 

 

 

2. HTML

- Semantic tag를 사용해야 개발자와 사용자 모두에게 가독성을 높일 수 있다. 의미없는 태그를 남발하지 말자 

- form : 제출 양식을 지정해준다 

- script 태그의 위치 :

• html 은 위에서부터 아래로 읽어 내려오기 때문에 script 파일 연결시 가장 하단에 작성해야 나중에 읽게 된다 
• 상단에 작성할 경우 html이 다 만들어 지기 전에 script를 불러오면서 문제가 생길수 있다  

 - defer, async 를 더 알아보자 

 

 

3. CSS

- 가운데 정렬 방법 

• flex 를 활용한 방법

display : flex;
justify-counter:center;
align-items:center;

•  grid를 활용한 방법

display : grid;
place-items:center;

 

 

4. JavaScript

- "use strict" : 보다 엄격하게 확인

- DOM(Document Object Model) 접근법

getElementById
getElementByClassName
querySelector 
querySelectorAll

- 하나의 동작을 기준으로 함수 작성하기 

• 항상 함수 선언을 먼저 해주고 호출하는 순서 주의하기
• 화면에 보이는 태그 순서, 먼저 발생하는 순서대로 작성하기 
• addEventListener 를 init 함수로 묶어서 실행하기 

 

 

※  더 알아보기

- 이벤트 버블링, 이벤트 위임

- 요소, 노드 불러오기 차이