Skip to content

[readme] restored docs and formatted main #433

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 7, 2020
+35 −86
Merged

[readme] restored docs and formatted main #433

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 14 additions & 5 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,17 @@
![Visual Studio Marketplace Version](https://vsmarketplacebadge.apphb.com/version/Coderoad.coderoad.svg)
![Visual Studio Marketplace Installs](https://vsmarketplacebadge.apphb.com/installs/Coderoad.coderoad.svg)
![Visual Studio Marketplace Downloads](https://vsmarketplacebadge.apphb.com/downloads/Coderoad.coderoad.svg)

# CodeRoad VSCode
<p align="center">
<a href="https://coderoad.github.io/">
<img alt="CodeRoad Logo" src="https://user-images.githubusercontent.com/9423525/89562564-26b4f780-d7e8-11ea-9eb0-3109b0e55d3b.png" width="100" />
</a>
</p>
<h1 align="center">
CodeRoad VSCode
</h1>

<p align="center">
<a href="#" alt="Version"><img src="https://vsmarketplacebadge.apphb.com/version/Coderoad.coderoad.svg" /></a>
<a href="#" alt="Installs"><img src="https://vsmarketplacebadge.apphb.com/installs/Coderoad.coderoad.svg" /></a>
<a href="#" alt="Downloads"><img src="https://vsmarketplacebadge.apphb.com/downloads/Coderoad.coderoad.svg" /></a>
</p>

CodeRoad is a VSCode extension that allows you to play interactive coding tutorials in your editor.

Expand Down
102 changes: 21 additions & 81 deletions docs/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,93 +1,33 @@
<p align="center">
<a href="https://coderoad.github.io/">
<img alt="CodeRoad Logo" src="https://user-images.githubusercontent.com/9423525/89562564-26b4f780-d7e8-11ea-9eb0-3109b0e55d3b.png" width="100" />
</a>
</p>
<h1 align="center">
CodeRoad VSCode
</h1>
# Website

<p align="center">
<a href="#" alt="Version"><img src="https://vsmarketplacebadge.apphb.com/version/Coderoad.coderoad.svg" /></a>
<a href="#" alt="Installs"><img src="https://vsmarketplacebadge.apphb.com/installs/Coderoad.coderoad.svg" /></a>
<a href="#" alt="Downloads"><img src="https://vsmarketplacebadge.apphb.com/downloads/Coderoad.coderoad.svg" /></a>
</p>
This website is built using [Docusaurus 2](https://v2.docusaurus.io/), a modern static website generator.

CodeRoad is a VSCode extension that allows you to play interactive coding tutorials in your editor.
### Installation

![CodeRoad Image](./docs/static/img/tutorial-example.png)
```
$ yarn
```

## Why
### Local Development

Interactive learning is the most effective way to gain new skills and knowledge. CodeRoad aims to help tutorial creators develop and share interactive content with the community.
```
$ yarn start
```

For learners, there are a number of advantages to running tutorials inside VSCode:
This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server.

- learn in a real world coding environment
- get rapid feedback on save and helpful error messages
- users own the code, and can build a Git timeline and deploy a portfolio
### Build

## Getting Started
```
$ yarn build
```

### Start
This command generates static content into the `build` directory and can be served using any static contents hosting service.

To start the extension, inside VSCode:
### Deployment

- open an empty VSCode workspace (an empty folder)
- launch the app from the VSCode command palette:
- select “View” > “Command Palette” from the top panel OR press `cmd/ctrl + shift + P`
- in the command palette, search for and run `CodeRoad:Start`
- a webview should appear on the right side of your editor. Click "Start"
```
$ GIT_USER=<Your GitHub username> USE_SSH=true yarn deploy
```

### Install

Install CodeRoad from [this link in the VSCode Marketplace](https://marketplace.visualstudio.com/items?itemName=CodeRoad.coderoad).

- You may need to reload the window (`ctrl/cmd + R`)
- See ["Start"](#start) to get started.

### Requirements

- OS: MacOS, Windows, Linux
- VSCode 1.39.2+
- Node.js 10+
- Git

## How CodeRoad Works

Read more in the docs about [how CodeRoad works](https://coderoad.github.io/docs/how-coderoad-works).

## Creating Tutorials

Build and share your own interactive tutorials.

Learn more about [how tutorials area created](https://coderoad.github.io/docs/build-tutorial).

## Editing Tutorials

Tutorials can be edited directly as markdown on Github.

## Development

To run the extension locally:

- copy environmental variables from `/web-app/.env.example` as `/web-app/.env`
- install dependencies with `yarn install-all`
- build the extension with `yarn build`
- open the extension with the vscode extension debugger by pressing F5. In the new window, open CodeRoad.

To test a packaged build locally:

- if on Mac, ensure you have [VSCode command line tools](https://code.visualstudio.com/docs/setup/mac#_launching-from-the-command-line) installed
- run `yarn package`. It will build the extension and install it locally.
- open a new vscode window and launch the new version of CodeRoad

## Contributing

CodeRoad is an ambitious project, we're always looking for contributors :)

See [CONTRIBUTING.md](./CONTRIBUTING.md).

## License

[AGPL v3](./LICENSE.md)
If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.