Today I Learned
- FIREBASE 특강 다시 보기
- BEM 문법에 따른 전체적인 마이페이지 코드 수정
github에서 폴더 삭제하기
로컬 저장소와 원격 저장소 모두에서 삭제하는 방법
git rm -rf <삭제하고 싶은 폴더나 파일명>
ex) git rm -rf TEST
그리고 커밋과 푸시까지 하면 된다.
git commit -m "delete folder"
git push origin main
Firebase 공부하기
<input type="submit"/>input이 버튼 모양이 된다.
이벤트 리스너
이벤트 리스너는 DOM 객체에서 이벤트가 발생할 경우 해당 이벤트 처리 핸들러를 추가할 수 있는 오브젝트이다. 이벤트 리스너를 이용하면 특정 DOM에 위에 말한 Javascirpt 이벤트가 발생할 때 특정 함수를 호출한다.
이벤트 리스너 등록하기
특정 DOM요소에 이벤트 리스너를 등록할 때는 addEventListener를 사용한다.
DOM객체. addEventListener(이벤트명, 실행할 함수명, 옵션)
각 매개변수를 살펴보면
이벤트명 : Javascript에서 발생할 수 있는 이벤트 명을 입력한다.
함수명 : 해당 변수는 생략 가능하며, 해당 이벤트가 발생할 때 실행할 함수 명을 입력한다.
옵션: 옵션은 생략이 가능하며, 자식과 부모 요소에서 발생하는 버블링을 제어하기 위한 옵션이다.
출처
https://ordinary-code.tistory.com/64
Firebase의 javascript 구조 이해하기
Firebase 특강을 다시 보기 하면서 공부했던 내용은 해당 코드와 보기 편하게 주석으로 작성했기 때문에 블로그에 정리하기 애매해서 오늘은 github 주소를 첨부한다.
https://github.com/heegeer/git_study/tree/main/Firebase%20SPA
CSS position 속성 relative와 absolute의 차이점
| relative | 요소 자기 자신을 기준으로 배치 |
| absolute | 부모 요소를 기준으로 배치 |
출처 https://creamilk88.tistory.com/197
느낀 점
firebase 서버 이용한 SPA 웹페이지 테스트로 한번 구현해보려고 했지만 실패했다. 아마 firebase 연결 자체가 안된 거 같다. 월요일에 firebase에 연결하는 방법을 강의로 제공해준다고 하니 내일 다시 시도해봐야겠다. 오늘은 firebase 특강을 다시 듣고 마이페이지 코드도 전체적으로 수정했다. 근데 js파일로 프로필 이미지나 닉네임을 firebase에서 불러오려면 코드를 또 많이 수정해야 할 거 같다. 그래도 이번 주말은 통째로 SPA와 firebase를 공부하는 데 투자하며 많이 배울 수 있었던 거 같다. 다음 주에도 또 열심히 달려 봐야지!
+) Firebase 특강을 들으면서 javascript 파일의 코드 구조를 많이 이해할 수 있었는데 그 덕분인지 오늘 처음으로 DOM에 대한 개념을 조금이나마 이해할 수 있었다.😇
참고한 블로그
https://blog.naver.com/magnking/220972680805