将 Amazon Q 开发者版用作编码助手来提高工作效率

创建一个新项目。

要在工作环境中创建一个新项目，请运行如下命令，并为所有的问题接受默认设置：

npx create-next-app@latest

测试基本应用程序。

运行如下命令，并确认已成功将基本应用程序加载到浏览器中：

npm run dev 

清理基本代码。

导航到 src/app 文件夹中的 page.tsx 文件，并删除默认内容，以便获得一个空白页面。删除之后，此文件应如下所示：

export default function Home() {
  return (<div></div>
      );
}

获取有关具体步骤的概述。

为生成代码 tic-tac-toe。

在聊天面板中，使用 /dev 命令和任务说明，启动一项开发任务。例如：

/dev Create a React-based single-page application  written in TypeScript for a tic-tac-toe game with the following specifications:
1. Design an aesthetically pleasing interface with the game grid centered vertically and 
horizontally on the page. 
2. Include a heading and clear instructions on how to play the game.
3. Implement color-coding for X and O marks to distinguish them easily. 

Amazon Q 开发者版会根据您的说明来生成代码。

检查并接受所生成的代码。

目视检查代码，然后选择接受代码以便自动替换 page.tsx 文件。

如果您遇到问题，请选择提供反馈并重新生成，然后说明您遇到的问题。

修复 lint 错误。

示例 tic-tac-toe游戏包括一个网格。Amazon Q 开发者版生成的代码可能使用了默认类型 any。您可以按如下方式提示 Amazon Q 开发者版，以便添加类型安全：

/dev Ensure proper TypeScript typing for the onSquare Click event handler 
to resolve any 'any' type issues.

提高视觉吸引力。

您可以将原始要求分解成更小的片段。例如，在开发任务中，您可以使用以下提示来改善游戏界面。这些提示可增强层叠样式表（CSS）样式，并导出应用程序以便进行部署。

/dev Debug and fix any CSS issues to correctly display the game grid and overall layout. 

Simplify the code by removing game history functionality and related components. 

Implement static file export to an 'out' directory for easy deployment. The solution 
should be fully functional, visually appealing, and free of typing errors or layout issues. 

再次进行测试。

创建用于部署的文件夹和文件。

在工作环境中的项目中，创建一个部署文件夹，并在其中创建两个文件：pushtos3.sh 和 cloudformation.yml：

mkdir deployment && cd deployment
touch pushtos3.sh && chmod +x pushtos3.sh
touch cloudformation.yml

生成自动化代码。

生成脚本内容。

要创建部署脚本，请使用如下提示：

/dev Modify the pushtos3 shell script so that it can use AWS CLI commands to create a 
CloudFormation stack named tictactoe-stack if it does not exist already, and use 
cloudformation.yml as the source template. Wait for the stack to complete and sync the 
contents from the out folder to the S3 bucket. Perform invalidation of the CloudFront 
origin.

将此应用程序部署到 AWS 云。