본문 바로가기

매일코딩/firebase 웹 hosting 테스트4

firebase 호스팅 테스트 4단계 글 수정 삭제 기능& 다른사람이 쓴 글 클릭하면 글 조회 firebase 호스팅 테스트 4단계 글 수정 삭제 기능& 다른사람이 쓴 글 클릭하면 글 조회 소스파일 개발일지마이페이지를 들어오면 현재 로그인한 유저의 key 와 글테이블에 넣어놓은 userkey를 비교해서 자신이 쓴글을 전부 가져오기를 성공했다.그리고 dom으로 수정, 삭제 버튼을 붙여 주었고, 수정과 삭제는 토글 기능을 구현해 주었다. 저장을 누르면 저장이 된다.그리고 감사 리스트에서 다른사람이 쓴글을 누르면 프로필 페이지로 이동하고 다른 사람 프로필과 쓴글을 볼 수 있다. 하지만 수정 삭제 버튼은 없다. 이것도 key를 이용해서 처리해 주었다. 그리고 js 인디케이터 기능을 구현해주었다. firebase storege에서 파일을 가져올때 시간이 조금 지연되는것을 발견했다... 이건 조금더 파봐야 .. 2018. 2. 15.
firebase 호스팅 테스트 3단계 프로필 페이지 만들기&html 웹에서 firebase 사진 업로드 firebase 호스팅 테스트 3단계 프로필 페이지 만들기 오늘은 프로필 페이지를 만들었다. html웹에서 firebase로 사진 업로드 하는 기능을 넣었다. 첫 프로필 화면에서 수정버튼을 누르면 사진 선택하기 버튼, 한줄 상태 메시지 수정하기 필드가 활성화된다. 저장하기를 누르면 사진이 firebase 스토리지에 저장이되고 그 URL 주소가 firebase 실시간 DB에 저장이 된다. 수정전 수정중 수정완료 * 남은 이슈1.쓴 글목록 날짜 최신순으로 정렬시키기2.마이페이지 읽어 올때 너무 사진이 너무 느리게 로드 된다. 그래서 사진 로드 되기전에 수정하기 버튼누르면 오류가 발생한다. 웹에는 로딩중이라는 인디케이터 같은게 없을까낭..음.. 그리고 마이페이지 부분 소스코드 정리를 좀 해야겠다..3.닉네임도.. 2018. 2. 14.
firebase 호스팅 테스트 2단계 글목록 불러오기 firebase 호스팅 테스트 2단계 글목록 불러오기 소스코드 오늘 구현할 작업은1.감사일기 삽입하기 (로그인 안되어있으면 글쓰기 불가능, 리스트도 나오지 않음) 2.로그인 되어 있으면 체크해서 감사일기를 쓰기 폼 밑 부분에 리스트로 뿌리기(로그인 안되어 있으면 리스트 안나옴) 3.클릭하면 해당 마이 페이지로(메모 리스트 태그에에 userkey 삽입해놓기) -유저 정보와 유저가 쓴 글목록 보이게 하기 4.내가 쓴 글이면 수정 삭제 가능(버튼이 보이게하기) 파이어 베이스 부분 일지 파이어베이스에 감사일기를 담는 thanks라는 최상위 테이블(객체)를 생성하는데 애를좀 먹었다. 익숙하지가 않아서...감사리스트는 로그인 되어 있으면 js 단에서 동적으로 가져와서 실시간으로 만들어 준다.글을쓴 후 쓰기 버튼을 .. 2018. 2. 13.
firebase 호스팅 테스트 1 단계 firebase 호스팅 테스트 1 단계 firebase 테스트 한 결과 개인적으로 정리하는 페이지 입니다.(가입,로그인,로그아웃) ..정리 보다는 기록을 위한 페이지 입니다.. 소스파일 파이어 베이스 부분 작업순서0.파이어베이스 프로젝트 생성1.node.js 설치2.firebase 설치3. 바탕화면에 폴더 만들고4. firebase init5. public 폴더 만들어서 index.html 생성5-1. firebase serve 로 서버 가동 6.메인 페이지 만들기7.로그인 되어 있는지 안되어 있는지 확인하기 8.가입페이지 만들기-가입성공하면 바로 메인화면으로 리다이렉트9.로그인 페이지 만들기-로그인 했으면 메뉴이름을 '로그아웃'으로 바꿔주기- 로그인 했으면 메뉴 이름을 닉네임으로 바꿔주기 10.로그아웃.. 2018. 2. 12.