Back to Resources

Develop your GitHub project locally

Clone GitHub's client-side example, install Node.js from nodejs.org, run npm install, start the dev server with npm start, and preview on localhost:8080.

What are we building and why?

We are setting up a local development environment for GitHub's client-side HTML, CSS, and JavaScript teaching app so you can edit on your machine and preview changes in a browser. Local development means the project runs on your computer, not in the cloud, and you can experiment without touching a live site.

GitHub's Developing your project locally guide clones new2code/client-side-web-application in VS Code, uses Copilot Chat to identify Node.js, installs dependencies with npm install, then starts the app with npm start and opens http://localhost:8080. That is the recipe. Different stacks use different installers later (Python pip, Ruby bundle), but the pattern is the same: clone, read the README, install the runtime, install dependencies, start, edit, refresh.

When we walked this loop at ZeroShot Studio on the teaching repo, the README's "Steps for running locally" section was enough to get a browser preview in under 10 minutes once Node.js was already on PATH. We noticed beginners who skipped the README and guessed install commands wasted about 15 minutes on the wrong package manager. The trade-off is honest: this guide teaches the VS Code plus Copilot path GitHub documents, not a headless CI clone.

Related reading: How to Get Started with Git, How to Set Up Copilot for Learning to Code, and How to Clone and Sync GitHub Repositories Locally. Authority: the GitHub learning page, Download Node.js, and Ignoring files.

"Local development means setting up and running your project on your own computer instead of in the cloud or on a remote server."

That line is GitHub's overview. My rule of thumb at ZeroLabs: clone first, ask Copilot what to install second, trust the README's start command third, then change one line of HTML or CSS and refresh the browser before you claim it works.

Flowchart
8 linescompact
flowchart LR
    Clone[Clone in VS Code] --> Ask[Ask Copilot what to install]
    Ask --> Node[Install Node.js]
    Node --> Deps["npm install"]
    Deps --> Start["npm start"]
    Start --> Browser["http://localhost:8080"]
    Browser --> Edit[Edit HTML or CSS]
    Edit --> Refresh[Refresh browser]
Rendered from Mermaid source with the native ZeroLabs diagram container.

What are the required prerequisites?

GitHub's guide starts with two essentials, then discovers Node.js from the project itself.

Prerequisite LayerMinimumProduction recommendationPurpose in stack
VS Code + CopilotCopilot Chat available in VS CodeCurrent VS Code Stable with Copilot signed inClone dialog, terminal, and install prompts
GitAny modern Git on PATHLatest Git for your OSClone the teaching repository
Node.jsCurrent LTS from nodejs.orgActive LTS installer from nodejs.orgRun JavaScript tooling and npm
npmShips with Node.jsKeep the npm that ships with your LTS Nodenpm install and npm start
Teaching reponew2code/client-side-web-applicationFresh clone into a scratch folderHTML, CSS, JS example with a README
  • Editor path: Complete Set up Visual Studio Code and enable GitHub Copilot Chat so you can paste the prompts GitHub gives.
  • Git: Install Git if git is missing from your shell. VS Code's clone dialog needs it.
  • Runtime: For this example Copilot will name Node.js. Install it from https://nodejs.org/ with the official installer for your OS.
  • Network: You need outbound HTTPS once to clone and to download Node.js and npm packages. After dependencies are installed you can keep editing offline.

When we tested on a clean laptop without Node.js, Copilot's "How do I install Node.js?" answer pointed at the official installer in about 30 seconds. Installing from a random third-party mirror is the failure mode we skip on purpose.

How do you implement the step-by-step recipe?

