Skip to main content

Prerequisites

Before installing the project, ensure you have the following tools installed on your system:
Required: Node.js version 16 or higher is required to run this project.
  • Node.js (version 16 or higher) - Download Node.js
  • npm (included with Node.js) - Package manager for installing dependencies
  • Git (optional) - For cloning the repository
You can verify your installations by running:
node --version
npm --version

Installation Steps

1

Clone the Repository

First, clone the RobTop Games Web repository to your local machine:
git clone https://github.com/ElIvanFX/RobTopGamesWeb.git
Then navigate into the project directory:
cd RobTopGamesWeb
If you don’t have Git installed, you can download the repository as a ZIP file from GitHub and extract it instead.
2

Install Dependencies

Install all required dependencies using npm. This will install Astro and other packages defined in package.json:
npm install
This installs the following key dependencies:
  • astro (^5.12.9) - The core Astro framework
  • prettier (^3.6.2) - Code formatter (dev dependency)
  • prettier-plugin-astro (^0.14.1) - Astro-specific formatting (dev dependency)
The installation may take a few minutes depending on your internet connection.
3

Start the Development Server

Launch the development server to run the site locally:
npm run dev
The development server will start and display output similar to:
🚀 astro v5.12.9 started in 45ms

 Local    http://localhost:4321/
 Network  use --host to expose
The dev server includes hot module reloading, so changes you make to files will automatically update in your browser.
4

Verify the Installation

Open your web browser and navigate to:
http://localhost:4321
You should see the RobTop Games homepage with:
  • Header with navigation
  • Social media links section
  • Video content area
  • App download buttons (iOS, Android, Steam)
  • Footer
If you see the page loading correctly, your installation is complete!

Available Scripts

The project includes several npm scripts defined in package.json:
# Start the development server with hot reloading
npm run dev

Project Configuration

The Astro configuration is minimal and straightforward. Here’s what’s in astro.config.mjs:
astro.config.mjs
import { defineConfig } from "astro/config";

export default defineConfig({
  devToolbar: {
    enabled: false,
  },
});
This configuration disables the Astro dev toolbar for a cleaner development experience.

Troubleshooting

If you encounter issues during installation, try these solutions:

Port Already in Use

If port 4321 is already in use, Astro will automatically try the next available port. You can also specify a custom port:
npm run dev -- --port 3000

Module Not Found Errors

Delete node_modules and reinstall:
rm -rf node_modules package-lock.json
npm install

Node Version Issues

Ensure you’re using Node.js 16 or higher:
node --version
If your version is older, download the latest LTS version from nodejs.org.

Next Steps

Now that you have the project installed, you’re ready to start exploring:

Quick Start Guide

Follow our quick start guide to understand the project structure and create your first page

Components

Explore the reusable components available in the project

Build docs developers (and LLMs) love