This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- @vitejs/plugin-react uses Babel for Fast Refresh
- @vitejs/plugin-react-swc uses SWC for Fast Refresh
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
- Configure the top-level
parserOptions
property like this:
export default {
// other rules...
parserOptions: {
ecmaVersion: 'latest',
sourceType: 'module',
project: ['./tsconfig.json', './tsconfig.node.json'],
tsconfigRootDir: __dirname,
},
}
- Replace
plugin:@typescript-eslint/recommended
toplugin:@typescript-eslint/recommended-type-checked
orplugin:@typescript-eslint/strict-type-checked
- Optionally add
plugin:@typescript-eslint/stylistic-type-checked
- Install eslint-plugin-react and add
plugin:react/recommended
&plugin:react/jsx-runtime
to theextends
list
steps
https://docs.amplify.aws/gen2/start/quickstart/vite-react-app/
nvs
select 20.11.1 (current LTS version of Node.js) https://nodejs.org/en- can switch to pnpm, just have to override the build
curl -fsSL https://get.pnpm.io/install.sh | sh -
https://npm.io/installation- navigate to the directory where you want to create the project
npm create vite@latest react-amplify-gen2 -- --template react-ts
cd react-amplify-gen2
npm install
npm create amplify@beta
- setup credentials https://docs.amplify.aws/gen2/start/account-setup/
npm amplify configure profile --name dev-personal-josh
- enter the access key and secret key and use
us-east-1
as the region - for a real team use https://docs.amplify.aws/gen2/start/account-setup/#configure-iam-identity-center
npm amplify sandbox --profile dev-personal-josh
- The given region has not been bootstrapped. Sign in to console as a Root user or Admin to complete the bootstrap process and re-run the amplify sandbox command.
- This auto opened the browser to the AWS console and I was already logged in as root user so I just clicked the "Complete bootstrap" button
- run the local dev server
npm run dev
npm amplify sandbox --profile dev-personal-josh
- much output ✨ Deployment time: 253.1s
- now we are running and amplify is watching for changes
- followed the tutorial https://docs.amplify.aws/gen2/start/quickstart/vite-react-app/
- followed the steps and the backend is now configured for user authentication
- https://docs.amplify.aws/gen2/start/quickstart/vite-react-app/#build-ui
npm install @aws-amplify/ui-react
- lint the project
npm run lint
- build
npm run build
// npm amplify sandbox secret set openAiApiKey --profile dev-personal-josh
// npm amplify sandbox secret set openAiAssistantId --profile dev-personal-josh
can call get
to make sure they are correct
don't seem to be deleted when you `npm amplify sandbox delete --profile dev-personal-josh
For the branch deployment these are managed in the Amplify Dashboard.
export OPENAI_API_KEY='your-api-key-here' node openai-test.js
- setup OpenAI assistant
- call my openAI assistant with secret
- store assistant conversation as a user attribute
- display assistant conversation
- try the CI/CD branch deployments
- look at the telemetry/logs etc. in AWS console (only available once deployed)