Physically? No idea.
Digitally? You’re at Scratch’s open source web client!
We’re working to update the Scratch website to use a new codebase, contained in this repository.
We’re currently building Scratch using React and SCSS. Here are some resources to help you get acquainted with how we’re working on the Scratch codebase:
It's important to make sure that all of the dependencies are up to date because the scratch-www code only works with specific versions of the dependencies. You can update the packages by running this command:
npm install
To compile the source code into HTML and JavaScript bundles browsers can read, run this command:
npm run build
If you want to run a server that rebuilds the files as you edit them, skip to the To Run section below.
These warnings can be safely ignored:
npm WARN react-modal@0.6.1 requires a peer of react@^0.14.0 but none was installed.
npm WARN react-redux@4.4.0 requires a peer of react@^0.14.0 but none was installed.
npm WARN react-redux@4.4.0 requires a peer of redux@^2.0.0 || ^3.0.0 but none was installed.
npm WARN react-addons-test-utils@0.14.7 requires a peer of react@^0.14.7 but none was installed.
npm WARN react-dom@0.14.8 requires a peer of react@^0.14.8 but none was installed.
These currently exist in static/js/lib
If you would like to create a temporary version of the site on your machine that you can access through your web browser run the command below. Building (see To Build above) is not necessary for this step and the temporary server can be turned off (see To Stop below).
The intl directory must be built separately with the npm run translate
line below in order for the text to appear properly.
npm run translate
npm start
The site hosted on your local machine can now be accessed by a web browser by entering localhost:8333 into your web browser.
During development, npm start
watches any update you make to files in either ./static
or ./src
and triggers a rebuild of the project. In development, the build is stored in memory, and not served from the ./build
directory.
When running npm start
, here are some important log messages to keep an eye out for:
webpack: bundle is now VALID.
– The bundle has been loaded into memory and is now viewable in the browser. This will show up both once npm start
has completed its setup, and also once updates you make to files have been re-compiled for viewing in the browser.webpack: bundle is now INVALID.
– If you see this, then it means you have made updates to files that are still being compiled for browser viewing. Pages will still be viewable, but they will not see any updates you made yet.Once running, open http://localhost:8333
in your browser. If you wish to have the server reload automatically, you can install either nodemon or forever.
To stop the process that is making the site available to your web browser (created above in To Start) use ^C
.
npm start
can be configured with the following environment variables
Variable | Default | Description |
---|---|---|
API_HOST |
https://api.scratch.mit.edu |
Hostname for API requests |
ASSET_HOST |
https://assets.scratch.mit.edu |
Hostname for asset requests |
BACKPACK_HOST |
https://backpack.scratch.mit.edu |
Hostname for backpack requests |
PROJECT_HOST |
https://projects.scratch.mit.edu |
Hostname for project requests |
SENTRY_DSN |
'' |
DSN for Sentry |
FALLBACK |
'' |
Pass-through location for old site |
GA_TRACKER |
'' |
Where to log Google Analytics data |
NODE_ENV |
null |
If not production , app acts like development |
PORT |
8333 |
Port for devserver (http://localhost:XXXX) |
NOTE: Because by default API_HOST=https://api.scratch.mit.edu
, please be aware that, by default, you will be seeing and interacting with real data on the Scratch website.
To run:
npm test
This will build the application and run the unit and localization tests. Some of the tests are run using the TAP framework and others run using Jest.
We are transitioning from using TAP to using Jest as our testing framework so for the time being our tests run using both.
$ SMOKE_USERNAME=username SMOKE_PASSWORD=password ROOT_URL=https://scratch.mit.edu npm run test:integration
$ SMOKE_USERNAME=username SMOKE_PASSWORD=password ROOT_URL=https://scratch.mit.edu node_modules/.bin/tap ./test/integration-legacy/smoke-testing/filename.js --timeout=3600
$ SMOKE_USERNAME=username SMOKE_PASSWORD=password ROOT_URL=https://scratch.mit.edu node_modules/.bin/jest ./test/integration/filename.test.js
$ SMOKE_USERNAME=username SMOKE_PASSWORD=password SAUCE_USERNAME=saucelabsUsername SAUCE_ACCESS_KEY=saucelabsAccessKey ROOT_URL=https://scratch.mit.edu npm run test:integration:remote
Variable | Default | Description |
---|---|---|
ROOT_URL |
scratch.ly |
Location you want to run the tests against |
SMOKE_USERNAME |
None |
Username for Scratch user you're signing in with to test |
SMOKE_PASSWORD |
None |
Password for Scratch user you're signing in with to test |
SMOKE_REMOTE |
false |
Tests with Sauce Labs or not. True if running test:smoke:sauce |
SMOKE_HEADLESS |
false |
Run browser in headless mode. Flaky at the moment |
SAUCE_USERNAME |
None |
Username for your Sauce Labs account |
SAUCE_ACCESS_KEY |
None |
Access Key for Sauce Labs found under User Settings |
Deploying to staging or production will upload code to S3 and configure Fastly.
npm install
virtualenv ENV
. ENV/bin/activate
pip install -r requirements.txt
npm run build && npm run deploy
Variable | Default | Description |
---|---|---|
FASTLY_SERVICE_ID |
'' |
Fastly service ID for bin/configure-fastly.js
|
FASTLY_API_KEY |
'' |
Fastly API key for bin/configure-fastly.js
|
FASTLY_ACTIVATE_CHANGES |
false |
Activate changes and purge all after configuring |
AWS_ACCESS_KEY_ID |
'' |
AWS access key id for S3 |
AWS_SECRET_ACCESS_KEY |
'' |
AWS secret access key for S3 |
S3_BUCKET_NAME |
'' |
S3 bucket name to deploy into |
We're currently in the process of transitioning into this web client from Scratch's existing structure. As we transition, there are going to be some issues along the way that relate to how this client needs to interact with the existing infrastructure to work properly in production.
On top of migrating to using this as our web client, Scratch is also transitioning into using a new API backend, Scratch REST API. As that is also currently in development and incomplete, we are set up to fall back to using existing Scratch endpoints if an API endpoint does not exist – which is where the FALLBACK
comes in.
Most of the issues we have currently revolve around the use of FALLBACK
. This variable is used to specify what URL to fall back onto should a request fail within the context of this web client, or when using the API_HOST
. If not specified in the process, it will not be used, and any request that is not made through the web client or the API will be unreachable.
Setting FALLBACK=https://scratch.mit.edu
allows the web client to retrieve data from the Scratch website in your development environment. However, because of security concerns, trying to send data to Scratch through your development environment won't work. This means the following things will be broken for the time being:
Additionally, if you set FALLBACK=https://scratch.mit.edu
, be aware that clicking on links to parts of the website not yet migrated over (currently such as Explore
, Discuss
, Profile
, etc.) will take you to the Scratch website itself.
Some users have experienced difficulties when trying to get our web client to work on Windows. One solution could be to use Cygwin. If that doesn't work, you might want to use Wubi (Windows XP, Vista, 7) or Wubiuefi (Windows 8 or higher). Wubi(uefi) is a Windows Installer for Ubuntu that allows you to have Ubuntu and Windows on one disk, without the need of an extra partition.
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。