Are you still using anyenv? Let's go more easily with Docker?

Disadvantages that occur when putting the environment on a host such as Windows

Version differences are common.

And above all, installation is troublesome. And node and maven are steadily squeezing the local environment.

And the problem of environmental difference between Mac and Windows that occurs.

Ultimately, a different version will be used due to an env setting error.

Recommendation of devcontainer

devcontainer is a technology for building a development environment on Docker and performing all development there.

It's also the core technology when using GitHub codespaces (Visual Studio codespaces).

To put it simply, we will create a virtual machine for development inside, so

It is a little unsuitable for developing GUI apps such as Window App and mobile, but This is basically enough for the Web system.

So if you want to run something like node, Ruby, Python with VS Code, you can do it with devcontainer.

Things necessary

Try out dev container

This time, it is assumed to use nodejs + Express + mongodb as an example. However, I will only set up mongo and will not actually access it.

devcontainer settings

Create a directory called .devcontainer and store information about devcontainer.json and docker container in it.

 Root Directory
  ├ .devcontainer 
  │   ├ devcontainer.json
  │   ├ docker-compose.yml
  │   └ Dockerfile
└ Each source

Make a dev container

Contains information about the container and the VS Code that runs there.

json:.devcontainer/devcontainer.json


{
    //Container name
    "name": "Express Sample",

    // docker-compose filename
    "dockerComposeFile": "docker-compose.yml",

    //The root directory of the project attached to the container
    "workspaceFolder": "/work",

    // docker-If compose is multiple containers
    //Specify which container to enter
    "service": "app",
    //Port to connect from the outside(Open port)Specify
    "appPort": 3000,

    //Set extensions to install
    "extensions": [
        "VisualStudioExptTeam.vscodeintellicode",
        "dbaeumer.vscode-eslint",
        "stevencl.addDocComments",
        "eg2.tslint"
    ]
}

The extensions listed here will be installed in a different area than VS Code on the host.

Therefore, even if you switch to a different language / platform, you can avoid the VS Code becoming crappy.

Create a Docker configuration file

Create a Dockerfile and docker-compose.yml. Regardless of the dev container, it is possible to use the one used for development as it is.

.devcontainer/Dockerfile


FROM node:15.2.0-alpine3.10

EXPOSE 3000

:.devcontainer/docker-compose.yml


version: '3'

services:
  app:
    build: .
    ports:
      - 3000:3000
    volumes:
      - ../:/work
    tty: true

  db:
    image: mongo:3.6.20-xenial
    #Normally, a port and volume attach are required.

Reopen

Does it reopen when the screen is reloaded? Is asked, so select "Reopen in Container"

image.png

After that, the screen will be reloaded, and you can expand the image and generate the container. VSCode related installations will also run, so be patient.

image.png

After booting successfully, make sure the node is running.

image.png

At this point, VS Code's terminal points to the docker container's terminal, so Basically, please use this terminal in VS Code.

App development

npm init and create package.json.

# npm init -y
# nom install -S express

Next, write the following code.

index.js


'use strict'

const express = require('express');
const app = express();

const port = process.env.PORT || 3000;

app.get('/', (req, resp) => {
    resp.send('Hello, JS WORLD!');
})


app.listen(port, () =>{ 
    console.log(`Example app listening on Port ${port}`);
});

I will try it.

# node index.js
node index.js
Example app listening on Port 3000

Let's connect from the host in this state.

If it is displayed well, it is complete.

image.png

After that, you can proceed with development in the same way as normal VS Code.

Deployment to other developers

Even if you deploy it to other developers, you can easily build it as long as you create a dev container.

All you need is VS Code and an extension for remote development.

Settings other than Node.js

This time I did it with node.js, but the basic usage is the same for Python, Ruby, and Java.

Basically, if you pay attention only to the following two points, you will not be in trouble.

--Container base image --Extensions to install

finally

Since the environment and version can be separated for each container, It is safer to solve version problems than using xEnv.

Also, if you are using Docker as your development environment, you only need to write a simple json.

If you are using VS Code, why not use devcontainer to simplify your environment construction?

Recommended Posts

Are you still using anyenv? Let's go more easily with Docker?
[Good news] You can still go with Java 8 !!
You are required to use winpty with docker exec [Windows]
Using PlantUml with Honkit [Docker]
Is the version of Elasticsearch you are using compatible with Java 11?
Easily Docker Java applications with Jib
Use cuda11.0 with pytorch using Docker