ogImage = ‘https://docs.valyent.cloud/og/guides/remix.png’

​

Remix Guide

​

Introduction

Remix is a full stack web framework that lets you focus on the user interface and work back through web standards to deliver a fast, slick, and resilient user experience. In this article, we are going to deploy a Remix application to Valyent.

​

Prerequisites

• a UNIX-like system (see WSL if you are using Windows), in order to use the Valyent CLI
• a Valyent account, with a registered payment method (you can sign up here)
• NodeJS and NPM installed on your machine

​

Installing the Valyent CLI

curl -L https://cli.valyent.cloud/install.sh | sh

You can inspect the installation script here and the GitHub repository.

​

Authenticating

valyent auth login

​

Initializing the project

We can scaffold a Remix application with the following command :

npx create-remix@latest

Then, change directory to the newly created application :

cd <app-name>

Now, we can initialize the valyent.toml configuration file, that allows to link the local codebase, to a Valyent application :

valyent init

This command will ask you to select/create a project and an associated application.

​

Adding the Dockerfile

Let’s add a Dockerfile so that Valyent can build a Docker image for your application.

touch Dockerfile

We can fill it this way :

# Adjust NODE_VERSION as desired
ARG NODE_VERSION=21.5.0
FROM node:${NODE_VERSION}-slim as base

# Remix app lives here
WORKDIR /app

# Set production environment
ENV NODE_ENV="production"

# Throw-away build stage to reduce size of final image
FROM base as build

# Install packages needed to build node modules
RUN apt-get update -qq && \
    apt-get install --no-install-recommends -y build-essential node-gyp pkg-config python-is-python3

# Install node modules
COPY --link package-lock.json package.json ./
RUN npm ci --include=dev

# Copy application code
COPY --link . .

# Build application
RUN npm run build

# Remove development dependencies
RUN npm prune --omit=dev

# Final stage for app image
FROM base

# Copy built application
COPY --from=build /app /app

# Start the server by default, this can be overwritten at runtime
EXPOSE 3000
CMD [ "npm", "run", "start" ]

​

Adding the .dockerignore

Let’s add a .dockerignore so that Valyent so that it doesn’t send unnecessary files to the Docker build context.

touch .dockerignore

We can fill it this way :

node_modules
.git

​

Deploy the project

To expose the application’s port, we need to set up the PORT environment variable :

valyent env set PORT=3000

Then, we can deploy the application :

valyent deploy

Once the deployment is finished, type :

valyent open

to see your Remix application in your browser.