nomaruhan

일단 flutter web은 좀 더 봐야 할 것 같고,

android, ios쪽 앱 개발시에 쓸만 한 애들만 우선 정리

(dart, flutter 기본 플러그인은 제외)

플러그인 이름 누르시면 Visual Studio Marketplace로 연결됩니다~ (알파벳 순)

dart, flutter 전용 플러그인

Awesome Flutter Snippets

snippet 추가 제공. 필수 함수들도 한 번에 만들어줘서 타이핑량이 많이 줄어듬

Dart Data Class Generator

dart 클래스의 생성자, copyWith, toMap, fromMap, toJson, fromJson, == 등 자동 생성해줌

flutter-stylizer

flutter 클래스내의 생성자, 변수, 함수 등을 지정한대로 정렬해 줌

협업하거나 자신만의 스타일 유지할 때 좋음 (기본 설정 그래도사용해도 무방함)

Flutter Tree

emmet 같이 위젯트리를 한 번에 작성 가능하게 도와줌

dart, flutter 전용은 아니지만 도움 되는 플러그인

Better Comments

코멘트에 !, ? 등으로 시작하게 작성하면 색상이 다르게 출력 됨

(설명, 경고, 위험 등의 표시 가능)

Code Spell Checker

오타 잡아 줌!

Color Highlight

#ffffff의 rgb 코드 입력 시, 색상을 바로 확인 할 수 있음

Error Lens

에러 부분을 코드 위치에서 표시 해 줌

Git History

git history 보고 찾기, 비교 등 가능

Image preview

로컬 또는 리모트 파일 이미지를 바로 보여 줌

Paste JSON as Code

json 파일로 class 코드 만들 수 있음 (quicktype.io 에서 만듬)

Prettier - Code formatter

코드 포맷팅 (yaml 지원)

Pubspec Assist

pub.dev 가서 install 탭 내용 복붙하는 시간을 줄여줌

REST Client

rest 테스트를 vscode에서 할 수 있음 (요즘은 아래 thunder client 많이 쓰는 듯)

TabOut

tab키 입력하면 괄호를 빠져나감

(적응하는 데 시간이 필요하지만, 익숙해지면 아주 편함)

Todo Tree

todo 코멘트 달아놓은 것 좌측 트리메뉴에 표시해 줌

Thunder Client

postman의 vscode 플러그인 버전

Version Lens

pubspec.yaml에서 버전 정보를 확인하고, 관리도 할 수 있음 (최신 버전 표기 등)

vscode-faker

fake 데이터 만들어줌 (주소, 이름, 회사, 날짜, 전화번호 등등)

공식 홈 가이드에 있는 플러그인만 해도 snippet은 일단 충분해 보임

flutter.dev/docs/development/tools/vs-code

* launch.json 추가

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "tistory",
            "request": "launch",
            "type": "dart",
            "flutterMode": "debug",
        }
    ]
}

* 추가로 widget이 늘어지니, color bracket 관련 된 거 정도만 설치하면 좋은 듯

1이 install 수도 많고, 2는 베타 버저닝이긴 한대 잘 돌긴 하는 듯 (1, 2 둘 다 archived 됐네)

Bracket Pair Colorizer 2 - Visual Studio Marketplace

indent-rainbow - Visual Studio Marketplace

* pubspec.yaml 선택

* dart devtools

* snippet: tab 또는 선택

stless, stful

* ctrl + .

안드로이드 스튜디오는 widget 제거하는 것도 있었던 것 같은데 아닌가...