Flutter VSCode Extension(플러그인) 추천

1. Flutter

https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

option + control + F5 : Run, Debugger

2. Awesome Flutter Snippets

https://marketplace.visualstudio.com/items?itemName=Nash.awesome-flutter-snippets Flutter 클래스와 메소드의 모음, Shortcut

Shortcut	Expanded	Description
statelessW	Stateless Widget	Stateless widget 생성
statefulW	Stateful Widget	Stateful widget 생성
build	Build Method	위젯으로 표시되는 사용자 인터페이스 부분을 설명합니다.
initS	InitState	이 객체가 트리에 삽입 될 때 호출됩니다. 프레임 워크는 작성된 각 State 객체에 대해이 메소드를 정확히 한 번만 호출합니다.
dis	Dispose	이 객체가 트리에서 영구적으로 제거 될 때 호출됩니다. 프레임 워크는이 State 객체가 다시는 빌드되지 않을 때이 메소드를 호출합니다.
reassemble	Reassemble	디버깅 중, 예를 들어 핫 리로드와 같이 응용 프로그램이 재 조립 될 때마다 호출됩니다.
didChangeD	didChangeDependencies	이 State 객체의 종속성이 변경 될 때 호출됩니다.
didUpdateW	didUpdateWidget	위젯 구성이 변경 될 때마다 호출됩니다.
customClipper	Custom Clipper	custom shapes을 만드는데 사용
customPainter	Custom Painter	custom paint을 만드는데 사용
listViewB	ListView.Builder	요청시 생성되는 스크롤 가능한 선형 배열 위젯을 만듭니다 .Null이 아닌 itemCount를 제공하면 ListView의 최대 스크롤 범위를 추정하는 기능이 향상됩니다.
customScrollV	Custom ScrollView	silver를 사용하여 사용자 지정 스크롤 효과를 만드는 ScrollView를 만듭니다. 기본 인수가 true이면 컨트롤러가 널이어야합니다.
streamBldr	Stream Builder	지정된 stream과의 최신 상호 작용 snapshot을 기반으로 자체 빌드하는 새 StreamBuilder를 만듭니다.
animatedBldr	Animated Builder	애니메이션 빌더를 만듭니다. child에 지정된 위젯이 빌더로 전달됩니다.
statefulBldr	Stateful Builder	상태가 있고 빌드를 콜백에 위임하는 위젯을 작성합니다. 위젯 트리의 특정 섹션을 다시 작성하는 데 유용합니다.
orientationBldr	Orientation Builder	장치의 방향을 지정하고 참조 할 수있는 빌더를 작성합니다.
layoutBldr	Layout Builder	프레임 워크가 레이아웃 시 빌더 함수를 호출하고 상위 위젯의 제한 조건을 제공한다는 점을 제외하면 Builder widget 과 유사합니다.
singleChildSV	Single Child Scroll View	single child로 scroll view를 만듭니다.
futureBldr	Future Builder	Future Builder를 만듭니다. 이는 Future와의 최신 상호 작용 snapshot을 기반으로합니다.
nosm	No Such Method	이 메소드는 존재하지 않는 메소드 또는 특성에 액세스 할 때 호출됩니다.
inheritedW	Inherited Widget	위젯 트리 아래로 정보를 전파하는 데 사용되는 클래스입니다.
mounted	Mounted	이 State 객체가 현재 트리에 있는지 여부
snk	Sink	Sink는 stream의 입력 입니다.
strm	Stream	비동기 데이터 이벤트의 소스. stream은 모든 데이터 유형이 될 수 있습니다.
subj	Subject	BehaviorSubject는 broadcast StreamController이며 Stream이 아닌 Observable을 리턴합니다.
toStr	To String	이 객체의 string 표현을 리턴합니다.
debugP	Debug Print	flutter 도구의 logs 명령 (flutter logs)을 사용하여 액세스 할 수있는 메시지를 콘솔에 인쇄합니다.
importM	Material Package	Import Material package.
importC	Cupertino Package	Import Cupertino package.
mateapp	Material App	Create a new Material App.
cupeapp	Cupertino Package	Create a New Cupertino App.
tweenAnimationBuilder	Tween Animation Builder	대상 값이 변경 될 때마다 위젯의 특성을 대상 값으로 애니메이션하는 Widget builder .
valueListenableBuilder	Value Listenable Builder	ValueListenable과 구체적인 T 값에서 위젯을 빌드하는 빌더가 제공되면이 클래스는 자동으로 ValueListenable의 리스너로 등록하고 값이 변경 될 때 업데이트 된 값으로 빌더를 호출합니다.

3. Flutter Files

https://marketplace.visualstudio.com/items?itemName=gornivv.vscode-flutter-files 빠르게 Scaffold Flutter BLoC template 사용

lib 폴더에서 마우스 오른쪽 버튼 클릭해서 New Big Pack BloC, New Index, New BloC 등 사용

4. Flutter Tree

https://marketplace.visualstudio.com/items?itemName=marcelovelasquez.flutter-tree 기본 위젯 트리를 빌드하기위한 extension

기본 문법

OneChild>MultipleChild[OneChild,MultipleChild[OneChild,OneChild],OneChild>OneChild]

OneChild(
    child: MultipleChild(
        children: <Widget>[
            OneChild(),
            MultipleChild(
                children: <Widget>[
                    OneChild(),
                    OneChild(),
                ]
            ),
            OneChild(
                child: OneChild(),
            ),
        ]
    ),
), 

사용 예

Center>Column[Cotainer, Expanded>Container, Text]

body: Center(
    child: Column(
        children: <Widget>[
            Container(),
            Expanded(
                child: Container(),
            ),
            Text(),
        ]
    ),
), 

5. Bracket Pair Colorizer 2

https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer-2 부모 scope의 괄호 사이에 선을 그어줌 (깊이 따라 색상 다르게)

Option 활성화 할 리스트

VSCode > Preference > Settings >

• showBracketsInGutter : 코드줄 번호 왼쪽 부분에 현재 활성화된 괄호 보여줌
• showBracketsInRuler : ruler에 활성화된 괄호 보여줌
• showVerticalScopeLine : 괄호 사이 세로선 그어줌 (디폴트 설정)