728x90 프로그래밍 언어/Javascript6 Firebase 이용: 데이터를 보내고 가져오는 경우 Firebase와 연결하는 과정에서 설정: 1. onclick이 작동안함 -> $("#id").click(async function () {}) 사용 - 데이터 보내기 $("#id").click(async function () { //id에 click을 줌 let doc = {}; //넣고 싶은 데이터 await addDoc(collection(db, "콜렉션이름"), doc); //데이터를 해당 콜렉션에 추가 window.location.reload(); //페이지 새로고침 }) - 데이터 가져오기 let docs = await getDocs(collection(db, "콜렉션이름")); docs.forEach((doc) => { let row = doc.data(); console.log(row); .. 2023. 9. 14. document ready 페이지가 로딩 완료된 후 동작하는 함수 $(document).ready(function () { alert('안녕!'); }) 2023. 9. 14. JSON, GET, Fetch JSON Key : Value 쌍으로 이루어진 텍스트 기반 개방형 표준 데이터 포맷 주로 서버가 클라이언트로 데이터를 보낼 때 사용 크롬 익스텐션 JSONView를 설치해 JSON을 더 예쁘게 볼 수 있음 GET [클라이언트 -> 서버]: 데이터를 요청할 때의 타입이 존재 GET: 데이터 조회(Read)를 요청 POST: 데이터 생성, 변경, 삭제를 요청 GET 방식으로 데이터를 전달하는 방법 URL의 "?" 이후부터 전달할 데이터 작성(쿼리스트링) "&": 전달할 데이터가 더 있다는 *POST는 전송해야 할 데이터를 HTTP의 body 부분에 담아서 전송 Fetch Fetch 기본 골격 fetch("여기에 URL을 입력") // 이 URL로 웹 통신을 요청한다. 괄호 안에 다른 것이 없다면 GET! ... 2023. 9. 14. DOM, JQuery DOM(문서 객체 모델) 자바스크립트가 쉽게 웹 페이지 요소에 접근하여 조작할 수 있도록 연결시켜주는 일종의 인터페이스 예시 function hey(){ alert('안녕!'); document.getElementById('hello').style.color = 'red'; } 함수 hey()가 호출되면 '안녕!' 메세지창이 뜨고 id가 hello인 요소의 글자색이 red로 바뀐다. JQuery 미리 작성된 Javascript 라이브러리 -> 코드가 간단해짐. import를 해야 함. Javascript일 때 document.getElementById('hello').innerHTML = '안녕'; jQuery일 때 $('#hello').html('안녕'); jQuery CDN 사이에 임포트 JQuery.. 2023. 9. 14. 반복문과 조건문 반복문 forEach let fruits = ['사과','배','감','귤'] fruits.forEach((a) => { console.log(a) }) 조건문 If~else let age = 24 if (age > 20) { console.log('성인입니다') } else { console.log('청소년입니다') } 반복문 + 조건문 let ages = [12,15,20,25,17,37,24] ages.forEach((a)=> { if (a > 20) { console.log('성인입니다') } else { console.log('청소년입니다') } }) 2023. 9. 14. 기초 문법 (변수선언, 리스트, 딕셔너리) 에 작성, onclick="함수명" 영화 기록하기 '영화 기록하기'라는 버튼을 누를 때 hey() 함수가 실행됨 변수 선언: let 변수명 let a = 2 let b = 3 console.log(a+b) // 5 let c = '대한' let d = '민국' console.log(c+d) // 대한민국 사칙연산, 문자열 더하기가 기본적으로 가능 리스트: 순서를 가지고 있는 형태 let a_list = [] // 리스트를 선언. 변수 이름은 역시 아무렇게나 가능! // 또는, let a = ['사과','수박','딸기','감'] // 로 선언 가능 console.log(a[1]) // 수박 console.log(a[0]) // 사과 //리스트 길이 구하기 console.log(a.length) //4 딕셔.. 2023. 9. 14. 이전 1 다음