Hello creators 🙌

Ⅰ. 이번 회차 학습 목표 (goal) 1. 배우고자 하는 것 따릉이 데이터로 이렇게 만들기 업데이트 버튼 누르면 -> 나오게 5개 미만이면 -> 빨간색 Ⅱ. 따릉이 API 데이터 구조 확인 1. 해봐 따릉이 API http://spartacodingclub.shop/sparta_api/seoulbike 보면서 확인할 것 전체 데이터 구조 필요한 항목 이름 체크 Ⅲ. ajax 퀴즈 1 1. 기본 제공 코드 jQuery + Ajax의 조합을 연습하자! 2. 서울시 OpenAPI(실시간 따릉기 현황)를 이용하기 모든 위치의 따릉이 현황을 보여주세요 업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다. 업데이트 거치대 위치 거치대 수 현재 거치된 따릉이 수 102. 망원역 1번출구 앞 22 0 103. ..

Ⅰ. 이번 회차 학습 목표 (goal) 1. 배우고자 하는 것 따릉이 데이터로 이렇게 만들기 업데이트 버튼 누르면 -> 나오게 5개 미만이면 -> 빨간색 Ⅱ. 따릉이 API 데이터 구조 확인 1. 해봐 따릉이 API http://spartacodingclub.shop/sparta_api/seoulbike 보면서 확인할 것 전체 데이터 구조 필요한 항목 이름 체크 Ⅲ. ajax 퀴즈 1 1. 기본 제공 코드 jQuery + Ajax의 조합을 연습하자! 2. 서울시 OpenAPI(실시간 따릉기 현황)를 이용하기 모든 위치의 따릉이 현황을 보여주세요 업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다. 업데이트 거치대 위치 거치대 수 현재 거치된 따릉이 수 102. 망원역 1번출구 앞 22 0 103. ..

Ⅰ. 이번 회차 학습 목표 (goal) 1. 배우고자 하는 것 네이버에서 enter 치는 것 처럼 ==javascript 에서 어떻게 서버에 요청 하는지!== 알아보기 Ⅱ. (복습) JSON 파일 형식 맛보기 1. 이렇게 list, dictionary 합쳐져서 내려오는 형식 = JSON 파일 형식 Ⅱ. Ajax 기본 1. 대전제 ==jquery 가 이미 설치== 되어 있어야 함 2. ajax 기본골격 a. 작성위치 javascript 를 활용하는 거니까, ==script 태그== 에 작성 b. ajax 기본골격 코드 #ajax_기본골격_예제코드 $.ajax({ type: "GET", url: "여기에URL을입력", data: {}, success: function (response) { console.l..

Ⅰ. 이번 회차 학습 목표 (goal) 1. 배우고자 하는 것 서버에서 데이터를 내려주는 ==형태== 이해하기 Ⅱ. Jsonview 활용해서 JSON 데이터를 예쁘게 보기 1. 해봐 서울시 미세먼지 openapi http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99 이걸 좀 더 예쁘게 보려면 -> Jsonview 로 #jsonview_크롬확장프로그램_설치url https://chrome.google.com/webstore/detail/jsonview/gmegofmjomhknnokphhckolhcffdaihd?hl=ko 복사 붙여넣기 해서 -> 추가 그러면, 예쁘게 보임 RealtimeCityAir 의..

Ⅰ. 이번 회차 학습 목표 (goal) 1. 배우고자 하는 것 지금까지 배웠던거 활용해서 퀴즈 풀기 Ⅱ. 퀴즈 풀기 사전 파일 만들기 1. 이 코드 스니펫 복사해서 시작 jQuery + Javascript의 조합을 연습하자! 1. 빈칸 체크 함수 만들기 1-1. 버튼을 눌렀을 때 입력한 글자로 얼럿 띄우기 [완성본]1-2. 버튼을 눌렀을 때 칸에 아무것도 없으면 "입력하세요!" 얼럿 띄우기 클릭 2. 이메일 판별 함수 만들기 2-1. 버튼을 눌렀을 때 입력받은 이메일로 얼럿 띄우기 2-2. 이메일이 아니면(@가 없으면) '이메일이 아닙니다'라는 얼럿 띄우기 [완성본]2-3. 이메일 도메인만 얼럿 띄우기 클릭 3. HTML 붙이기/지우기 연습 3-1. 이름을 입력하면 아래 나오게 하기 [완성..

Ⅰ. 이번 회차 학습 목표 (goal) 1. 배우고자 하는 것 '기록하기' 버튼을 누르면 -> 'posting 박스' 가 나옴 '닫기' 버튼을 누르면 -> 'posting 박스' 가 들어감 Ⅱ. 함수 만들어서 붙여보기 1. 전략 1) 쉬운 함수로 기본 logic 을 완성 = [뼈대 완성] 2) 좀 더 복잡한 함수로 원하는 [디테일 완성] 2. [뼈대 완성] open_box, close_box 함수 만들어서 -> 기록하기 및 닫기 버튼에 붙이기 1) 함수 만들기 2) 기록하기 버튼에 붙이기 내 생애 최고의 영화들 🎬 영화 기록하기 ✍️ 3) 닫기 버튼에 붙이기 기록하기👇 닫기🙌 4) 결과물 3. [디테일 추가] 1) jQuery 사용해서 동일 함수에..

