Troubleshooting
The errors you can meet while installing or building the landing page, what causes each one, and how to fix it.
Docker is not running
failed to connect to the docker API at unix:///…/docker.sock; check if the path is correct and if the daemon is runningOlder Docker versions say "Cannot connect to the Docker daemon" instead. Either way, the Docker engine is not started.
Open Docker Desktop
Start Docker Desktop and wait until it reports that the engine is running. On Linux, start the service:
sudo systemctl start docker.Check that Docker answers
Terminaldocker infoExpected result: It prints a Server section instead of an error.
Run your command again
docker build -t saas-landing ., thendocker run -p 3030:3030 saas-landing.
A port is already in use
ports are not available: exposing port TCP 0.0.0.0:3030 … bind: address already in use
Error: listen EADDRINUSE: address already in use :::3030The first line comes from Docker, the second from yarn dev or yarn start. Another program already listens on port 3030: often an earlier run of this site, or another project's dev server.
Find what holds the port
On macOS or Linux:
Terminallsof -i :3030On Windows, in PowerShell:
Terminalnetstat -ano | findstr :3030Stop it
Close that program, or stop the earlier run: Ctrl+C in its terminal, or
docker stopwith the container's ID fromdocker ps. Then start the site again.Or use another port
Keep the other program and start the site on a free port, here
3041:How you run it Command Docker docker run -p 3041:3030 saas-landingDevelopment server yarn dev -p 3041Production build yarn start -p 3041With Docker, change only the number on the left of
-p: the site inside the container always listens on3030.Expected result: The site answers on localhost:3041Local.
The build fails
docker build stops with "failed to solve" and the step that failed; yarn build stops with the error itself. The usual causes:
- No connection or a timeout: the build downloads the dependencies, and
next builddownloads the Inter and Noto Sans Arabic fonts from Google Fonts. The message "Failed to fetchInterfrom Google Fonts" means the build could not reach them. Run the command again once you are online; with Docker, finished steps are cached. - `Invalid URL`:
NEXT_PUBLIC_SITE_URLis not a full address. Write it withhttps://, such ashttps://www.your-domain.com. - No space left on device: free space in Docker Desktop, or check what Docker uses with
docker system df. - It fails at the same step every time: build again without the cache.
landing-page-template-2docker build --no-cache -t saas-landing .Without Docker, delete the node_modules and .next folders, then run yarn install and yarn build again.
Yarn says its version is 1.22
This project's package.json defines "packageManager": "yarn@4.8.1…". However the current global version of Yarn is 1.22…The project pins Yarn 4 through Corepack. This message means Corepack is not enabled yet, so the old global Yarn answered instead.
corepack enableThen run yarn install again. If your Node.js has no Corepack, install it first with npm install -g corepack. If yarn is not found at all, the same command fixes it.
A changed setting does nothing
NEXT_PUBLIC_SITE_URL and NEXT_PUBLIC_API_BASE_URL are compiled into the page when it is built. Changing them changes nothing until the site is built again.
| How you run it | After changing a value |
|---|---|
yarn dev | Change it in .env.local, stop the server and run yarn dev again. |
yarn build and yarn start | Change it in .env.local, run yarn build again, then yarn start. |
| Docker | Build the image again with the value as a --build-arg. The image build ignores .env and .env.local. |
| Vercel | Change it in the project's Environment Variables and deploy again. |
Some images are missing
- The testimonial photos and the blog card images are empty: they load from
images.unsplash.com, so they need an internet connection, on the computer that serves the site too. Every other image is inpublic/. - An error says a hostname "is not configured under images in your `next.config.js`": you used an image from a website that is not allowed yet. Add its host to
images.remotePatternsinnext.config.js, or copy the image intopublic/. - A new image in `public/` does not show: its path in the code starts at the site's root, without
public, such as/images/your-photo.jpg. With Docker, build the image again.
The newsletter form only shows its error message
The newsletter section is not on the page by default. Once you add it, the form shows its error message when:
NEXT_PUBLIC_API_BASE_URLis empty. The form sends nothing until it is set, and the site is built again.- Your API answers with an error, or does not answer at
<NEXT_PUBLIC_API_BASE_URL>/newsletter/subscribe. - Your API does not allow the site's address in its CORS settings. The browser's console then shows a CORS error.
The page opens in Arabic
Opening / sends a visitor to /ar when the browser prefers Arabic, and to /en otherwise. Press the language button in the header, or open /en directly. To always start in English, whatever the browser prefers, add localeDetection: false next to locales in src/i18n/routing.ts.
A button or link does nothing
The menu and footer links point to #, and the Get Started, Start Free Trial, Book a Demo and pricing buttons have no destination yet. That is by design: they are yours to point at your sign-up page, your docs or your contact page.
The folder looks different
Run the commands inside the folder the ZIP extracts to, landing-page-template-2. It holds Dockerfile, package.json, yarn.lock, messages, public and src. If the unzip command is missing, extract it with your file manager instead; some tools add an extra folder named after the ZIP, so move into the inner one.