- 회사 App을 만드는 프로젝트를 진행하면서 궁금해진 Flutter 언어. 안드로이드와 IOS를 동시에 지원하기 때문에 유지보수에 편리함을 가져다 줄 수 있어서 최근 많은 관심을 갖게 된 언어이다.

- 아직은 국내에 활성화 되지 않아서 Flutter 개발자가 많지 않아 회사 App은 기존 방식으로 개발 하고 있지만, 안드로이드와 IOS 개발자를 동시에 투입해야 하는 것에 비해 Flutter개발자만 있어도 두 OS를 동시에 지원하는 비용이 더 저렴하니 머지않아 이런 방식으로 바뀌지 않을까 생각해 본다.

-Flutter 책과 동영상 강의로 공부를 시작했지만 적지 않은 나이와 회사 사무를 보면서 별도의 공부를 진행한다는 것은 쉽지 않은 과정이다. 조금씩 알아가는 재미와 코딩을 따라가는 재미가 있어서 시작했는데, 책을 덮고, 동영상이 끝나면 정리가 되지 않은 것 같아서 이곳에 필요한 기능에 대한 설명과 그 기능을 위한 환경설정 부분을 중접으로 이곳에 정리를 시작해 본다.

그 첫번째로 웹화면을 제공하는 블로그나 사이트 화면을 App으로 서비스 가능하게 하는 WebView 기능에 대해서 정리하고자 한다. 우리 회사는 지하주차장 이용시 할인 등록을 웹화면 서비스로 제공하고 있다. 이 화면을 App으로 감싸서 폰에서 이용하면 좋을 것 같아서 이 기능을 사용하기 위한 환경설정 등을 이곳에 기록해 두려고 한다. 

 

1. WebView 패키지 추가하기

-pub.dev 사이트에 접속하여 webview_flutter 패키지를 찾는다. 원하는 버전의 패키지를 찾아서 패키지 명 옆에 있는 복사 아이콘을 클릭한다.

-안드로이드 프로젝트 화면으로 돌아와서 web_view프로젝트 아래의 test 폴더 아래 pubspec.yaml 파일을 오픈한다.

- 파일 중간 아래쯤에 dependencies 부분을 찾아 아래와 같이 수정해야 한다.

dependencies:
    flutter:
        sdk: flutter

    cupertino_icons: ^1.0.2   라고 되어 있는 라인을 찾아 그 다음줄에 복사한 webview_flutter 버전을 붙여넣기 한다.
    webview_flutter: ^3.0.0  (<-- 버전은 배우고 있는 버전을 추천, 최신버전은 설정이 추가적으로 필요할 수 있음)

 

- 그리고 한가지 더 수정이 필요한데, android/app/build.gradle 파일을 열어 속에 있는 minSdkVersion을 20으로 수정해야 한다.

android {
    defaultConfig {
        minSdkVersion 20   // 이부분을 수정한다.
    }
}

 

Posted by 천칭
,

