# Flutter - 第一個APP(官網:隨機公司名稱) ## 建立專案(VSCode 開發) 1. 建立新專案 Application ![](https://i.imgur.com/pRgGfXF.png) ![](https://i.imgur.com/EORXsQO.png) 2. 删除 lib/main.dart 內 所有文字改為以下 ```dart // Copyright 2018 The Flutter team. All rights reserved. // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( title: 'Welcome to Flutter', home: Scaffold( appBar: AppBar( title: const Text('Welcome to Flutter'), ), body: const Center( child: Text('Hello World'), ), ), ); } } ``` 3. 運行(連上手機或開模擬器都可,**手機首次建立會需要幾分鐘**) ``` flutter run ``` ![](https://i.imgur.com/0p0U5Uw.png) terminal 輸入小寫`r`可進行hot reload ## 使用外部 package 1. 下載外部套件 ``` flutter pub add english_words ``` 安裝完後就會看到pubspec.yaml文件內這一個依賴項已添加 ![](https://i.imgur.com/9xj3g2O.png) 2. import ```dart import 'package:english_words/english_words.dart'; ``` 3. 簡單測試(隨機改變背景文字) ![](https://i.imgur.com/JEJczQU.png) ## 參考資料 1. https://flutter.cn/docs/get-started/codelab 2. https://pub.flutter-io.cn/packages/english_words/install ###### tags: `flutter`