ionic3-typescript-firebase by Jorge Vergara

*이 글은 https://javebratt.com/firebase-objects-ionic-2-app/ 의 내용을 번역한거다.오랜만에 ionic으로 하이브리드 앱을 개발하려고 보니 너무 많은 것들이 바뀌어 있었다.ionic3로 무작정 시작했는데, angular4와 typescript라는 생소한 언어는 무작정 도전할 수 있는 게 아니었다.거기다 typescript도 생소한데 여기에 firebase까지 사용하려니 난감했다.그러다 발견한 이 자료! 너무 큰 도움이 되었다. 다른 초급자 분들께도 추천해주고 싶어서 막가파 번역을 진행했다.이 글에 있는 것은 My Event Manager만 포함된 내용으로, 모든 내용이 포함된 PDF를 보려면 돈을 지불해야 한다.Chapter2를 읽어본 나로써는 별로 아깝지 않을 ..

개발/하이브리드앱 2017. 8. 18. 14:53

[jQueryMobile][하이브리드앱 개발] 다이얼로그(팝업) 띄우기

jQueryMobile로 하이브리드 앱을 만들 때 내가 구성할 다이얼로그를 페이지 위에 띄우고 싶을 때가 있다.이를테면 DB에 field 값을 채우기 위해 Rest API 를 이용하는 경우 등이다.방법은 매우 간단하다. HTML먼저, jQueryMobile로 페이지를 구성할 때는 보통 다음과 같다. 여기에 원하는 다이얼로그(팝업) 폼을 안에 구성한다. JavaScript이후 만들어둔 다이얼로그(팝업)을 원하는 시점에 띄우면 된다. 여기서는 id를 이용해서 띄운다. 참고

개발/하이브리드앱 2016. 11. 2. 10:47

[AngularJS] AngularJS 1.X Services

Codecademy AngularJS 1.X service 관련 내용 정리Service 를 사용하지 않아도 Controller에 데이타를 추가하고, View에서 보여줄 수는 있다.하지만 100개의 아이템을 담는 데이터를 포함하고 있거나, 날씨나 금융처럼 끊임없이 변화하는 데이터는 어떻게 하겠는가?데이터를 하드 코딩하는 것은 더 이상 아무의미가 없을 것이다.더 나은 방법은 서버로부터 라이브 데이터를 읽어오는 것이다. 이것은 service를 통해서 수행할 수 있다.다음은 서비스를 만드는 순서이다. 서비스 만드는 순서1. factory 를 만든다. app.factory('forecast', ['$http', function($http) { return $http.get('https://s3.amazonaws...

개발/하이브리드앱 2016. 8. 12. 19:02

[AngularJS] AngularJS 1.X Directives

codecademy AngularJS 1.X directive 관련 내용 정리ng-app , ng-controller, ng-repeat, ng-src 등은 이미 구현되어 있는 directives이다.directives에 대해서 무엇을 일반화 시킬 수 있을까? Directives는 HTML elements에 동작을 결합한다.앱이 실행되면, AngularJS는 각 HTML element가 directives를 찾을 수 있도록 안내한다.그 중 하나를 발견하면, AngularJS는 그 동작(scope를 붙이거나 배열 반복 등)을 수행하도록 한다. 직접 directive 구현해서 이용하기 app.directive('appInfo', function(){return{restrict: 'E',scope:{info:..

개발/하이브리드앱 2016. 8. 12. 14:53

[아이오닉]로컬 이미지를 불러올 수 없을 때

출처 : https://github.com/driftyco/ionic-view-issues/issues/54문제 아래 그림처럼 이미지 경로를 제대로 입력해주었는데, 실제로는 하이브리드 앱에서 이미지가 보이지 않는다. 해결 방안'/' 부분을 제거한다. 에디터에서는 제대로 된 경로가 아니라고 표시되지만, 아이오닉에서는 이렇게 해야 제대로 된 경로가 된다. 위의 문제에서는 path가 'lib/super....' 가 되어야 한다.

개발/하이브리드앱 2016. 8. 8. 17:00

[아이오닉] 이미지 리소스 문제 해결 방법

경로 문제 해결방안

개발/하이브리드앱 2016. 8. 5. 13:59

[아이오닉] The provided path "......" is not an Android project 문제 해결

둘이서 하는 프로젝트에서 깃허브를 통해 아이오닉 하이브리드앱을 만들고 있었다.깃허브에 푸시가 불필요하다고 생각했던 부분들은 푸시가 되지 않도록 했고,이 과정에서 어떤 문제가 있었는지 다음과 같은 에러가 발생했다. 문제점 : 터미널에서 "ionic run android" 명령어 실행시,Error: The provided path "......./platforms/android" is not an Android project 라는 에러 발생. 첫째로 "ionic platform add android" 해보았더니 "Error: Platform android already added" 라는 에러가 발생했다.이미 플랫폼은 존재하는데, 안드로이드 프로젝트가 뭔가 잘못된 것 같다.그래서 다음과 같이 해결하였다. 해결..

개발/하이브리드앱 2016. 8. 4. 11:05

[아이오닉] ionic에서 input 태그의 내용 확인하기

아이오닉에서 input 태그의 내용을 alert로 확인하는 방법 먼저 html 내용이 다음과 같다고 생각해본다.사용자 이름을 입력하는 input 태그와 비밀번호를 입력하는 input 태그가 있고,input의 내용을 받아서 로그인을 실행하는 doLogin() 함수를 실행하는 Login 버튼이 있다. UserName Password Login 모델을 사전에 정의해두는 방법을 이용하면 된다.위의 html에 'loginCtrl' controller이 걸려 있다면 사전에 ng-model에 대한 내용을 정의하고, 이를 불러와서 쓸 수 있다.아래의 코드에서, loginCtrl controller가 미리 ng-model인 username을 정의해두고, 로그인 버튼을 눌렀을 때, input에 작성된 username을 가..

개발/하이브리드앱 2016. 8. 3. 14:11

[ionic(아이오닉)] 버튼 클릭으로 div 내용 숨기기

ionic에서 div 속성을 숨기거나 보이게 하기 위해서는 ng-show 속성을 이용하면 된다.원문 내용 : https://forum.ionicframework.com/t/solved-how-to-hide-a-div-by-clicking-a-button/9422/7 코드를 보면, ng-show 속성을 controller에서 버튼 클릭시에 true나 false로 바꿈으로서 item을 보이게 하거나 숨기고 있는 걸 알 수 있다.index.html Card 1 Card 2 Start now controllers.js .controller("StartpageCtrl", function($scope){ $scope.showstartCard = true; $scope.showsecondCard = false; $s..

개발/하이브리드앱 2016. 8. 3. 11:19