mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2026-10-24 12:13:31 +08:00
docs: updates for environment and other nits (#48477)
* docs: updates for environment and other nits * docs: remove the button and link to guide * fix: title case entry
This commit is contained in:
Mrugesh Mohapatra
+10
-10
@@ -6,19 +6,19 @@
|
||||
- [Work on translating resources](how-to-translate-files.md)
|
||||
- [Work on proofreading translations](how-to-proofread-files.md)
|
||||
- **Code Contribution**
|
||||
- [Set up freeCodeCamp locally](how-to-setup-freecodecamp-locally.md)
|
||||
- [Work on mobile app](how-to-setup-freecodecamp-mobile-app-locally.md)
|
||||
- [How to contribute to the codebase](how-to-contribute-to-the-codebase.md)
|
||||
- [Follow coding best practices](codebase-best-practices.md)
|
||||
- [Set up freeCodeCamp](how-to-setup-freecodecamp-locally.md)
|
||||
- [Follow best-practices](codebase-best-practices.md)
|
||||
- [Open a pull request](how-to-open-a-pull-request.md)
|
||||
- [Work on coding challenges](how-to-work-on-coding-challenges.md)
|
||||
- [Work on practice projects](how-to-work-on-practice-projects.md)
|
||||
- [Work on Codebase](how-to-contribute-to-the-codebase.md)
|
||||
- [Work on Coding Challenges](how-to-work-on-coding-challenges.md)
|
||||
- [Work on Component Library](how-to-work-on-the-component-library.md)
|
||||
- [Work on Practice Projects](how-to-work-on-practice-projects.md)
|
||||
- [Work on Mobile app](how-to-setup-freecodecamp-mobile-app-locally.md)
|
||||
- [Work on tutorials with CodeRoad](how-to-work-on-tutorials-that-use-coderoad.md)
|
||||
- [Work on localized client web app](how-to-work-on-localized-client-webapp.md)
|
||||
- [Work on Localized Web App](how-to-work-on-localized-client-webapp.md)
|
||||
- [Work on Cypress tests](how-to-add-cypress-tests.md)
|
||||
- [Work on video challenges](how-to-help-with-video-challenges.md)
|
||||
- [Work on documentation](how-to-work-on-the-docs-theme.md)
|
||||
- [Work on the component library](how-to-work-on-the-component-library.md)
|
||||
- [Work on Video Challenges](how-to-help-with-video-challenges.md)
|
||||
- [Work on Documentation](how-to-work-on-the-docs-theme.md)
|
||||
- **Additional Guides**
|
||||
- [Understand the curriculum file structure](curriculum-file-structure.md)
|
||||
- [Debug outgoing emails locally](how-to-catch-outgoing-emails-locally.md)
|
||||
|
||||
@@ -204,7 +204,6 @@ A quick reference to the commands that you will need when working.
|
||||
|
||||
| command | description |
|
||||
| -------------------------------------------------------------- | ----------------------------------------------------------------------------------- |
|
||||
| `npm run storybook` | Starts Storybook for component library development. |
|
||||
| `npm test` | Run all JS tests in the system, including client, server, lint and challenge tests. |
|
||||
| `npm run test-client` | Run the client test suite. |
|
||||
| `npm run test:curriculum` | Run the curriculum test suite. |
|
||||
@@ -214,3 +213,4 @@ A quick reference to the commands that you will need when working.
|
||||
| `npm run test-server` | Run the server test suite. |
|
||||
| `npm run e2e` | Run the Cypress end to end tests. |
|
||||
| `npm run clean` | Uninstalls all dependencies and cleans up caches. |
|
||||
| `npm run storybook` | Starts Storybook for component library development. |
|
||||
|
||||
@@ -2,6 +2,71 @@ Follow these guidelines for setting up freeCodeCamp locally on your system. This
|
||||
|
||||
Some of these contribution workflows – like fixing bugs in the codebase or curriculum – need you to run freeCodeCamp locally on your computer.
|
||||
|
||||
> [!TIP]
|
||||
> If you are not interested in setting up freeCodeCamp locally, consider using Gitpod. We have automated the process of installating all the dependencies & tools you will need.
|
||||
>
|
||||
> Continue reading this guide to learn more about using GitPod.
|
||||
|
||||
## Fork the repository on GitHub
|
||||
|
||||
[Forking](https://help.github.com/articles/about-forks/) is a step where you get your own copy of freeCodeCamp's main repository (a.k.a _repo_) on GitHub.
|
||||
|
||||
This is essential, as it allows you to work on your own copy of freeCodeCamp on GitHub, or to download (clone) your repository to work on locally. Later, you will be able to request changes to be pulled into the main repository from your fork via a pull request (PR).
|
||||
|
||||
> [!TIP]
|
||||
> The main repository at `https://github.com/freeCodeCamp/freeCodeCamp` is often referred to as the `upstream` repository.
|
||||
>
|
||||
> Your fork at `https://github.com/YOUR_USER_NAME/freeCodeCamp` is often referred to as the `origin` repository. `YOUR_USER_NAME` would be replaced with your GitHub username.
|
||||
|
||||
**Follow these steps to fork the `https://github.com/freeCodeCamp/freeCodeCamp` repository:**
|
||||
|
||||
1. Go to the freeCodeCamp repository on GitHub: <https://github.com/freeCodeCamp/freeCodeCamp>
|
||||
|
||||
2. Click the "Fork" Button in the upper right-hand corner of the interface ([More Details Here](https://help.github.com/articles/fork-a-repo/))
|
||||
|
||||
3. After the repository has been forked, you will be taken to your copy of the freeCodeCamp repository at `https://github.com/YOUR_USER_NAME/freeCodeCamp` (`YOUR_USER_NAME` would be replaced with your GitHub user name.)
|
||||
|
||||
<details>
|
||||
<summary>
|
||||
How to fork freeCodeCamp on GitHub (screenshot)
|
||||
</summary>
|
||||
<br>
|
||||
<img src="https://raw.githubusercontent.com/freeCodeCamp/freeCodeCamp/main/docs/images/github/how-to-fork-freeCodeCamp.gif" alt="How to fork freeCodeCamp on GitHub">
|
||||
</details>
|
||||
|
||||
## Use a Local Machine or GitPod
|
||||
|
||||
Once you have forked the repository, choose one among the below. You can either use your own local machine or a GitPod-based workspace to work on the codebase.
|
||||
|
||||
For contributing long-term, we recommend you setup freeCodeCamp on your local machine.
|
||||
|
||||
### How to prepare a GitPod workspace
|
||||
|
||||
We have automated the process of installating all the dependencies & tools you will need. With GitPod you get a free ready-to-code environment in a few minutes, and is useful if you do not have access to computer or want to make one-time changes.
|
||||
|
||||
There are various ways to launch an GitPod workspace:
|
||||
|
||||
1. **(Fastest)** Prepend `gitpod.io/#` in front of any URL from GitHub.
|
||||
|
||||
For example, if you visit your fork at `https://github.com/YOUR_USER_NAME/freeCodeCamp.git`, add `gitpod.io/#` in the front of the URL in the address bar and hit enter.
|
||||
|
||||
That is you can navigate to
|
||||
|
||||
```
|
||||
gitpod.io/#https://github.com/YOUR_USER_NAME/freeCodeCamp.git
|
||||
```
|
||||
|
||||
and you should see a workspace created for you. This works for any repository or pull-request on GitHub.
|
||||
|
||||
2. Alternatively install one of the below extentions for your browser.
|
||||
|
||||
- [Chrome Webstore](https://chrome.google.com/webstore/detail/gitpod-always-ready-to-co/dodmmooeoklaejobgleioelladacbeki) - works with Chromimum-based browsers like Google Chrome, Brave, Edge, etc.
|
||||
- [Firefox Add-on](https://addons.mozilla.org/en-US/firefox/addon/gitpod) - Firefox
|
||||
|
||||
Once installed you will see a 'GitPod' button on every repository, pull-request, etc. as a handy shortcut to launch a workspace from there. See the extension page for details, screenshots, etc.
|
||||
|
||||
That's it, you can now skip to the 'syncing up from parent' section after you have launched a GitPod workspace. Most parts of this guide applies to GitPod workspaces, but be mindful of [how the URLs & Ports work within a GitPod](https://www.gitpod.io/docs/configure/workspaces/ports) workspace.
|
||||
|
||||
### How to prepare your local machine
|
||||
|
||||
Start by installing the prerequisite software for your operating system.
|
||||
@@ -52,33 +117,6 @@ Once you have the prerequisites installed, you need to prepare your development
|
||||
> [!TIP]
|
||||
> Please do not ignore any linting errors. They are meant to **help** you and to ensure a clean and simple codebase.
|
||||
|
||||
## Fork the repository on GitHub
|
||||
|
||||
[Forking](https://help.github.com/articles/about-forks/) is a step where you get your own copy of freeCodeCamp's main repository (a.k.a _repo_) on GitHub.
|
||||
|
||||
This is essential, as it allows you to work on your own copy of freeCodeCamp on GitHub, or to download (clone) your repository to work on locally. Later, you will be able to request changes to be pulled into the main repository from your fork via a pull request (PR).
|
||||
|
||||
> [!TIP]
|
||||
> The main repository at `https://github.com/freeCodeCamp/freeCodeCamp` is often referred to as the `upstream` repository.
|
||||
>
|
||||
> Your fork at `https://github.com/YOUR_USER_NAME/freeCodeCamp` is often referred to as the `origin` repository. `YOUR_USER_NAME` would be replaced with your GitHub username.
|
||||
|
||||
**Follow these steps to fork the `https://github.com/freeCodeCamp/freeCodeCamp` repository:**
|
||||
|
||||
1. Go to the freeCodeCamp repository on GitHub: <https://github.com/freeCodeCamp/freeCodeCamp>
|
||||
|
||||
2. Click the "Fork" Button in the upper right-hand corner of the interface ([More Details Here](https://help.github.com/articles/fork-a-repo/))
|
||||
|
||||
3. After the repository has been forked, you will be taken to your copy of the freeCodeCamp repository at `https://github.com/YOUR_USER_NAME/freeCodeCamp` (`YOUR_USER_NAME` would be replaced with your GitHub user name.)
|
||||
|
||||
<details>
|
||||
<summary>
|
||||
How to fork freeCodeCamp on GitHub (screenshot)
|
||||
</summary>
|
||||
<br>
|
||||
<img src="https://raw.githubusercontent.com/freeCodeCamp/freeCodeCamp/main/docs/images/github/how-to-fork-freeCodeCamp.gif" alt="How to fork freeCodeCamp on GitHub">
|
||||
</details>
|
||||
|
||||
## Clone your fork from GitHub
|
||||
|
||||
[Cloning](https://help.github.com/articles/cloning-a-repository/) is where you **download** a copy of a repository from a `remote` location that is either owned by you or by someone else. In your case, this remote location is your `fork` of freeCodeCamp's repository that should be available at `https://github.com/YOUR_USER_NAME/freeCodeCamp`. (`YOUR_USER_NAME` would be replaced with your GitHub user name.)
|
||||
@@ -154,12 +192,6 @@ And as always, feel free to ask questions on the ['Contributors' category on our
|
||||
|
||||
### Configuring dependencies
|
||||
|
||||
We have automated the process of setting up the development environment in Gitpod for you.
|
||||
|
||||
[](https://gitpod.io/#https://github.com/freeCodeCamp/freeCodeCamp)
|
||||
|
||||
(You will still need to create your own fork and branch.)
|
||||
|
||||
#### Step 1: Set up the environment variable file
|
||||
|
||||
The default API keys and environment variables are stored in the file `sample.env`. This file needs to be copied to a new file named `.env` that is accessed dynamically during the installation step.
|
||||
|
||||
@@ -44,19 +44,7 @@ Typically you would not need to change any configuration or build the site local
|
||||
|
||||
### Serving the documentation site locally
|
||||
|
||||
Clone freeCodeCamp:
|
||||
|
||||
```console
|
||||
git clone https://github.com/freeCodeCamp/freeCodeCamp.git
|
||||
```
|
||||
|
||||
Install `docsify`:
|
||||
|
||||
```console
|
||||
npx docsify serve docs
|
||||
```
|
||||
|
||||
Alternatively, if you have installed freeCodeCamp locally (see the local setup guide), we bundled the CLI with the development tools so you can run any of the below commands as needed from the root of the repo:
|
||||
Install freeCodeCamp locally ([see the local setup guide](how-to-setup-freecodecamp-locally)), we bundled the CLI with the development tools so you can run any of the below commands as needed from the root of the repo:
|
||||
|
||||
#### Serve and launch the documentation site only
|
||||
|
||||
|
||||
+1
-9
@@ -42,12 +42,4 @@ Our learning platform runs on a modern JavaScript stack. It has various componen
|
||||
|
||||
Broadly, we have a Node.js based API server, a set of React-based client applications, testing scripts to evaluate camper-submitted curriculum projects, and more. If you want to productively contribute to the learning platform, we recommend some familiarity with these tools.
|
||||
|
||||
If you want to help us improve our codebase...
|
||||
|
||||
**you can either use Gitpod, a free online dev environment that starts a ready-to-code dev environment for freeCodeCamp in your browser.**
|
||||
|
||||
[](https://gitpod.io/#https://github.com/freeCodeCamp/freeCodeCamp)
|
||||
|
||||
Or you can...
|
||||
|
||||
**[Set up freeCodeCamp locally](how-to-setup-freecodecamp-locally.md) on your machine.**
|
||||
**If you want to help us improve our codebase here's [how to set up freeCodeCamp](how-to-setup-freecodecamp-locally.md).**
|
||||
|
||||
Reference in New Issue
Block a user