전체 글 210

자바스크립트> 데이터 바인딩 실습

첫째 상품명을 뽑는 법을 알아봅시다.  설명하다 var products = [ { id : 0, price : 70000, title : 'Blossom Dress' }, { id : 1, price : 50000, title : 'Springfield Shirt' }, { id : 2, price : 60000, title : 'Black Monastery' }]; ▲ 어렵게 생긴 자료도 console.log 해보면 쉽게 출력할 수 있다고 했습니다. console.log(products) 해보면 [{ }, { }, { }] 이렇게 나옵니다.  그냥 array 안에 object 3개가 들어있을 뿐입니다.그래서 저기서 내가 원하는 자료를 뽑고 싶으면 시작 기호만 잘 보면 됩니다.[ 이거는 array라..

자바스크립트 2024.07.09

자바스트립트>Array 와 Object 자료형

Array 자료형  여러가지 자료를 한곳에 저장하고 싶을 때 사용하는 자료형입니다.  var car = ['소나타', 50000, 'white'];대괄호를 열고 자료를 콤마로 구분해서 집어넣으면 됩니다.그럼 여러 자료를 엑셀처럼 저장가능  var car = ['소나타', 50000, 'white'];console.log(car[1]);array 자료에서 데이터 뽑을 땐 대괄호를 뒤에 붙이면 됩니다.[x] 라고 쓰면 x번째 자료를 출력해줍니다.  var car = ['소나타', 50000, 'white'];car[1] = 60000;console.log(car[1]);array 자료를 수정하고 싶으면 등호 이용해서 수정하면 됩니다.자료 추가도 됩니다.그래서 결론은 여러 자료를 변수 하나에 저장하고 싶으면 ..

자바스크립트 2024.07.09

쓸만한 자바스크립트 라이브러리들

직접 자바스크립트 코드를 처음부터 짜기 귀찮으면남들이 만들어놓은 라이브러리를 사용해도 됩니다.UI 개발도 마찬가지로 복사 붙여넣기식으로 멋진 UI 개발이 가능합니다. 그렇다고 복붙식으로 포트폴리오를 만들면 개발실력이 아니라 복붙실력이 어필됩니다.       1. Swiper 캐러셀 (이미지슬라이드되는거) 만들고 싶으면 직접 코드 짜도 되겠지만좀 이쁘게 아니면 쉽게 여러기능을 만들고 싶으면 Swiper 라이브러리 써도 됩니다.호환 잘되고 이미지 lazy loading 이런 것도 되고 터치/드래그도 됩니다.  https://swiperjs.com/get-started#use-swiper-from-cdn여기가서 튜토리얼 그대로 js 파일, css 파일을 다운받아서 첨부한 뒤에html css js 예제코드 복사..

자바스크립트 2024.07.09