분류 전체보기308 2023-10-06, Today I Learned 1. DataSnapshot.forEach() 를 사용하면 Datasnapshot의 하위 항목이 쿼리 순서대로 반복됨 child가 하위 항목임 const dbRef = database.ref('logs'); dbRef.on("value", (snapshot) => { snapshot.forEach((child) => { const object = child.val(); if (id == child.ref.key) { if (object.pw == password) { dbRef.child(id).remove(); } else { alert("잘못된 비밀번호"); } } }); }); 명시적인 orderBy() 메서드를 사용하지 않으면 결과가 키순으로 반환됨 내 db에 'ups'가 존재하지 않아서 그냥 생.. 2023. 10. 6. [내일배움캠프][미니프로젝트] 개인페이지 만들기 사진을 2열로 글자랑 같은 공간을 차지하게 배치하는 것이 생각보다 까다로웠다 쉴 때는 침대에 누워서 주로 아이패드로 영어공부를 합니다 책상에 앉아서 개발공부를 합니다 자주 가는 카페의 이 자리에 앉으면 집중이 잘 됩니다 동네 공원을 매일 산책합니다 .photos { width: 700px; height: 300px; display: flex; text-align: center; flex-direction: column; } .photo { width: 140px; height: 110px; /* object-fit: contain; */ margin-right: 5px; margin-bottom: 5px; border-radius: 20px; flex:1; text-align: center; vertic.. 2023. 10. 6. 2023-10-05, Today I Learned 1. html에서 스크롤바를 만들고 싶으면 overflow: auto를 이용한다. 하위 컨텐츠의 길이가 컨테이너를 초과했을때 스크롤을 생성해 줌 2. html 요소를 오른쪽으로 밀어서 표시하고 싶으면 float:right 속성을 부여한다 3. 말고 을 사용하면 줄바꿈이 되지 않고 다른 요소 옆에 가서 붙는다 4. JQuery 쓰려면 다음 코드를 html에 추가한다 5. Javascript에서 오늘 날짜를 이용할 때는 다음과 같이 한다 const today = new Date(); let day = today.getDate(); let month = today.getMonth() + 1; let year = today.getFullYear(); let date = `${year}-${month}-${day.. 2023. 10. 5. 스파르타코딩클럽 사전캠프 5주차 db연결 복습+ 배포 어제 한 거랑 똑같이 스파르타플릭스도 db연결한다 DB에 저장 $("#postingbtn").click(async function () { let image = $('#image').val(); let title = $('#title').val(); let comment = $('#comment').val(); let stars = $('#stars').val(); let doc = { 'image': image, 'title': title, 'stars': stars, 'comment': comment } await addDoc(collection(db, "movies"), doc); window.location.reload(); }) 잘 들어가는 모습을 확인할 수 있다 DB에서 불러오기 let doc.. 2023. 9. 27. 스파르타코딩클럽 사전캠프 4주차 Firebase 연결 Firebase db 생성 파이어베이스 접속 https://firebase.google.com/?hl=ko Firebase | Google’s Mobile and Web App Development Platform Discover Firebase, Google’s mobile and web app development platform that helps developers build apps and games that users will love. firebase.google.com 우측 상단의 Go to console(콘솔로 이동) 누른다 프로젝트 만들기를 누른다 다 동의하고 계속 누름 웹 누름 규칙의 false를 true로 바 게시함 Firebase db 연결 프로젝트 설정에 가서 Compositio.. 2023. 9. 25. 스파르타코딩클럽 사전캠프 3주차 JQuery + fetch 저번에 만들었던 앨범에서 추억 저장하기 버튼을 누르면 기록하는 파트가 나오고 또 누르면 사라지는 기능을 구현해보고 기록하기 누르면 카드가 자동생성되는 거 해본다고 함 버튼 눌러서 Toggle로 열고 닫기 1 JQuery를 쓸 수 있게 사이에 임포트한다 토글할 부분에 id를 부여한다 구글에서 아무 이미지 소스나 갖다 넣었다 짠 이미지와 내용이 나타나게 된다 떡볶이가 맛있어 보인다 왼쪽은 이미지 소스 주소 대신에 텍스트 대충 입력했더니 에러나서 엑박뜨고 있는 모습이다 but 새로고침하면 떡볶이는 사라지게 된다 왜냐하면 그냥 코드를 불러오는데 db연결도 안 되어있으니 그냥 붙이는 기능만 달린 백지상태로 불려와서.. 버튼으로 Toggle해서 열고닫기 2 예전에 한 스파르타플릭스로 실습한다 영화 기록하기 버튼에다.. 2023. 9. 19. 스파르타코딩클럽 사전캠프 2-3주차 JQuery JQuery 타이틀 밑에 넣어준다. 스파르타플릭스 결과 확인하기 버튼을 눌렀을 때 Harry Potter가 나오게 된다. 변수 출력 function checkResult() { let a = '사과' $('#q1').text(a) } 반복문으로 리스트 출력 버튼 한번 누르면 다 나옴 키보드상에서 ~와 같이 있는 `(백틱)은 HTML element를 통째로 묶어서 다룰때 쓴다. 문자와 변수를 함께 쓸 수 있게 한다 let profile = `${}의 나이는 ${}살 입니다` 반복문으로 딕셔너리 출력 function checkResult() { let people = [ { 'name': '서영', 'age': 24 }, { 'name': '현아', 'age': 30 }, { 'name': '영환', 'ag.. 2023. 9. 14. 스파르타코딩클럽 사전캠프 2주차 Javascript Javascript style 밑에 script 생성 실행시키고 개발자 도구 Console에 가면 로그가 찍혀있다. Alert 기록하기 버튼을 눌렀을 때 Alert 창이 뜨게 만들어 본다. 기록하기 버튼에 onclick으로 함수를 연결해준다 상세정보 버튼을 누르면 영화 제목 색이 바뀌게 해본다. 제목을 부를만한 이름표가 필요해서 id값을 넣어준다. Ginny & Georgia function color(){ document.getElementById('title').style.color = 'red'; } 상세정보 상세정보를 눌렀더니 영화 제목이 바뀌었다. 2023. 9. 14. 스파르타코딩클럽 사전캠프 1주차 HTML+CSS HTML html 페이지를 만들어 보았다. 내용 나는 구역을 나누죠 나는 문단이에요 bullet point!1 bullet point!2 h1은 제목을 나타내는 태그입니다. 페이지마다 하나씩 꼭 써주는 게 좋아요. 그래야 구글 검색이 잘 되거든요. h2는 소제목입니다. h3~h6도 각자의 역할이 있죠. 비중은 작지만.. span 태그입니다: 특정 글자를 꾸밀 때 써요 a 태그입니다: 하이퍼링크 img 태그입니다: input 태그입니다: button 태그입니다: 버튼입니다 textarea 태그입니다: 나는 무엇일까요? The ul element represents a list of items, where the order of the items is not important — that is, where .. 2023. 9. 7. 이전 1 ··· 27 28 29 30 31 32 33 ··· 35 다음
