## 模块 1：准备环境

在本模块中，我们将启动 IDE，安装 Laravel 相关包，并导入数据以准备动手实验环境。

### 步骤 1. 打开 IDE 和 IDE 中的终端

+ 点击 [VS Code](${LAB:HTTPS_REVERSE_PROXY_URL}?next=${LAB:"/vscode/?folder=/root/Mshop"|urlencode} "VS Code") 在浏览器中打开实验 IDE。Web 版 VS Code 完全加载大约需要 10 秒。

+ 依次点击 `≡`、`Terminal`、`New Terminal`，在 VS Code 中打开一个新终端。

  ![204_1_1_2.png 85%](https://lab-static.pingcap.com/images/2026/1/22/3b76f1103a379b4ff40bbdc0adc3a29e70352320.png)

### 步骤 2. 查看 Laravel 所需的 `.env` 文件

+ 通过查看项目中 `.env` 文件的内容（第 21 ~ 26 行），可以看到当前 Laravel 应用程序连接的是 Aurora (MySQL) 数据库，TiDB Cloud 集群的配置目前被注释掉了。

  ![204_1_mshop_env.png 30%](https://lab-static.pingcap.com/images/2026/2/6/7df7a2204611cec003d4ca647e162cb3ca2ef79b.png)

  ```output
  ...
  # local mysql
  DB_CONNECTION=mysql
  DB_PORT=3306
  DB_HOST=${LAB:AWS_AURORA_SERVERLESS_ENDPOINT}
  DB_USERNAME=${LAB:AWS_AURORA_SERVERLESS_MASTER_USERNAME}
  DB_PASSWORD=${LAB:AWS_AURORA_SERVERLESS_MASTER_PASSWORD}
  DB_DATABASE=${LAB:AWS_AURORA_SERVERLESS_DATABASE_NAME}
  ...
  ```

### 步骤 3. 安装 Laravel 相关包并导入数据，然后启动应用程序

+ 复制以下脚本并粘贴到 VS Code 终端中，执行以安装 Laravel 相关包。用于导入数据和启动应用程序的脚本是 `prepare.sh`。请先设置适当的权限，然后执行脚本，此过程大约需要一分钟。VS Code 会弹出一个窗口询问 "See text and images copied to the clipboard"，请点击 "Allow"。

  ![204_1_env.png 45%](https://lab-static.pingcap.com/images/2026/2/4/d75efd5c0d0364c66065e70c17e9443bd05e5d11.png)

  ```bash
  chmod +x prepare_shop.sh
  ./prepare_shop.sh
  ```

  ```output
  Starting deployment process...
  ------------------------------------------------------------
  [INFO] Executing: composer install ...

  ...

  [SUCCESS] Command completed successfully.
  ------------------------------------------------------------
  [INFO] Executing: php artisan migrate ...

  INFO  Preparing database.

  Creating migration table ............................................................................ 51.27ms DONE

  INFO  Running migrations.

  0001_01_01_000000_create_users_table ............................................................... 252.69ms DONE
  0001_01_01_000001_create_cache_table ................................................................ 90.42ms DONE
  0001_01_01_000002_create_jobs_table ................................................................ 190.90ms DONE
  2025_12_20_112907_create_transactions_table ........................................................ 119.62ms DONE
  2025_12_20_120002_create_products_table ............................................................. 82.09ms DONE
  2026_01_03_040247_create_product_type_table ......................................................... 46.06ms DONE
  2026_01_03_040331_create_pay_types_table ............................................................ 44.52ms DONE

  [SUCCESS] Command completed successfully.
  ------------------------------------------------------------
  [INFO] Executing: mysql -u lab -plabpass -P3306 shop < initshop.sql ...
  [SUCCESS] Command completed successfully.
  ------------------------------------------------------------
  [INFO] Executing: composer require intervention/image:^2 ...

  ...

  >>> All tasks completed successfully! <<<
  ```

### 步骤 4. 启动 Laravel 应用程序

+ 在 VS Code 终端中，运行命令 `composer run dev` 启动 Laravel 应用程序。

  ```bash
  composer run dev
  ```

  ```output
  > Composer\Config::disableProcessTimeout
  > @php artisan serve --host=0.0.0.0

    INFO  Server running on [http://0.0.0.0:8000].

    Press Ctrl+C to stop the server
  ```

+ 将弹出一个窗口提示 "Your application running on port 8000 is available."，请点击 "Open in Browser"。

  ![204_1_port_8000.png 85%](https://lab-static.pingcap.com/images/2026/2/5/4f681e3a7458c7631f2187c53100aa127e5bcaf4.png)

+ 让我们继续下一个模块。