Angular Gist RunKit

Gist RunKit combines the power of Github Gist with RunKit.

Source Code

[Gist-RunKit website](https://kedar9444.github.io/Angular-Gist-RunKit) [Gist-RunKit source code ](https://github.com/kedar9444/Gist-RunKit) [Gist-RunKit npm](https://www.npmjs.com/package/ngx-gist-runkit) [Edit on Stackblitz](https://stackblitz.com/edit/angular-gist-runkit-demo?embed=1)

Install

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,
		...
	],
	...
})

Usage

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

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

Inputs

source : string

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>