kedar9444/Angular-Gist-RunKit

Angular Gist RunKit

Gist RunKit combines the power of Github Gist with RunKit.

Install the package.

$ npm i -s ngx-gist-runkit

Add the RunKit embed library to your index page:

src/index.html

<head>
    ...
    <script src="https://embed.runkit.com"></script>
    ...
</head>

Whitelist angular-runkit in your System.js config:

src/systemjs.config.js (if applicable)

map: {
    ...
    'angular-runkit': 'npm:angular-runkit/dist/index.js',
    ...
}

Declare the component in your module:

src/app/app.module.ts

import { NgxGistRunkitModule } from 'ngx-gist-runkit'

...

@NgModule({
	...
	imports: [
		...
		NgxGistRunkitModule,
		...
	],
	...
})

<app-ngx-gist-runkit [gistId]="gistId" [gistFileName]="gistFileName" ></app-ngx-gist-runkit>

Don't forget to check out the RunKit embed docs.

Basically there are two inputs one is [gistId] and second is [gistFileName].

[gistId] : is the id present after you username when you open your gist on github.

[gistFileName] : Before creating any Gist github asks for the filename you have to enter the same.

Please check below image for more details.

<app-ngx-gist-runkit [gistId]="gistId" [gistFileName]="gistFileName" ></app-ngx-gist-runkit>

Gist RunKit combines the power of Github Gist with RunKit.

Language:TypeScript 84.6%Language:JavaScript 11.7%Language:HTML 3.2%Language:CSS 0.5%