다들 징검다리 연휴 잘 보내셨는지요. 우리가족은 몇번의 논의 끝에 오후 3시까지 가족과 함께 영종도에서 조개구이 점심을 먹고 바닷가 산책후 돌아와 아이들은 친구들과 영화관람, 우리부부는 다음날 출근을 위한 쉼을 갖기로 하였습니다.
우리집에서 영종도까지는 보통 45분정도 소요되는데 가는길에 오랜만에 애플뮤직 플레이에서 추천곡을 틀어 놓고 있었어요.  김현식의 “언제나 그대 내곁에”라는 곡이 나오고 나혼자 흥얼거리면서 운전을 하면서 가고 있었지요. 아이들은 들어보지 못한 가수의 노래니 별 관심이 없었고요.
다음 곡으로 나온 것은 유재하의 노래였어요. 역시 아이들은 모르는 가수였는데, 이 아저씨 원래 조용필 아저씨 밴드인 위대한 탄생의 키보드주자(처음엔 베이스주자인줄 알았음)였다고 알려주고 원래 클래식 음악전공의 뛰어난 뮤지션이었다고 하니 조금 관심을 갖더라구요. 자신의 앨범을 오직 한장만 만들고 요절한 가수이고 그 앨범의 모든 곡이 인기곡이었다고 하니 믿지 못하겠다는 반응이었어요.  첫 앨범을 만들고 방송국 PD들에게 홍보했지만 노래를 잘 못한다(가창력 부족)는 평을 듣고 방송에는 잘 나오지 않았지만 청취자들의 요청쇄도로 서서히 인기를 끌 무렵 유재하는 87년 11월 1일 교통사고로 사망했어요. 아마 저는 그당시 이문세 아저씨가 진행하는 별이 빛나는 밤에 라이도를 듣다가 이 소식을 직접 들었던 기억이 납니다. 지금도 좋아하는 앨범 1순위로 꼽을 만큼 좋은 곡들로 구성된 앨범이지요.  이런 이야기를 아이들에게 알려주었는데 문득 앞에 들었던 김현식 아저씨가 생각나는 겁니다.
얘들아.. 아까 들었던 김현식 아저씨도 유재하 처럼 11월 1일에 돌아가셨어.  그무렵 11월 1일은 아까운 가수들이 생을 마친날이라고 해서 특별히 그들의 노래를 틀곤 했었지…  아! 그리고 너희들 큰엄마가 간호사로 근무하셨던 동부이촌동 병원에 간경화로 입원해서 돌아가시기 전까지 계셨던것으로 기억나네… 여기까지 이야기하니 아이들은 더욱 관심을 갖더군요.
이렇게 운전하면서 목적지까지 가는동안 제가 좋아했던 노래와 가수들의 이야기를 할 수 있었고, 아이들과 함께 들으면 좋을 곡들은 함께 들으며 목적지까지 잘 갈 수 있었습니다.
가수와 노래에 얽인 이야기들우리가 아는 사람들의 이야기로 함께 풀어나가니 마치 DJ가 된듯한 묘한 기분마져 들었습니다. 아이들 학업때문에 멀리 여러날 여행은 못하지만 오랜만에 아이들과 많은 이야기를 한 기분 좋은 날이었습니다.

Posted by 천칭
,

디지털 액자를 만들어봐야 겠다고 손을 댄지 시간이 흘러 예전 버전의 정보만으로는 만들기도 어려워졌고, 새로운 버전에 맞는 정보를 찾기도 어려워 졌다. 조금씩 맞는 정보들의 조합으로 하나하나 맞춰가다보면 정보부족의 벽에 부딪히고 만다. 

다행이 유튜브 "공대선배TV"를 통해 하나하나 따라가다보면 막혔던 부분에 대한 설명이 있어서 원하는 MagicMirror를 구성하고 유튜브 플레이까지 성공하고 구글 어시스턴트를 구현 할 수 있다. 

이렇게 사용하다보면 Alert기능에 의해 사용중인 모듈의 새로운 버전이 나오고 업그레이드가 필요하다는 메시지를 화면에 출력한다.  모듈의 경우 해당 디렉토리에 가서 [ npm run update ]를 실행하면 대부분 업데이트가 완료된다.  

그러나 정작 벽에 부딪히는 것은 메인 프로그램인 MagicMirror의 업데이트가 필요한 경우이다.  이 경우 MagicMirror 디렉토리에서 npm run update 로는 업데이트 되지 않는다.(node.js에대해서 아예 모르고 시작했다. 지금도 잘 모른다.)

과련 내용은 https://docs.magicmirror.builders/getting-started/upgrade-guide.html 사이트에 설명되어있다.

직접 해본바로는(기본 설정관련 사항을 백업하라고 했지만 안해도 되는 듯 하다. 조심할 필요는 있겠지...)

git pull && npm install --only=prod --omit=dev

위의 명령으로 새 버전을 가져와서 다시 인스톨하는 듯 한데... 실제로는 여러가지 에러를 나타낸다.(난 잘 안되었다.)

git reset --hard     이 명령어로 초기화하고 

git pull    이 명령어로 새 버전의 MagicMirror를 가져와서 실행할 수 있었다.

매직미러를 구성하고 상시운영하는 액자를 만들지 않았기에 자주 사용하지는 않지만 가끔 생각나서 실행시켜보면 나타나는 업데이트들... 모듈은 쉽게 해결하였지만 MagicMirror에 대한 업데이트에 관련한 내용은 우리나라 사이트에서는 찾기 어려웠다. 이번 글도 나의 필요에 대한 대답을 잊지 않기 위해 작성해 둔다.

Posted by 천칭
,