helixml / apps-client

Docker is utilized within the development environment of helixml/apps-client to streamline the setup and execution of development workflows. Below is a step-by-step guide for configuring Docker in this context, complete with code examples.

Prerequisites

Ensure that you have Docker installed on your system. You can verify the installation by running:

docker --version

Setting Up the Development Environment

Step 1: Clone the Repository

Begin by cloning the helixml/apps-client repository:

git clone https://github.com/helixml/apps-client.git
cd apps-client

Step 2: Create a Dockerfile

In the root of the cloned repository, create a Dockerfile to define your development environment. Below is an example Dockerfile tailored for a TypeScript project:

# Use the Node.js official image
FROM node:14

# Set the working directory
WORKDIR /usr/src/app

# Copy package.json and package-lock.json
COPY package*.json ./

# Install dependencies
RUN npm install

# Copy the rest of the application files
COPY . .

# Expose the application port
EXPOSE 3000

# Command to run your application
CMD ["npm", "start"]

Step 3: Create a .dockerignore File

To keep the Docker context clean and reduce build time, create a .dockerignore file in the root directory:

node_modules
npm-debug.log
build
dist

Step 4: Build the Docker Image

Now, you are ready to build the Docker image. Execute the following command in the terminal:

docker build -t helixml-apps-client .

The -t flag tags the image, which you can adjust to fit your naming conventions.

Step 5: Run the Docker Container

After building the image, run it as a container:

docker run -p 3000:3000 --rm --name helixml-apps-client-instance helixml-apps-client

This command does the following:

  • -p 3000:3000 maps port 3000 from the container to port 3000 on your local machine.
  • --rm automatically removes the container when it exits.
  • --name gives your running container a name for easier management.

Step 6: Accessing the Application

You can now access the application in your web browser at:

http://localhost:3000

Step 7: Utilizing Docker Compose (Optional)

For more complex setups, you may consider using Docker Compose. Create a docker-compose.yml file:

version: '3'

services:
  helixml-apps-client:
    build: .
    ports:
      - "3000:3000"
    volumes:
      - .:/usr/src/app
      - /usr/src/app/node_modules

After creating the Docker Compose file, you can start your application with:

docker-compose up

Development Workflow Considerations

When developing, changes made in the source code will be automatically reflected inside the Docker container due to the volume mapping in the Docker Compose configuration. This facilitates a smooth development experience.

Source of Information

This configuration is based directly on the common practices for setting up Docker with TypeScript applications. The steps outlined provide a robust framework for local development using Docker, tailored for the helixml/apps-client project.