플러터 이용에 필요한 준비를 모두 마쳤으니, 이제 잘 작동하는지 테스트를 해 보겠습니다. 즉, 테스트 앱을 하나 만들어보겠다는 이야기입니다.
- VS Code 를 실행하고 명령어 팔렛트를 엽니다.
2. 위 이미지처럼 ‘flutter’를 입력하면 나오는 목록에서 New Project 를 선택합니다.
3. 위 이미지처럼 템플릿을 물으면 Application 을 선택합니다.
4. 해당 프로젝트를 저장할 위치를 묻는데, 적당한 디렉토리를 선택해 줍니다. (여기서 정해주는 디렉토리 아래에 다시 프로젝트용 디렉토리가 생기게 됩니다.)
5. 프로젝트 이름도 입력해 줍니다. 그러면, 잠시 뭔가 진행되고 아래처럼 준비가 됩니다.
파인더에서 저장된 위치로 가 보니, test 디렉토리 아래에 다시 test_drive 라고 디렉토리가 생기고 그 안에 파일들이 저장되어 있네요.
다음부터는 test 입력한 시점에 projects 를 선택하면 그 아래에 프로젝트들이 디렉토리 단위로 저장이 되겠습니다.
lib 디렉토리 안에 있는 main.dart 파일이 열렸습니다. 이 main.dart 파일이 시작입니다. 확장자는 dart 로 dart 파일이라는 것을 알려주네요. dart 언어도 배워야합니다.
파일에 Run | Debug | Profile 이 있습니다. 그냥 문자려니 하고 Debug를 클릭했더니, 뭔가가 진행됩니다.
DEBUG CONSOLE 에 뭔가 다운로드받고 있다고 표시됩니다. ios tools, ios-profile tools…
Flutter: Launching.. 이라고 표시가 됩니다. 오~ 빌드하고 실행이 되려나 봅니다.
하지만, 실패입니다.
맥북에 연결되어 있는 iPhone Xs Max 에서 실행하려고 시도했나본데, Signing 에 문제가 있어서 실패한 것 같습니다. test_drive/ios/Runner.xcodeproj 를 Xcode 에서 열고, Singing 설정을 해 줘야겠습니다.
Runner.xcworkspace 를 열도록 하겠습니다.
Flutter SDK 가 iOS 빌드를 위해서 프로젝트를 잘 만들어 준 것 같네요. Signing & Capabilites 에 가서 Team 부분을 열어 개발자 계정을 선택해 줍시다.
그리고, 다시 VS Code로 와서 [F5]를 눌러 Start Debugging 을 시도해 봅니다.
콘솔에 로그가 찍히고, 아래처럼 VS Code에게 권한을 주도록 요청을 하네요.
아이폰에도 보니 아래처럼 묻는 창이 떴습니다.
둘 중 한군데에서 [확인] 선택하면 묻는 창은 사라지고, 아래처럼 앱이 실행되는 모습을 볼 수 있습니다.
짜잔~! dart 언어를 이용해서 코드를 짜면 아이폰에서 실행되는 앱을 만들 수 있다는 사실을 확인했습니다.
이 참에, 공식 사이트 문서에서 설명하는대로 플러터의 hot reload 를 테스트해 볼 수 있습니다.
아이폰에 앱이 실행되고 있는 상태에서 main.dart 를 수정해 보겠습니다.
테스트 앱의 화면 가운데에 “You have pushed the button this many times” 문자열이 있습니다. main.dart 109번째 줄에 이 문자열이 있습니다.
“pushed”를 “clicked” 로 변경을 하고 VS Code 상단에 있는 번개 아이콘을 클릭합니다. 이 아이콘은 Save and Hot Reload 입니다. 그러면 새로 빌드 과정을 거치는 것이 없이, 아이폰 화면에 문자열이 곧바로 변경되는 것을 볼 수 있습니다.
핫 리로드! 아주 유용한 기능이네요.
여기까지 가능한 것을 보니, 환경 설정은 제대로 된 것 같습니다.
끝!
Leave a Reply