I am new to Fly.io and deployment in general, but I have built a React frontend SPA based on the create-react-app template.
I have run ‘fly launch’ in my repo to generate the Dockerfile and fly.toml automatically. I am currently having two issues:
Issue 1:
Despite my Dockerfile specifying a production build, the Live Logs for my app show that it has deployed my frontend in dev mode. My Dockerfile is as follows:
# syntax = docker/dockerfile:1
# Adjust NODE_VERSION as desired
ARG NODE_VERSION=16.17.0
FROM node:${NODE_VERSION}-slim as base
LABEL fly_launch_runtime="Node.js"
# Node.js 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
# 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" ]
My logs, however, show me this:
2024-08-14T16:45:51.492 app[080e710a1396e8] ewr [info] Starting the development server...
2024-08-14T16:46:23.012 app[080e710a1396e8] ewr [info] Compiled successfully!
2024-08-14T16:46:23.013 app[080e710a1396e8] ewr [info] You can now view spotify-mood-evaluator in the browser.
2024-08-14T16:46:23.013 app[080e710a1396e8] ewr [info] Local: http://localhost:3000
2024-08-14T16:46:23.013 app[080e710a1396e8] ewr [info] On Your Network: http://172.19.145.10:3000
2024-08-14T16:46:23.013 app[080e710a1396e8] ewr [info] Note that the development build is not optimized.
2024-08-14T16:46:23.013 app[080e710a1396e8] ewr [info] To create a production build, use npm run build.
2024-08-14T16:46:23.024 app[080e710a1396e8] ewr [info] webpack compiled successfully
So why is my app being deployed in dev mode?
Issue 2:
My app keeps running out of memory… this is a relatively small react web app built using the create-react-app template, and it definitely should not be crashing due to OOM when I am allocating 1GB. Here is the error I get in the logs:
2024-08-14T16:46:38.555 app[080e710a1396e8] ewr [info] [ 54.464309] Out of memory: Killed process 342 (node) total-vm:43241584kB, anon-rss:528968kB, file-rss:0kB, shmem-rss:0kB, UID:0 pgtables:11068kB oom_score_adj:0
2024-08-14T16:46:38.636 app[080e710a1396e8] ewr [info] The build failed because the process exited too early. This probably means the system ran out of memory or someone called `kill -9` on the process.
2024-08-14T16:46:38.875 app[080e710a1396e8] ewr [info] INFO Main child exited normally with code: 1
I don’t know why my app is using so much memory AND still crashing… But I believe this is why my app fails to load every time I access it off a cold start. I get stuck at a white screen and finally get a 502 error when trying to GET the home page, after waiting ~15 seconds.
I’m seeing this in the logs from the fly proxy:
2024-08-14T16:53:37.403 proxy[080e710a1396e8] ewr [info] machine became reachable in 6.121120884s
Is it normal for it to take 6s to reach my app? And then have it still fail with a 502 ~15 seconds later?
WHAT IS GOING ON??
Thanks for the help 