Visual Studio Code 설치 - Dart 학습 개발 환경을 위한

  • 4 minutes to read

Dart 언어를 학습하거나 간단한 프로그램을 작성하려면 개발 환경이 필요합니다.
웹 브라우저에서 사용할 수 있는 DartPad도 있지만, 실제 코드를 작성하고 파일 단위로 관리하려면 로컬 개발 환경을 사용하는 것이 좋습니다.

이 문서에서는 Visual Studio Code와 Dart SDK를 사용하여 Dart 개발 환경을 구성하는 방법을 설명합니다.


1. Visual Studio Code 소개

Visual Studio Code(VS Code)는 Microsoft에서 제공하는 무료 코드 편집기입니다.

VS Code는 다음과 같은 특징을 가지고 있습니다.

  • 가볍고 빠른 코드 편집기
  • 다양한 확장(Extension) 지원
  • 여러 프로그래밍 언어 지원
  • 통합 터미널 제공
  • 자동 완성(IntelliSense) 기능 제공

Dart 언어도 VS Code 확장을 통해 편리하게 개발할 수 있습니다.


2. Visual Studio Code 설치

먼저 Visual Studio Code를 설치합니다.

다운로드 페이지

https://code.visualstudio.com

운영체제에 맞는 설치 파일을 다운로드한 후 설치를 진행합니다.

설치가 완료되면 VS Code를 실행합니다.


3. Dart SDK 설치

Dart 프로그램을 실행하려면 Dart SDK가 필요합니다.

Dart SDK 다운로드 페이지

https://dart.dev/get-dart

운영체제에 맞는 설치 방법을 선택하여 Dart SDK를 설치합니다.

설치가 완료되면 터미널에서 다음 명령으로 설치 여부를 확인할 수 있습니다.

dart --version

정상적으로 설치되었다면 Dart SDK 버전이 출력됩니다.

Dart SDK version: x.x.x

4. VS Code에서 Dart Extension 설치

VS Code에서 Dart 코드를 편리하게 작성하려면 Dart 확장을 설치해야 합니다.

설치 방법

  1. VS Code 실행
  2. 왼쪽 메뉴에서 Extensions 선택
  3. 검색창에 Dart 입력
  4. Dart (Dart Code) 확장 설치

설치가 완료되면 다음 기능을 사용할 수 있습니다.

  • Dart 코드 자동 완성
  • 문법 강조 표시
  • 오류 표시
  • 코드 포맷팅
  • 디버깅 지원

5. Dart 프로젝트 폴더 만들기

Dart 코드를 작성할 폴더를 하나 생성합니다.

예:

dart-study

VS Code에서 해당 폴더를 열어줍니다.

File → Open Folder

6. Dart 파일 만들기

폴더 안에 Dart 파일을 하나 생성합니다.

예:

main.dart

다음 코드를 작성합니다.

void main() {
  print("Hello Dart");
}

7. Dart 프로그램 실행

VS Code의 터미널을 열고 다음 명령을 실행합니다.

dart run main.dart

출력 결과

Hello Dart

이제 VS Code에서 Dart 프로그램을 실행할 수 있습니다.


8. Dart 코드 작성 예제

Dart 코드를 작성하여 간단한 프로그램을 실행해 봅니다.

void main() {
  String name = "Dart";

  print("Hello $name");
}

실행

dart run main.dart

출력

Hello Dart

9. Dart 파일 구조 예시

Dart 학습 초기에는 다음과 같이 간단한 파일 구조로도 충분합니다.

dart-study
 ├─ main.dart
 ├─ hello.dart
 └─ test.dart

각 파일은 독립적으로 실행할 수 있습니다.

dart run hello.dart

10. 코드 자동 정렬

VS Code에서는 Dart 코드를 자동으로 정렬할 수 있습니다.

단축키

Shift + Alt + F

또는 명령어

dart format .

코드 스타일을 일정하게 유지할 수 있습니다.


11. Dart 도움말 확인

Dart 명령어 도움말은 다음과 같이 확인할 수 있습니다.

dart help

또는 특정 명령어 도움말

dart run --help

정리

이 문서에서는 Dart 학습을 위한 기본 개발 환경을 구성하는 방법을 살펴보았습니다.

구성 요소는 다음과 같습니다.

  • Visual Studio Code 설치
  • Dart SDK 설치
  • Dart Extension 설치
  • Dart 파일 작성
  • Dart 프로그램 실행

이 환경을 준비하면 로컬 컴퓨터에서 Dart 코드를 자유롭게 작성하고 실행할 수 있습니다.

더 깊이 공부하고 싶다면
DevLec에서는 실무 중심의 C#, .NET, ASP.NET Core, Blazor, 데이터 액세스 강좌를 단계별로 제공합니다. 현재 수강 가능한 강좌 외에도 더 많은 과정이 준비되어 있습니다.
DevLec.com에서 자세한 커리큘럼을 확인해 보세요.
DevLec 공식 강의
C# Programming
C# 프로그래밍 입문
프로그래밍을 처음 시작하는 입문자를 위한 C# 기본기 완성 과정입니다.
ASP.NET Core 10.0
ASP.NET Core 10.0 시작하기 MVC Fundamentals Part 1 MVC Fundamentals Part 2
웹 애플리케이션의 구조와 MVC 패턴을 ASP.NET Core로 실습하며 익힐 수 있습니다.
Blazor Server
풀스택 웹개발자 과정 Part 1 풀스택 웹개발자 과정 Part 2 풀스택 웹개발자 과정 Part 3
실무에서 바로 활용 가능한 Blazor Server 기반 관리자·포털 프로젝트를 만들어 봅니다.
Data & APIs
Entity Framework Core 시작하기 ADO.NET Fundamentals Blazor Server Fundamentals Minimal APIs
데이터 액세스와 Web API를 함께 이해하면 실무 .NET 백엔드 개발에 큰 도움이 됩니다.
VisualAcademy Docs의 모든 콘텐츠, 이미지, 동영상의 저작권은 박용준에게 있습니다. 저작권법에 의해 보호를 받는 저작물이므로 무단 전재와 복제를 금합니다. 사이트의 콘텐츠를 복제하여 블로그, 웹사이트 등에 게시할 수 없습니다. 단, 링크와 SNS 공유, Youtube 동영상 공유는 허용합니다. www.VisualAcademy.com
박용준 강사의 모든 동영상 강의는 데브렉에서 독점으로 제공됩니다. www.devlec.com