Welcome! This guide is for non-coders contributing for the first time.
You do not need to be a developer to help. These steps walk you through:
- Installing Node.js
- Setting up GitHub Desktop
- Cloning this repository
- Opening the project in an editor
- Installing dependencies
- Running the app locally (
npm run dev)
Where possible, links point to official GitHub documentation.
- A GitHub account
- If you don’t have one yet, sign up: https://github.com/signup
- A computer with internet access
FutureNet uses Node.js to run the development server.
- Go to the official Node.js download page:
https://nodejs.org/en/download - Download the LTS version for your operating system (recommended).
- Run the installer and follow the steps (accept defaults unless you know you need something different).
To confirm installation later, you can run this command in a terminal:
node -vOfficial docs (reference):
- Node.js downloads: https://nodejs.org/en/download
GitHub Desktop is a beginner-friendly app for working with GitHub repositories.
- Download GitHub Desktop from the official page:
https://desktop.github.com/ - Install and open the app.
- Sign in with your GitHub account.
Official GitHub Desktop docs:
- Open your new GitHub Desktop application
- To keep your account secure, you must authenticate before you can use GitHub Desktop to access resources on GitHub.: https://docs.github.com/en/desktop/installing-and-authenticating-to-github-desktop/authenticating-to-github-in-github-desktop
You’ll copy the FutureNet repo from GitHub to your computer (“clone” it).
- Go to the FutureNet demo repository: https://github.com/ragTechDev/futurenet-demo
- Follow GitHub’s official guide to clone the repo:
- Clone a repository from GitHub to GitHub Desktop:
https://docs.github.com/en/desktop/adding-and-cloning-repositories/cloning-a-repository-from-github-to-github-desktop
After cloning, you’ll have a local copy of FutureNet on your machine.
Once cloned:
- In GitHub Desktop, right-click the repository in the list or use the Repository menu.
- Choose Open in Command Prompt. A terminal should appear.
In the terminal, run:
npm installThis command reads package.json and downloads all required packages into a node_modules folder.
If this is your first time:
- It may take a few minutes, depending on your internet connection.
- You only need to run
npm installagain when dependencies change (for example, after pulling new changes that add packages).
For reference:
- npm documentation: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm
Once installation is complete, start the local dev server:
npm run devBy default (Next.js convention), this runs the app on:
Open that link in your browser.
You should now see the FutureNet UI demo running locally.
Official Next.js docs (for context):
You can make changes to the code here, or directly in GitHub.
You can use any code editor. Visual Studio Code (VS Code) is popular and beginner-friendly.
- Download VS Code: https://code.visualstudio.com/
- Official VS Code docs (getting started): https://code.visualstudio.com/docs
Once installed:
- In GitHub Desktop, right-click the repository in the list or use the Repository menu.
- Choose Open in Visual Studio Code (or your preferred editor).
To open a terminal in the project folder (VS Code example):
- With the project open in VS Code, open the menu Terminal ▸ New Terminal.
- This should open a terminal at the project’s root directory (where
package.jsonis located).
Official GitHub Desktop docs (opening in an editor):
As you edit files (for example app/page.tsx), the browser will auto-refresh.
Examples of non-coding contributions you can make:
- Copy edits (spelling, clarity, tone) in documentation
- Suggesting content changes for kid/parent-facing text
- Updating designs in documentation and noting UX improvements
- Tidying up file names, structure, or README instructions
If you’re unsure where to start, you can:
- Check the issue list on GitHub for labels like
good first issueordocumentation. - Comment on an issue to ask for clarification.
Official GitHub docs on issues and pull requests:
- Issues: https://docs.github.com/en/issues/tracking-your-work-with-issues/about-issues
- Pull requests: https://docs.github.com/en/pull-requests/collaborating-with-pull-requests
You don’t need to memorize Git commands; GitHub Desktop provides a visual workflow.
Follow GitHub’s official Desktop docs for detailed steps:
- Making changes in a branch:
https://docs.github.com/en/desktop/making-changes-in-a-branch
Typical flow (high-level):
- In GitHub Desktop, create a new branch (e.g.,
docs/update-contributing-guide). - Make your edits in the editor.
- Come back to GitHub Desktop: you’ll see a list of changed files.
- Write a short summary of what you changed.
- Click Commit to <your-branch>.
- In GitHub Desktop, click Push origin to upload your branch to GitHub.
- You’ll see a button or link to Create Pull Request.
- This opens GitHub in your browser where you can:
- Add a title (short description of your change)
- Add more details in the description if needed
- Submit the pull request
Official GitHub docs:
- Creating a pull request:
https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/creating-and-managing-pull-requests/creating-a-pull-request
We’ll review your pull request, give feedback if needed, and help you land your first contribution.
If you get stuck at any step:
- Open an issue in the repository describing where you got stuck and what you tried.
- Include screenshots or copy-paste error messages when possible.
Official GitHub docs (general help):
- GitHub Docs home: https://docs.github.com/
Thank you for taking the time to contribute to FutureNet — especially if this is your first ever open-source contribution.