Ⅰ. 이번 회차 학습 목표 (goal) 1. 하고자 하는 것 jQuery ==자주 쓰는 것== 학습 input 박스의 값을 가져와보기 div 보이기 / 숨기기 태그 내 html 입력하기 Ⅱ. input 박스의 값을 가져와보기 1. 뭘 한거야? input box 에 있는 URL 값 가져오기 또는 입력하기 2. 어떻게 접근할거야? URL 값 을 가져오려면 -> URL 을 '지칭' 할 수 있어야 함. '지칭' = 이름표, 짱구의 바지에서 짱구! =='CSS== 에서 지칭' 은 =='Class'== 로 했음 ==jQuery== 에서는 =='id'== 로 지칭 함 ⭐⭐⭐⭐⭐ 영화 URL 값을 가져오기 위해 ID 를 url 로 설정 근데 궁금한..

Ⅰ. 이번 회차 학습 목표 (goal) 1. 하고자 하는 것 jQuery 의의 및 필요성 ## Ⅱ. jQuery 이해 --- 1. 의의 ==HTML 요소를 조작== 하는 javascript 를 미리 작성해둔 라이브러리. Cf. 부트스트랩은 CSS 라이브러리! 예를 들면 이렇게 직관적임. 뭔가 감추라! -> hide 를 쓴다. Ⅲ. 사용해보기 jQuery CDN 부분 참고해서 임포트하기 #code_snipet ⭐⭐⭐ 해당 URL 접속 : https://www.w3schools.com/jquery/jquery_get_started.asp 이거 한줄 추가 하면 돼 👇 다만, 부트스트랩 5.0 템플릿 에는 이미 jQuery 가 추가되어 있음. 💭 What i learned 부트스트랩 5.0 템플릿을 설치하면 -..

Ⅰ. 이번 회차 학습 목표 (goal) 1. 하고자 하는 것 자바스크립트를 통해 홈페이지 '움직임' 을 주기 ex) 버튼 클릭 했을 때 > 나왔다 들어갔다. ex) 서울시 데이터 받아와서 > 내 홈페이지에 이용하기 자바 스크립트 복습 Ⅱ. 자바스크립트 복습 : 홀짝 함수 만들기 해보기 눌렀을 때 마다 -> '홀' 짝' '홀' '짝' 나오게 하기 작성한 코드 🔗 내 생애 최고의 영화들 🎬 영화 기록하기 ✍️ 결과물 추가적으로 배울 것 버튼 색깔 바꾸고 싶을 때 필요한게 -> jQuery div 박스 하나 감추고 싶으면 필요한게 -> jQuery 라이브러리 💭 What i learned 영어를 읽는 것 처럼, 해석이 되는 느낌이 중요하다. 내가..

이번 회차 학습 목표 (goal) 이해 하고자 하는 것 'html, css, Javascript 문법' 에 대한 이해 부트스트랩 쓰기 만들고자 하는 것 팬명록 숙제 1️⃣ 사전 준비 homework.html 파일 만들기 부트스트랩 시작 템플릿 넣기 부트스트랩 시작 템플릿 코드🔗 이걸로 시작해보죠! 2️⃣ 이전 작업 결과물에서 가져오기 스파르타피디아 에서 가져오기 필요 없는 기능들 삭제 핵심은 외워서 쓰는게 아니라 가져와서, 구조 파악하고, 필요한거, 바꿔 끼는거 ⭐⭐⭐⭐⭐⭐⭐⭐ 파친코 사진 하고 싶으니까, 그걸로 바꾸는거 ⭐⭐⭐⭐⭐ 🎊 DJ 작업 시작 ✅ 사진 바꾸기 background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0..