Firebase
-
[IONIC, Cordova] 카메라, 앨범 사용하기 -2탄-코딩은 주댕이로/IONIC+Firebase 2015. 9. 6. 14:17
소스 다운로드 > https://github.com/cpromise/realtimeChat이 예제에 사용된 소스 : Use Camera and Album(Just take a picture and do nothing with it)을 다운로드 받으시면 됩니다.이 예제를 완성시킨 소스 : Send a image through the camera and the album.을 다운로드 받으시면 됩니다. 1탄 보러가기(클릭) 아니.. 사진 전송이 없는 채팅. 요새 상상이나 할 수 있을까요?아뇨. 없을 겁니다. 그래서 준비했습니다. 호홓 따라오쇼~ STEP 1. 사진 촬영/선택 후 이벤트 처리**편의상 모든 설명은 사진 촬영 기준으로만 합니다.**앨범에서 선택하는 것 또한 동일하오니 복붙해주시면 됩니다. gith..
-
[Firebase, Ionic] E-mail로 회원가입/로그인하기코딩은 주댕이로/IONIC+Firebase 2015. 8. 15. 22:02
소스 다운로드 > https://github.com/cpromise/realtimeChat E-mail주소로 간단한 가입하기. 먼저 화면을 좀 바꿔봅시다. Facebook으로 로그인하기 예제에 이어서 작업할 것이므로 제가 표시한 코드만 참고하시면 됩니다!! Step 1. E-mail, 비밀번호 입력창, 버튼을 만들어 줍시다. 코드에는 어떻게 넣어줬나 보십시다! input태그 2개, 버튼태그 2개를 만들어주었고 Login(), Register()메소드를 사용하겠다고 선언했군요. 그럼 화면은 끝났고 컨트롤러로 가봅시다!! Step 2. Controller를 수정해 봅시다. login(), register()를 구현해주었습니다. * 로그인타입이 여러종류(페이스북, 이메일)이므로 로그인타입을 명시해줬습니다. l..
-
[Firebase, Ionic] 페이스북으로 로그인하기 2탄 (친절주의) (Login with Facebook)코딩은 주댕이로/IONIC+Firebase 2015. 8. 14. 22:50
1탄 보러가기(클릭) 소스 다운로드 > https://github.com/cpromise/realtimeChat 이 예제에 사용된 소스 : initAgain을 다운로드 받으시면 됩니다. 이 예제를 완성시킨 소스 : Login with Facebook을 다운로드 받으시면 됩니다. 이 예제는 Firebase에서 실시간 채팅 구현하기(클릭시이동)에 이어서 진행됩니다. 이제 앱단을 고쳐보도록 합시다! Step 1. 두 번째 탭을 로그인을 처리하는 탭으로 사용합시다~! 이렇게 만들기 위해서 일단 tabs-account.html을 바꿔줍시다~! 간단하쥬~~? 3줄밖에 안썻어요! 저같은 경우는 이미지로 버튼을 대체했는데, 그냥 텍스트로 써주셔도됩니다!! Step 2. 컨트롤러를 수정해줍시다! 로그인버튼을 클릭하면 실..
-
[Firebase, Ionic] 페이스북으로 로그인하기 1탄 (친절주의) (Login with Facebook)코딩은 주댕이로/IONIC+Firebase 2015. 8. 13. 21:03
소스 다운로드 > https://github.com/cpromise/realtimeChat 이 예제에 사용된 소스 : initAgain을 다운로드 받으시면 됩니다. 이 예제를 완성시킨 소스 : Login with Facebook을 다운로드 받으시면 됩니다. + Firebase번외편!! f 페이스북으로 로그인하기 매우 많은 스크린샷으로 안내할테니 따라만 와주신다면 문제없이 작동할 겁니다. Step 1. 페이스북에 앱 등록하기 https://developers.facebook.com/ 으로 이동해주세요. (클릭하면 이동) 이런 화면이 나왔죠? 로그인 하시고 My Apps > Add a New App 을 클릭하여 이동합시다. 하이브리드앱이므로 웹사이트로 만들어줍시다!! 앱의 이름을 적고 Create App I..
-
[Firebase 3편] AngularJS로 실시간 채팅&공유 웹/앱을 만들고 싶다면?코딩은 주댕이로/IONIC+Firebase 2015. 8. 9. 21:18
2탄 보러가기 1탄 보러가기 소스 다운로드 > https://github.com/cpromise/realtimeChat initAgain을 다운로드 받으시면 완성된 샘플소스를 보실 수 있습니다. Firebase로 실시간채팅 만들기 최종편!! Firebase를 적용하는게 요리라면 지금까지 한건 마트에서 장을 본것에 불과합니다. 이제 본격적으로 Firebase을 저희 앱에 심어보도록 합시다! STEP 1. Firebase의 라이브러리를 심어주겠습니다. https://www.firebase.com/docs/web/libraries/angular/quickstart.html 에서 저희는 Angular.js는 이미 갖고있으니 아래에 있는 firebase관련 라이브러리만 가져옵시다. 얘네들만 복/붙해주시면 됩니다...
-
[Firebase 2편] AngularJS로 실시간 채팅&공유 웹/앱을 만들고 싶다면?코딩은 주댕이로/IONIC+Firebase 2015. 6. 15. 22:17
1탄 보러가기 소스 다운로드 > https://github.com/cpromise/realtimeChat initAgain을 다운로드 받으시면 완성된 샘플소스를 보실 수 있습니다. Firebase로 실시간 채팅만들기 2탄이 다가왔습니다. 오늘은 코딩을 하지 않고 코딩을 위한 준비만 하도록 하겠습니다!! 혹시라도 IONIC설치가 궁금하신분은 댓글달아주시면 5분안에 텨옵니다.ㅎㅎ STEP 1. IONIC 프로젝트를 만들어주세요. 프로젝트를 만드실 위치에서 ionic start realtime-chat 프로젝트가 생성이 되었습니다.!!! realtime-chat 디렉토리로 들어가서 ionic serve를 실행해줍니다. serve를 해주면 바로 웹브라우저에서 기본 앱이 실행이 되네요. 채팅에 걸맞는 셋팅을 하기..
-
[Firebase 1편] AngularJS로 실시간 채팅&공유 웹/앱을 만들고 싶다면?코딩은 주댕이로/IONIC+Firebase 2015. 6. 8. 23:13
소스 다운로드 > https://github.com/cpromise/realtimeChatinitAgain을 다운로드 받으시면 완성된 샘플소스를 보실 수 있습니다. https://www.firebase.com/Firebase를 포스팅 하나로 끝내기엔 무리가 있습니다.Firebase는 소규모 데이터 서버라고 생각하고 넘어가도록 할게요 [물론 돈내시면 대규모도 가능] 실시간인만큼 AngularJS와 찰떡궁합이겠죠?AngularJS의 동적 Data Binding에 힘입어 정말 쉽게 실시간 채팅/사진공유[인스타그램이나 카톡] 등등을 만들 수 있어요. STEP 1https://www.firebase.com(클릭) 여기로 이동하셔서 페이지로 이동하신 다음, 우측 상단 SIGN UP을 클릭해서 가입해주세요.가입 절차..