본문 바로가기

firebase web 연동13

[Firebase&Web연동 14] firebase key를 이용해서 내가 쓴 글만 가져오기 [Firebase&Web연동 14] firebase key를 이용해서 내가 쓴 글만 가져오기 ● 들어가기 전지난 포스팅에서는 firebase storage를 이용해서 파일을 저장하는 법에 대해서 알아보았다. 이번 포스팅에서는 snapshot.key를 이용해서 내가 쓴 글만 조회하는 법에대해서 살펴보도록하자.● 실습순서1.sessionCheck가 완료되면 내가 쓴 글 조회하는 함수 호출2.loginUserKey를 이용해서 현재 로그인 한 사람의 글 데이터 값만 가져오기3.javascript 동적 태그를 만들어줘서 데이터 삽입하고 붙여주기1. 세션체크 완료 후 글조회 함수 호출mypage.html에서 sessionCheck 함수 아래 1초뒤 myThanksList를 가져오는 함수를 호출 한다. 왜 1초뒤에 .. 2018. 3. 2.
[Firebase&Web연동 12] 프로필 페이지 수정 버튼 구현 [Firebase&Web연동 12] 프로필 페이지 수정하기 구현 ● 들어가기 전지난 포스팅에서는 session체크를 해서 로그인한 유저만 마이페이지 접근 할 수 있게 만들었다. 그리고 sessoincheck 로직을 공통모듈로 사용하기 위해서 js 파일을 따로 만들어서 분리시켜주었다. 이번에는 수정 버튼의 id를 이용해서 수정버튼이 눌렸을 때 file 버튼이 활성화 되고, 한줄 글을 적을 수 있는 textarea 태그를 활성화 시켜주는 법을 살펴보자. 시작전에 제일 아래에 첨부한 전체 소스코드를 열어서 살펴보자. 그리고 firebase api script는 꼭 자신이 부여받은 값으로 바꾸는거 잊지말자.● 실습순서1.mypage에서 수정하기 버튼을 눌렀을 때 작동할 함수 만들어 주기2.함수안에 새로운 fil.. 2018. 2. 28.
[Firebase&Web연동 11] 프로필 페이지 session [Firebase&Web연동 11] 프로필 페이지 session ● 들어가기 전지난 포스팅에서는 마이페이지 화면만 만들어 놓았다. 아직 기능이 구현이 안되어있는데, 이번 포스팅부터 화면에 기능을 하나씩 붙여보도록 하겠다. 먼저 session체크를 통해서 로그인한 유저인지 아닌지 확인한 다음 로그인한 유저에게만 마이페이지를 보여주도록 하겠다. 로그인 세션 체크 로직은 앞에서 구현을 해놓았는데 그파일을 따로 js파일로 만들어서 빼주겠다. 왜냐면 index.html,과 mypage.html에서 동시에 접근해야 되기 때문이다. 자세한건 아래에서 설명하겠다.● 실습순서1.sessoinCheck() 함수를 따로 파일을 만들어서 빼주기2.index.html, mypage.html의 태그에 id="mypage" 이런식.. 2018. 2. 27.
[Firebase&Web연동 10] 나의 프로필 페이지 만들기 [Firebase&Web연동 10] 나의 프로필 페이지 만들기 ● 들어가기 전이전포스팅에서는 로그인한 사람만 글을 볼 수 있도록 loginUserKey를 이용해서 sessoin체크를 했고, firebase 데이터 베이스 on 함수로 글을 조회 하는 기능을 구현해 보았다. 이번에는 네비게이션에서 프로필 페이지 메뉴를 클릭하면 프로필 페이지 메뉴로 이동하는 기능을 구현해보겠다. 그리고 간단하게 프로필 페이지를 꾸며보겠다.● 실습순서1.프로필 페이지 만들기2.프로필 페이지 화면 설명● 프로필 페이지 만들기프로필 페이지 화면은 아래와 같다. 소스코드는 제일 아래 첨부해놓았다. 파일을 열어서 확인해보자. 참고로 여기서 페이지 디자인이나 각 엘리먼트의 위치는 크게 중요하지 않다. 중요한 것은 firebase 데이터.. 2018. 2. 27.