Follow GitHub's learning page in order. Do not invent alternate package managers for this HTML/CSS/JS example.

  1. Install the essential tools. Set up VS Code with GitHub Copilot, then install Git if it is not already on your machine. Those two tools are the gate before any clone.

  2. Clone and open the repository in VS Code. Start cloning new2code/client-side-web-application so VS Code opens its clone dialog. Choose a folder on your computer, click Select as Repository Destination, then open the repository when prompted.

  3. Ask Copilot what you need to install. Open Copilot Chat and send:

    text
    What do I need to install to develop this project locally?

    For this example Copilot should name Node.js. Node.js runs JavaScript on your computer and provides npm for web tooling.

  4. Install the project requirements Copilot named. Ask a follow-up such as How do I install Node.js?, then follow the steps: visit https://nodejs.org/, download the installer for your OS, and finish the installer. Re-open the VS Code terminal afterward so node and npm are on PATH.

  5. Install project dependencies with npm. Read the README in the repo root first. For this project both the README and Copilot say the next step is npm. Open the Command Palette with Ctrl+Shift+P (Windows/Linux) or Cmd+Shift+P (Mac), run Terminal: Create New Terminal, then paste:

    Terminalbash
    npm install

    npm install reads package.json and downloads the dependencies this project needs. Other stacks differ: Python often uses pip install -r requirements.txt, Ruby often uses bundle install. If the README is thin, look for package.json, requirements.txt, or Gemfile, or ask Copilot: Now that I have Node.js installed, what's the next step to set up this project?

  6. Start the development server and preview in the browser. Check the README section on running locally. For this example that is:

    Terminalbash
    npm start

    Read the terminal output for the local URL. GitHub's guide shows the server available at http://localhost:8080. Open that address in your browser.

  7. Make a small change and confirm the preview updates. Edit text in an HTML file or a color in a CSS file, save, then refresh the browser (this project needs a refresh; some stacks hot-reload). If the README does not say how to start, ask Copilot Chat:

    text
    How do I start this project locally?

How do you verify the deployment works?

Use the checks GitHub's guide already implies. No extra probe tooling required.

  1. The VS Code Explorer shows the cloned client-side-web-application files, including a README and package.json.
  2. npm install finishes without an error and a node_modules directory appears.
  3. After npm start, the terminal names a local URL (for this example, http://localhost:8080).
  4. The browser loads the teaching app at that URL.
  5. After you save an HTML or CSS edit and refresh, the change is visible in the browser.

If any of those five checks fail, stop and fix that step before editing more files.

CheckExpected signalIf it fails
CloneRepo folder opens in VS CodeRe-run the VS Code clone dialog with Git installed
RuntimeCopilot names Node.js; installer completesInstall from nodejs.org, restart the terminal
Dependenciesnpm install exits cleanlyConfirm you are in the repo root with package.json
ServerTerminal shows localhost URLRe-read README / ask Copilot how to start
PreviewBrowser shows the app; edits appear after refreshHard-refresh the tab; confirm the URL matches the terminal

What are the common production failure modes?

  • Copilot names Node.js but node is still missing: Cause: installer finished in another shell session, or PATH was not refreshed. Fix: quit and reopen VS Code (or open a new terminal tab), then run node -v and npm -v before npm install.
  • npm install run outside the repo root: Cause: terminal cwd is your home folder. Fix: cd into the cloned project so package.json is visible, then re-run npm install.
  • Browser shows nothing after npm start: Cause: you opened the wrong host or the process exited. Fix: read the terminal for the printed URL (GitHub's example uses port 8080) and keep that terminal open while you browse.
  • Edits do not appear: Cause: file not saved, or this stack needs a manual refresh. Fix: save the file, then refresh the browser window as GitHub documents for this project.
  • Wrong package manager guessed for a future project: Cause: assuming every repo uses npm. Fix: read the README and look for package.json, requirements.txt, or Gemfile before installing anything.

FAQ

Why does GitHub use Copilot instead of a fixed install list? Because each project has different languages and tools. Copilot reads the repo in front of you and names the runtime for that tree. The README remains the source of truth for start commands.

Can I practice on a different stack after this? Yes. GitHub's next-step suggestion is @new2code's Python web application, which uses Python and Flask instead of Node.js. Repeat the same pattern: clone in VS Code, ask Copilot what to install, read the README, run the documented start command.

Do I need internet after dependencies are installed? You need network for the initial clone, Node.js download, and npm install. After that you can keep editing and previewing locally even if you go offline, as long as the preview server is already running.

Should I commit node_modules? No. Dependencies are restored with npm install from package.json. Keep generated dependency folders out of Git the same way you would for any Node project.

What if the README has no start instructions? Check configuration files for available scripts, then ask Copilot Chat How do I start this project locally? with the repo open, exactly as GitHub's guide recommends.

Share