Ⅰ. 이번 회차 학습 목표 (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..

이번 회차 학습 목표 (goal) 이해 하고자 하는 것 'Javascript 문법' 에 대한 이해 만들고자 하는 것 미세먼지가 40 미만인 지역만 뽑아내기 Javascript 자주 나오는 패턴 익히기 자주 나오는 패턴 학습에 있어, 자주 나오는 것은 굉장히 중요함. 1️⃣ console.log 를 통해 데이터가 어떻게 생겼는지 파악하기 let mise_list = [ { MSRDT: "201912052100", MSRRGN_NM: "도심권", MSRSTE_NM: "중구", PM10: 22, PM25: 14, O3: 0.018, NO2: 0.015, CO: 0.4, SO2: 0.002, IDEX_NM: "좋음", IDEX_MVL: 31, ARPLT_MAIN: "O3", }, { MSRDT: ..

이번 회차 학습 목표 (goal) 이해 하고자 하는 것 'Javascript 문법' 에 대한 이해 Javascript 기초 문법 이해 하기 Ⅰ. 함수 함수란 ==정해진 동작== 을 하는 녀석들 함수 정의하기 (syntax) function sum(a,b){ alert(a+b) } [요소 읽어보기] function : 이제 앞으로 함수다~ 라는 거 sum(a,b) : '함수 이름'이 sum 이고, '함수의 인자' 로 a,b 를 받겠다는 것 { } : 해당 함수가 호출되면 -> 이 부분이 자동적으로 실행된다는 의미. '구역' 의 의미 alert(a+b) : 그러면 sum 함수를 호출하면 -> 1) 자바스크립트 자체 함수인 alert 가 실행된다. 2)..

이번 회차 학습 목표 (goal) 이해 하고자 하는 것 'Javascript 문법' 에 대한 이해 Ⅰ. Javascript 기초 문법 이해 하기 javascript 를 script 태그 사이에 썼음 이 scrpit 태그와 동일한 것이 검사 > colsole 창 ⭐⭐⭐⭐⭐ 그래서, 해당 코드를 vs code에 치면 -> console 에서도 사용할 수 있음. -> console 에서도 같은걸 친 효과? -> console 에서는 =='이 내용을 이어서!'== 쓸 수 있음. 그 효과는 이러함 👉 ==hey( ) 가 이어 져서 작동하게 된다.== Ⅱ. 프로그래밍 언어를 배울 때는 5가지 요소가 중요 변수, 자료형, 함수, 조건문, 반복문 1. javascript 변수 변수 선언 문..

이번 회차 학습 목표 (goal) 이해 하고자 하는 것 'Javascript' 에 대한 이해 Javascript 기초 이해 하기 Ⅰ. Javascript 란? 프로그래밍 언어 중 하나 ==브라우저== 가 알아들을 수 있는 언어 python을 알아들 을 수 있는 브라우저, javascript를 알아들을 수 있는 언어 등을 따로 만들면 -> 굉장히 불편할 것 -> so, 브라우저 가 알아들을 수 있는 언어를 javascript 로 정함 즉, 모든 인터넷을 구현할 때, 'javascript' 만 쓰자! = 이게 =='표준'== 이라는 개념. Java 랑 Javascript 의 관련성? 없음. Ⅱ. javascript 를 어떻게 사용? 1. 어디에서 써? style 밑..

이번 회차 학습 목표 (goal) 이해 하고자 하는 것 'CSS' 기본 HTML 및 CSS 셋팅 하고 난 후 -> ==부트스트랩 활용 해보기== 만들고자 하는 것은? 이런 box 만들고 '모바일 처리' 까지 하기 복습 방법 이 노트도 한 큐에 완성할 수 없음. 동영상 및 사진을 바로 넣을 수 있어야 빨리 들어가게 할 수 있음. ⭐⭐⭐⭐⭐ ⭐⭐⭐⭐⭐⭐⭐⭐ 만들어보기 Ⅰ. 기초 html 및 css 작성 html 영역 최종 코드 간단한 글씨를 씁니다. css 영역 최종 코드 .mypost{ /* div 영역 잡을 때, 백 그라운드 영역 잡고 하는게 좋음 ⭐⭐ */ /* background-color: green; */ width: 500px; /* 위에 살짝 띄우고 div 영역 잡..

이번 회차 학습 목표 (goal) 이해 하고자 하는 것 'CSS' 기본 HTML 및 CSS 셋팅 하고 난 후 -> ==부트스트랩 활용 해보기== 만들고자 하는 것은? 이런 card 모양 이미지 붙고, 별 붙고 하는 것! 까지 학습 목표 기초적인 CSS 지식 + 부트스트랩 적재적소 활용 만들어보기 Ⅰ. 부트스트랩에서 '원하는 card 스니펫' 복사 1. 부트스트랩 docs🔗 부트스트랩 5.0 템플릿 https://getbootstrap.com/docs/5.0/components/buttons/ 이 카드 꾸러미 밑에 있는 스니펫 복사 스니펫 원본 원본 ```html Card title This is a longer card with supporting text below as a..

이번 회차 학습 목표 (goal) 이해 하고자 하는 것 'CSS' ==부트스트랩 활용 위한 CSS 배우기== 만들고자 하는 것은? 이것을 만들 것 임 학습 목표 기초적인 CSS 지식 + 부트스트랩 적재적소 활용 만들어보기 Ⅰ. (이전 강의 누적) index.html 파일 만들고 -> 부트스트랩 탬플릿 복사해서 넣은 상태에서 시작 이전 강의 까지 한 코드 스니펫 🔗 나는 버튼이다! (쫳👏) Ⅱ. 기본 HTML 로 기본 뼈대 만들고 -> CSS 로 기본적으로 꾸미기 (부트스트랩 아님) 1. 기본 html 작성 및 css 넣기 (1) 가운데로 오게 하기 ⭐⭐⭐ #display_flex 이 과정에서, 처음 본, 낯선, 그러면서 중요한 코드 블록 #code_snipet /* ⭐⭐⭐ 가운데로 손쉽게 ..