Flutter

플러터 1년차가 말하는 '정말 배워도 괜찮을까?'

20년 10월부터 현재까지 플러터로 30만 다운로드의 글로벌 서비스를 개발 및 서비스하고 있는 주니어 개발자이다. 라고 말하고 다니기 너무 부끄러운 수준이지만, 플러터로 개발을 시작하는 사람들이 갖는 궁금증들을 1년 내내 고민해왔기에 글을 쓰게 되었다. 플러터의 기술적인 부분 보다는 커리어 적인 부분에서 작성한 글이다! 이전에 플러터에 관해 썼던 글이다. 아래 링크의 글은 플러터 장단점에 대한 글이다. RN과 네이티브와의 차이점에 대해 설명되어 있으니 참고하면 앱 개발 프레임워크에 대한 선택에 도움이 될 것이다. [Flutter] 플러터 이해하기 1. Flutter와 Dart의 개념 플러터라고 하면 항상 다트라는 용어가 나온다. 다트는 언어, 플러터는 다트를 사용하여 모바일 어플리케이션을 개발할 수 있는..

[플러터] 가로 모드 회전 막기

가로 모드로의 회전을 막는 방법은 매우 간단하다. 아래의 코드를 main 함수에서 실행하면 된다. SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]); 추가로 ios에서는 다음과 같은 작업이 필요하다. UIInterfaceOrientationPortrait info.plist에 위 구문 추가 Runner를 X code로 오픈 후 device orientation의 portrait 옵션 활성화.

[Flutter web] Firebase 구글 로그인

[Flutter] 플러터 Web 개발하는 법 21/11/27 수정된 글입니다. 플러터는 모바일 애플리케이션과 웹을 동시에 제작할 수 있게 고안된 프레임워크이다. 그리고 최근 2.0에서 리눅스, 맥, 윈도우와 같은 응용프로그램들도 개발 할 수 있 muhly.tistory.com [플러터 web] 플러터 웹과 Firebase 연동하기 [Flutter] 플러터 Web 개발하는 법 플러터는 앱&웹을 동시에 제작할 수 있다. 앱을 크롬과 같은 웹 브라우저에서 실행 시키는 건데, 전통적인 웹과는 인터페이스가 다르다. 디스코드를 생각하면 쉽 muhly.tistory.com 기본적인 플러터 웹의 Firebase 설정은 위의 포스팅들을 참고하길 바란다. 이번엔 Firebase와 플러터 웹을 이용해 구글 로그인을 구현 해..

[플러터] application/octet-stream type

REST API 사용 시 content-type이라는 property가 존재한다. 말 그대로 데이터와 형식과 관련된 부분이다. 일반적으로는 application/json 타입을 사용하여 json의 형태로 데이터를 주고 받지만, API에 따라 다양한 타입이 요구된다. 위는 N-cloud의 Clova Speech Recognition REST API에서 요구되는 헤더이고, 음성 파일을 텍스트로 번역해주는 API로 파일을 전송한다. 이같이 content-type이 octet-stream인 경우 Flutter에서 request하는 코드는 다음과 같다. import 'package:dio/dio.dart'; import 'dart:io'; void requestSTT(String fileURL) async { R..

[플러터] ListView 경계선 흐리게 하기

ListView를 사용할 때 List가 끝나는 부분의 경계선을 부드럽게 만들어주고 싶을 때가 있다. 반투명을 주어 아래와 같이 자연스럽게 만들어주는 간단한 위젯이 존재한다. ShaderMask ShaderMask( shaderCallback: (Rect bounds) { return LinearGradient( //아래 속성들을 조절하여 원하는 값을 얻을 수 있다. begin: Alignment.center, end: Alignment.topCenter, colors: [ Colors.white, Colors.white.withOpacity(0.02) ], stops: [0.9, 1], tileMode: TileMode.mirror, ).createShader(bounds); }, (child: List..