Installation

Installation Guide

Follow these steps to set up and start using the theme.

Prerequisites

Before you begin, ensure your system meets the following requirements.

Install Node.js

Node.js lets you run JavaScript code on your computer. The version you need depends on your edition:

Edition	Node.js version
Astro	22.23.4 or later
Tina	22 (22.23.4 or later) or 24. Tina’s command line tool supports only those two versions
Sanity	22.23.4 or later

The theme uses Astro 7 and Tailwind CSS 4 tooling, so using the version declared in the engines field of package.json is the safest path.

Follow these steps to install Node.js on Windows:

Download the latest suitable LTS/current version of Node.js from the official website: Node.js Downloads
Run the installer after it’s downloaded, and follow the on-screen instructions.
After installation, open the Command Prompt and verify the installation:

node -v

You should see a version number like v22.23.4 or newer.

Here’s how to install Node.js on macOS:

Make sure Homebrew is installed.
Open Terminal and run:

brew install node

Verify the installation:

node -v

The terminal should display the installed version of Node.js.

To install Node.js on Linux, follow these steps:

Open Terminal and update your package list:

sudo apt update

Install Node.js:

sudo apt install nodejs npm

Verify the installation:

node -v

If everything worked correctly, the installed version will be displayed.

Run node -v when you finish. If it shows a version older than 22.23.4, install a newer one from Node.js Downloads. Some Linux package lists have an older version. In the Tina edition, the version must be 22 or 24, and the newest Node.js release can be above that.

💡 Need help? Check out the official Node.js installation guide.

Setting Up Techlo

Once Node.js is installed, unzip the theme and open a terminal in its folder. These steps work in every edition:

Install Dependencies

Navigate to your project directory and run:

npm ci

This will install the exact dependency versions from package-lock.json.

Start the Development Server

To start the local development server, run:

npm run dev

🔹 Your site will be available at http://localhost:4321.

npm run dev also turns src/config/config.toml into the settings file the theme reads, and watches it for changes, so you don’t need to run anything else. To use another port on the Astro edition, run npm run dev -- --port 4322. The Tina edition uses a PORT variable, and the Sanity edition uses SITE_PORT.

Create a Production Build

To generate an optimized production build, run:

npm run build

This regenerates the config from TOML, runs the Astro build, and strips draft pages from the sitemap, placing the final output in the dist/ folder.

Preview the Production Build

To preview the built site locally, run:

npm run preview

This builds the site, then serves dist/ on your computer, so you can verify the production output before deployment.

Run npm run astro-check after you change code or content schemas.

Tina Edition

Keep npm run dev running and open http://localhost:4321/admin/. Click Enter Edit Mode. You need no account and no password. The first time, the editor can take a minute to load. See Tina.

Sanity Edition

npm run dev runs the site straight away with the bundled sample content, and no account. npm ci downloads about 900 MB in this edition. To edit the content, connect your own Sanity project:

npm run setup
npm run dev:all

Then open the Studio at http://localhost:3333 and log in with the same Sanity account. See Sanity.

🚀 You’re all set. Next, review the project structure so you know where Techlo keeps its content, layouts, and configuration.