wisePocket

1. Fetch란? Fetch는? URL을 넣으면 그 데이터를 가져오는 친구다. 이 한 문장의 개념으로 간단하게 이해하자. 2. Fetch를 사용하는 기본 골격 Fetch의 기본 형태는 다음과 같다. fetch("여기에 URL을 입력").then(res => res.json()).then(data => { console.log(data) }) URL을 입력해서 데이터를 가져오는지 확인해볼 차례 3. 서울시 미세먼지 실시간 데이터 링크를 써서 확인 저번에 사용했던 서울시 미세먼지 실시간 데이터 링크를 URL에 입력해본다. http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99 fetch("http://o..

우선 JavaScript의 Dictionary 복습부터 진행 ----------- HTML로 간단한 버튼을 생성하고 버튼에 onclick 이벤트 속성을 넣은 뒤 간단한 Javascript 함수를 할당해서 아래 테스트 작동 여부를 확인했다. 결과 확인하기! 버튼 클릭 시 '안녕하세요'라는 알림 팝업 function checkResult() { // ** 클릭 시 onclick ** 해당 함수 실행!! alert('안녕하세요') } 전에 배운 Dictionary부분이다. 선언된 값 출력과 스타일 적용 또한 정상적으로 작동되는지 확인 //id가 q1인 div에 a로 선언된 값을 텍스트로 입력 // let a = '사과' // $('#q1').text(a) //id가 q1인 div에 해당 배열의 값을 텍스트로 ..

****Dictionary란 key, value 형태로 구성된 collection 아래 코드와 같이 로그를 확인했을 때 값이 나타나는 것을 주의해서 살펴봐야한다. Java의 배열과 햇갈리는 부분이지만 문법의 규칙만 []와 {}의 차이를 생각하면 된다. index는 [0]부터 시작한다. [1]부터가 아니다 let a = ['사과','수박','딸기','감'] console.log(a[0]) //사과 console.log(a[1]) //수박 console.log(a[2]) //딸기 console.log(a[3]) //감 {}에 포함된 것들을 불러올 때 []로 마치 key값 : value값, key값 : value값 으로 연결 된 것을 확인 할 수 있다. let b = {'name' : '영수', 'age' :..

head 태그 내 script 태그 생성 hey()라는 함수는 alert('안녕!!') 이라는 메세지를 출력하도록 설정 function hey(){ alert('안녕!!') } body 태그 내 위 hey()함수가 작동 될 위치 설정 영화 기록하기 추후 각종 개발 테스트를 위한 console.log를 추가했다. function hey(){ alert('안녕!!') console.log('콘솔 로그 체크용입니다.') } "버튼을 누르는 행위"에 대한 직접적인 디버그를 위해서는 버튼에 alert를 적용하면 쉽게 상태를 확인 할 수 있다. 하지만 생각보다 알림창이 거슬리기 때문에 console.log를 통해서 테스트, 디버깅 하는 것이 편리하다. 해당 스터디는 아래 깃을 통해 업데이트 되고 있습니다. http..

1주차 강의를 통해 HTML, CSS과 Bootstrap 활용을 빠르게 복습 할 수 있었다. 다시 천천히 코드를 작성하고 변화를 관찰하면서 코드 작성법을 익히고 있으며 관련 단축키들도 다시 익숙해지고 있다. // HTML html 주요 태그로는 !doctype 선언문과 html, head, body, div, h1-5, button, input, p, br, img src, label 등 // CSS css 주요 태그로는 color(text),background-color:(background), font-size, font-family, margin, padding, text-align, width, height, border 등 태그 내의 여러 속성값을 지정하는 방법에 대해서 익숙해지고 검색을 생활화..