Hogwarts Logo
Hogwarts
FeaturesBlogPricingDocumentation

Command Palette

Search for a command to run...

10
Login

Build by Databayt, source code available on GitHub

  • Introduction
  • Pitch
  • MVP
  • PRD
  • Get Started
  • Architecture
  • Structure
  • Pattern
  • Stack
  • Icons
  • Dashboard
  • Rebound
  • Database
  • Attendance
  • Localhost
  • Contributing
  • Shared Economy
  • Competitors
  • Inspiration
  • Demo
  • Listings
  • Business

Localhost

PreviousNext

Detailed guide to setup environment and run localhost

Prerequisites

Before you begin, make sure you have the following installed:

  • Node.js (v22 or higher, recommended LTS version)
  • Git (version control)
  • IDE (recommended VS Code)

Step 1: Fork the Project

Start by creating your own copy of the repository on GitHub.

  1. Navigate to Hogwarts repository
  2. Click the "Fork" button in the top-right corner
Click the Fork button on GitHub repository page

Step 2: Create Your Fork

Ensure the repository name is available and create your fork.

  1. Verify the repository name is available
  2. Keep the default settings (unless you need to change them)
  3. Click "Create fork" to complete the process
Create fork dialog with repository name and settings

Step 3: Open VS Code

Launch your code editor and prepare to clone the repository.

  1. Open a new window in VS Code
  2. Click on the Git icon in the left sidebar
  3. Click Clone
  4. Paste your repository URL or connect with GitHub from top search bar
VS Code editor with clone repository option highlighted

Step 4: Clone from GitHub

Get your forked repository URL and clone it locally.

  1. Go back to your forked repository on GitHub
  2. Click the green "Code" button
  3. Copy the HTTPS URL to your clipboard
  4. Paste it in your editor's clone dialog
GitHub clone dialog showing HTTPS URL copy button

Step 5: Choose Local Directory

Select where you want to store the project on your computer.

  1. Choose a directory for your projects (e.g., ~/Documents/projects/)
  2. Create a new folder if needed
  3. Select the location and confirm
File explorer showing directory selection for cloning

Step 6: Open in Editor

Open the cloned project in your code editor.

  1. Wait for the cloning process to complete
  2. Click "Open" when prompted
  3. Your project is now ready for development
Project successfully opened in VS Code or Cursor

Step 7: Install Dependencies

Use pnpm to install all required dependencies.

  1. Open the integrated terminal (Ctrl/Cmd + ~)
  2. Run the install command:
pnpm install
  1. Wait for installation to complete

Step 8: Set Up Environment

  1. Create .env file in the root folder
  2. Paste the content from WhatsApp group

Step 9: Start Development Server

Launch the development server and see your app running.

  1. Run the development command:
pnpm dev
  1. Wait for the server to start
  2. Open your browser to http://localhost:3000
InstallationArchitecture

On This Page

PrerequisitesStep 1: Fork the ProjectStep 2: Create Your ForkStep 3: Open VS CodeStep 4: Clone from GitHubStep 5: Choose Local DirectoryStep 6: Open in EditorStep 7: Install DependenciesStep 8: Set Up EnvironmentStep 9: Start Development Server