JavaScript 맛보기~jQuery 기초
•
배운점:
◦
<script></script> 태그 내 함수 선언
◦
해당 함수가 작동 될(event) 개체 지정
◦
console.log로 event 없이 테스트 할 수 있음
◦
a라는 변수에 선언된 값들을 불러오는것
◦
Dictionary는 [{key, value}, {k,v}, … ] 를 불러올 수 있다.
•
어려운 점:
◦
Dictionary는 왜배우는지?? (→ JSON의 형식이다)
서버-클라이언트 통신 이해~Fetch이해하기
•
배운점:fetch(”URL").then(res => res.json()).then(data => {
◦
"서울의 미세먼지" 실시간 데이터를 통한 JSON 형식 확인
◦
JSONVue를 설치한 후 확인하면 Dictionary 형태의 데이터임을 볼 수 있음
◦
서버에서 클라이언트로 데이터를 내려줄때 가지고 올 수 있는 포맷이며 이러한 데이터 규칙은 Dictionary 형식으로 되어 있다.
◦
Fetch, 공공 데이터 OpenAPI 활용 실습
◦
Fetch 기본 골격
•
// 데이터 전체가 찍히는지 확인 })
•
어려운 점:
◦
JSON 아이템을 뷰페이지로 옮겨본 프로젝트는 진행했지만
◦
이처럼 Dictionary라는 형식이라는 근본적인 이유는 모르고 사용하고 있었음
◦
=> 화살표 함수(Arrow function)에 대한 추가 스터디
◦
백틱을 사용하는 이유, 사용법 익히기
Fetch 응용 퀴즈
•
배운점:
◦
"서울시 실시간 미세먼지 상태”와 같이 OpenAPI 데이터를 받아오고 개발자도구 console창에 수신 여부를 확인하는 Fetch를 연습했으니 이제 웹페이지에 직접 활용
◦
JSON 넣는 공식? 항상 반복되는 사이클 : //데이터를 가져온다 => 데이터중에서 list화시킬 부분을 추린다 => 반복문을 돌면서 => 필요한 정보만 꺼내고 => 조건문을 붙여서 구분한다
◦
"서울시 따릉이" 위치를 확인할 수 있는 간단한 서비스페이지를 통해 복
•
어려운 점:
◦
조건문으로 append 부분을 추가 할 때 ' ` ' (백틱) Backtick을 사용하는데 정확한 사용법 익힐 필요
◦
검색을 통해서 확인한것 속성을 바꾸려면 .attr(‘속성’,’값’)을 활용하는것 복습
Fetch 응용 퀴즈 2
•
배운점:
◦
하단에 나열되는 "영화포스터+제목+설명+별점+한줄평" 부분이 하드코딩이 아닌 지정한 데이터로부터 추출되어 나열되게 하는 것이 목표이다. (Fetch)
◦
데이터를 입력 하는 반복문에서 아래처럼 섹션을 구분하기 위한 class 명칭을 구분하고 어떤 그룹이 append 될지 구분
◦
"영화포스터+제목+설명+별점+한줄평" 부분을 각각 아래 변수로 선언
▪
title = 제목
▪
desc = 설명
▪
comment = 한줄평
▪
star = 별점
▪
image = 영화포스터
◦
위 변수들에 데이터들이 담기고 ${ … } 형태로 값을 출력 할 수 있다.
◦
별점 추가부분에서 repeat() 함수 사용
•
어려운 점:
◦
전 과정에서 for 루프는 자주 사용했지만 이번 실습 과정에서는 forEach 반복문을 자주 사용
◦
동일한 결과가 나오게 for로 작성해봤지만 두개를 놓고 비교하니 햇갈린다.. 정확한 차이점, 쓰는 이유 등이 있을것 같다. forEach가 경제적이라면 익숙해질 필요가 있다.
for (i = 0; i < rows.length; i++) {
console.log(rows[i]);
}
MATLAB
복사
//--------이 과정에서 주로 사용하는 반복문--------
rows.forEach((a) => {
console.log(a)
)}
CoffeeScript
복사
백틱과 ${} 표현의 출처에 대한 질답.
템플릿 리터럴 공식문서를 통해서 이해
템플릿 리터럴은 이중 따옴표 나 작은 따옴표 대신 백틱(` `) (grave accent) 을 이용합니다.
템플릿 리터럴은 또한 플레이스 홀더를 이용하여 표현식을 넣을 수 있는데, 이는 $와 중괄호( $ {expression} ) 로 표기할 수 있습니다.
API란 정확히 무엇인가에 대한 질답
API(application programming interface 애플리케이션 프로그래밍 인터페이스[*], 응용 프로그램 프로그래밍 인터페이스)는 컴퓨터나 컴퓨터 프로그램 사이의 연결이다. 일종의 소프트웨어 인터페이스
컴퓨터와 인간을 연결시키는 사용자 인터페이스와 반대로, API는 컴퓨터나 소프트웨어를 서로 연결한다.
forEach, 화살표 함수 등 기초 이해 할 때 신뢰도 높은 공식문서 등 찾는 버릇들이기
