- Code of Conduct
- Code Organization
- Setting Up the project locally
- Submitting a Pull Request
- Add yourself as a contributor
We have a code of conduct you can find here and every contributor is expected to obey the rules therein. Any issues or PRs that don't abide by the code of conduct may be closed.
The CodeSandbox client is currently divided in to 5 parts. We use lerna
to
share dependencies between these parts.
app
: The editor, the search, profile page, the embed and the sandbox.homepage
: The Gatsby website of the homepage.common
: All common parts between these packages, reusable JS.codesandbox-api
: The npm package that's responsible for communication between the sandbox and the editor.codesandbox-browserfs
: An in-browser file system that emulates the Node JS file system API and supports storing and retrieving files from various backends. Forked from https://github.com/jvilk/BrowserFS, with an additional CodeSandbox backend.
This version of CodeSandbox is using the production server as source of truth,
this is specified by the environment variable LOCAL_SERVER
. If you're working
on a feature that needs you to be logged in, you can login on
https://codesandbox.io/ and copy the contents of the
jwt
local storage key over to your development environment on
http://localhost:3000/. Be very careful with how you
handle the token, as anyone who knows it can login as you and have read/write
access to all your CodeSandbox content!
Working on your first Pull Request? You can learn how from this free series How to Contribute to an Open Source Project on GitHub
To install the project you need to have yarn
and node
-
Fork the project, clone your fork:
# Clone your fork git clone https://github.com/<your-username>/codesandbox-client.git # Navigate to the newly cloned directory cd codesandbox-client
-
Your environment needs to be running Node v. 10
.nvmrc
config exists in the repo root, specifying a v.10.x.x version- you can use fnm (
fnm use
) to change your current node version to the one specified in.nvmrc
-
from the root of the project:
yarn
to install all dependencies -
from the root of the project:
yarn start
- this builds the dependencies (
codesandbox-api
andcodesandbox-browserfs
) and runs theapp
development environment, available on http://localhost:3000/s/new - on subsequent runs you can also bypass dependencies building and use
yarn start:fast
- if you want to work on the homepage, start it with
yarn start:home
, it will be available on http://localhost:8000/
- this builds the dependencies (
Tip: Keep your
master
branch pointing at the original repository and make pull requests from branches on your fork. To do this, run:git remote add upstream https://github.com/codesandbox/codesandbox-client.git git fetch upstream git branch --set-upstream-to=upstream/master masterThis will add the original repository as a "remote" called "upstream," then fetch the git information from that remote, then set your local
master
branch to use the upstream master branch whenever you rungit pull
. Then you can make all of your pull request branches based on thismaster
branch. Whenever you want to update your version ofmaster
, do a regulargit pull
.
- If you want to debug the state of the app, install the
Cerebral Debugger
and connect it to the port
8383
. After that, if you refresh the app, you should be able to see the state, the sequences executed and so on. See documentation for reference.
Please go through existing issues and pull requests to check if somebody else is
already working on it, we use someone working on it
label to mark such issues.
Also, make sure to run the tests and lint the code before you commit your changes.
yarn test
yarn lint
Before running yarn lint
, you must have build our common
and notifications
packages.
yarn build:deps
This project follows the all-contributors specification. Contributions of any kind welcome!
To add yourself to the table of contributors on the README.md
, please use the
automated script as part of your PR:
yarn add-contributor
Follow the prompt and commit .all-contributorsrc
and README.md
in the PR.
Thank you for taking the time to contribute! 👍