diff --git a/docs/tutorial/our-application/index.md b/docs/tutorial/our-application/index.md index 4b39153..df022b2 100644 --- a/docs/tutorial/our-application/index.md +++ b/docs/tutorial/our-application/index.md @@ -11,7 +11,6 @@ think about how it will work for a large team, multiple developers, etc. ![Todo List Manager Screenshot](todo-list-sample.png){: style="width:50%;" } { .text-center } - ## Getting our App Before we can run the application, we need to get the application source code onto @@ -35,7 +34,7 @@ Dockerfile is simply a text-based script of instructions that is used to create a container image. If you've created Dockerfiles before, you might see a few flaws in the Dockerfile below. But, don't worry! We'll go over them. -1. Create a file named Dockerfile with the following contents. +1. Create a file named `Dockerfile` in the same folder as the file `package.json` with the following contents. ```dockerfile FROM node:12-alpine @@ -45,7 +44,9 @@ see a few flaws in the Dockerfile below. But, don't worry! We'll go over them. CMD ["node", "/app/src/index.js"] ``` -1. Build the container image using the `docker build` command. + Please check that the file `Dockerfile` has no file extension like `.txt`. Some editors may append this file extension automatically and this would result in an error in the next step. + +1. If you haven't already done so, open a terminal and go to the `app` directory with the `Dockerfile`. Now build the container image using the `docker build` command. ```bash docker build -t getting-started . @@ -64,6 +65,7 @@ see a few flaws in the Dockerfile below. But, don't worry! We'll go over them. for the final image. Since we named the image `getting-started`, we can refer to that image when we run a container. + The `.` at the end of the `docker build` command tells that Docker should look for the `Dockerfile` in the current directory. ## Starting an App Container diff --git a/docs/tutorial/sharing-our-app/index.md b/docs/tutorial/sharing-our-app/index.md index 8ab44db..6cbb072 100644 --- a/docs/tutorial/sharing-our-app/index.md +++ b/docs/tutorial/sharing-our-app/index.md @@ -20,7 +20,6 @@ an example command that you will need to run to push to this repo. ![Docker command with push example](push-command.png){: style=width:75% } {: .text-center } - ## Pushing our Image 1. In the command line, try running the push command you see on Docker Hub. Note that your command @@ -63,8 +62,11 @@ new instance that has never seen this container image! To do this, we will use P 1. Log in with your Docker Hub account. -1. Once you're logged in, click on the "+ ADD NEW INSTANCE" link in the left side bar. After a few - seconds, a terminal window will be opened in your browser. +1. Once you're logged in, click on the "+ ADD NEW INSTANCE" link in the left side bar. (If you don't see it, make your browser a little wider.) After a few seconds, a terminal window will be opened in your browser. + + ![Play with Docker add new instance](pwd-add-new-instance.png){: style=width:75% } +{: .text-center } + 1. In the terminal, start your freshly pushed app. @@ -77,7 +79,6 @@ new instance that has never seen this container image! To do this, we will use P 1. Click on the 3000 badge when it comes up and you should see the app with your modifications! Hooray! If the 3000 badge doesn't show up, you can click on the "Open Port" button and type in 3000. - ## Recap In this section, we learned how to share our images by pushing them to a registry. We then went to a diff --git a/docs/tutorial/sharing-our-app/pwd-add-new-instance.png b/docs/tutorial/sharing-our-app/pwd-add-new-instance.png new file mode 100644 index 0000000..944e286 Binary files /dev/null and b/docs/tutorial/sharing-our-app/pwd-add-new-instance.png differ