datacamp-light

DataCamp Light

Roadmap | Docs

• Features
• How to run the app
• Writing the HTML block
  • Pre-Exercise Code
  • Sample Code
  • Solution
  • Submission Correctness Test (SCT)
  • Hint
  • Other Options
• How does it work?
• Contributing
  • Dependencies
  • Testing
    • Run tests
    • Reducers
    • Components
    • Middleware
  • DevOps
    • Formatting with Prettier
    • Code Quality: ESLint, TSLint, Stylelint
    • Commit Messages
    • Continuous Integration
    • Packages used that you might want to know about

Features

• Convert any website or blog to an interactive learning platform.
• Works for both R and Python. Sessions are maintained on DataCamp's servers.
• Convert existing markdown documents to an interactive course using the tutorial package.
• Check out a demo R and Python example.
• Leverage the same Submission Correctness Tests (SCT) DataCamp uses for all their courses. For R, there's the testwhat (GitHub wiki); for Python, there's pythonwhat (GitHub wiki).

How to run the app

Add the script to your HTML page (there is an example in examples/standalone-example.html):

<script type="text/javascript" src="//cdn.datacamp.com/dcl-react.js.gz"></script>

That's it! If your app adds DataCamp Light exercises after the initial page load (for example, in React apps), call the following function to initialize those new exercises:

initAddedDCLightExercises();

You can also use the JavaScript library in a stackoverflow.com answer by including the exercise and script tag as a snippet.

Writing the HTML block

After including the JavaScript library, you can start writing HTML blocks in the format below. These will be dynamically converted to exercises.

</div>

As we can see in the example, the whole exercise is contained in a single `

…

css [data-datacamp-exercise] { visibility: hidden; }

…

git clone https://github.com/datacamp/datacamp-light.git cd datacamp-light git checkout beta npm i npm start

### Dependencies

The `vendor/` folder includes minified code of some internal DataCamp packages
that are not hosted publicly right now.

### Testing

Please read these two documents before starting to implement any tests:
- [Writing tests in redux](http://redux.js.org/docs/recipes/WritingTests.html)
- [Writing tests for side effects](https://redux-observable.js.org/docs/recipes/WritingTests.html)

Test files are named as `{moduleName}.spec.js`.

#### Run tests

```bash
npm test

…

https://cdn.datacamp.com/dcl-react-dev.js.gz

Next, commits to the beta branch push a release to the staging environment:

https://cdn.datacamp.com/dcl-react-staging.js.gz

Finally, when we create a release, an update is pushed to the production environment. This should be a stable version of DataCamp Light:

https://cdn.datacamp.com/dcl-react.js.gz

Commits to this branch trigger a build that is deployed on the DataCamp Dev environment. Commits to the main branch, beta, are built and deployed to staging. When a release is created, that build is deployed to production.

Packages used that you might want to know about

• TypeScript, of course. Make sure you install an appropriate plugin for your editor, if it doesn't ship with one.

• redux-observable for observable middleware

• typescript-fsa for easy, type-safe action creators

• typescript-fsa-reducers for super-clean reducers