Run "Amplify SNS Workshop" in Visual Studio Code's Remote Container
With using the VSCode's remote container extension and the files in this repo, you can walk through the Amplify SNS Workshop without installing (unwanted) stuff into your local machine's environment.
We've created and tested this repo on/for macOS, but it also could work on Windows machines 田ミ
Prerequisities
- Visual Studio Code with the
Remote - Containers
extension - Docker for Desktop
Usage
- Clone this repo to your local machine
- Open the cloned directory in Visual Studio Code
- Open remote container environment by following the vscode's popup window(, then it'll build a new container for you)
- If you already have existing AWS profile(s) in your local machine and use one of them for the workshop, you can skip the first section of the workshop and start from the section 2.
Structure
Repository
.
├── .devcontainer <- Configs for the 'Remote - Containers' extension
├── .gitignore
├── copy-boyaki-to-host.sh <- See the "Note" below
├── LICENSE
└── README.md <- You're reading this file right now :)
In the remote container
/ <- Container's root
...
├── hostdir <- Mounted host directory (= containers all files and folders of this repository)
...
└── workspaces <- Your working directory :)
Preserving your work
NOTE: You will find the boyaki
directory in your remote container during the workshop (so as in the VSCode's explorer) but NOT in your host machine. This is a side-effect of the fix PR #3 (for the issue #2) to speed up the npx create-react-app
command, thus you may lose your boyaki
files once you stop the remote container. If you need to preserve and/or edit the files inside the boyaki
folder outside of your remote container, you can use the bash script copy-boyaki-to-host.sh
to copy those in-container files as a zip file boyaki.zip
to your host machine's boyaki
directory. Simply execute /hostdir/copy-boyaki-to-host.sh
inside your remote container and follow the guidance to run it.
Details of the container
1. Installed Packages
.devcontainer/Dockerfile
via - Node.js v12.x
- AWS CLI v2.x
- Amazon Corretto 8 (OpenJDK 1.8.x) for the "Amplify Mocking" feature
.devcontainer/devcontainer.json
via - AWS Amplify CLI 4.16.1
2. Default configurations
We'd recommend you to use this repository with the default configurations below, but still you can change the configs in the devcontainer.json
file and/or the Dockerfile
in the .devcontainer
directory if you need.
Working directory (inside your remote container)
/workspaces
Mounted directories (to your remote container)
- Your git cloned folder (as
/hostdir
in the container) - Your AWS credentials folder ({$HOME|$USERPROFILE}/.aws). So that you can use your existing AWS profiles for the
amplify init
command, and you don't need to run theamplify configure
command if you use your pre-configured AWS profile.
Forwarded Ports (from host to your remote container)
The following ports are exposed from the remote container and you can access them via your web browser with http://localhost:{PORT_NUMBER}.
- 3000 (for the local development server, launched by
npm start
command) - 20002 (for Amplify Mocking, launched by
amplify mock api
command) Make sure to usehttp://localhost:20002
as the endpoint of the mocked API when you access it via a web browser.