[항해99(7기)] 웹개발 종합반 3주차
ajax로 받은 OpenAPI 데이터에서 별점의 개수는 Sting요소가 아닌 숫자 요소로 받아야했기 때문에 받은 숫자에 따라 평점별 개수를 출력하는 작업을 따로 추가해줬어야 했다. let stars = ''; for (let j = 0; j < star; j++) { stars += '⭐'; } 이 작업을 위해 위와 같은 코드를 작성했는데 더 간단한 let stars = '⭐'.repeat(star); repeat() 함수가 존재했다. Python을 이용한 크롤링 크롤링(crawling)이란? Web상에 존재하는 Contents를 수집하는 작업(프로그래밍으로 자동화 가능) HTML 페이지를 가져와서 HTML/CSS등을 파싱하고, 필요한 데이터만 추출하는 기법 Open API(Rest API)를 제공하는 ..
[항해99(7기)] 웹개발 종합반 2주차
JQurey+ajax CSS를 사용하지 않고 처음부터 영화 기록 창을 닫고 싶어서 $('#post-box').show(); function openBox() { $('#post-box').show(); } function closeBox() { $('#post-box').hide(); } 적용을 했는데 잘 되지 않았다. .mypost { max-width: 500px; width: 95%; margin: 1rem auto 1rem auto; box-shadow: 0px 0px 3px 0px; padding: 1rem; display: none; } CSS의 .mypost에서 display: none 속성을 지정해 주어야 가려졌다. // 1. input-q2 값을 가져온다. // 2. 만약 가져온 값에 @..
1주차 수업은 간단한 HTML, CSS, JavaScript 문법에 대해서 배웠다. 쉽다고 생각했던 HTML, CSS도 오랜만에 하니 까먹고 있었던 태그와 속성들이 차차 생각나기 시작했다. CSS CSS 속성 연습(1) - 배경 사진 중간 정렬하기 background-image: url(""); background-size: cover; background-position: center; CSS 속성 연습(2) - 화면 비율에 따라 이미지 조절 width: 95%; max-width: 500px; margin: 1rem auto 1rem auto; width 크기를 지정해주고 margin: auto를 사용하면 객체를 중간으로 정렬할 수 있다. 혼자 반응형 웹페이지 제작을 하면서 사용했던 @media가 있..