Options
Save All Changes
Revert changes
Delete All Changes
Contents
  TryITJS - What is it
1  Problem statement
1.1  Documenting JS Libraries
1.1.1  API docs are hard to digest
1.1.2  So Much To Read
  Solution option
1  Jsfiddle JSBin
2  Jupyter Notebook (for Javascript)
3  TryiyJS
  TryItJs Tutorial
1  Introduction
2  An example of a tryit block
2.1  Jupyter Notebook
3  [Why TryITJs](./why_tryit/index.html)
4  [Lets Begin](./lets-begin/index.html)
5  Simple API Project
6  [Lodash Tutorial](./lodash_tutorial/index.html)
7  Another block
8  Simple API Project
9  [Lodash Tutorial](./lodash.html)
10  Simple API Project
11  [Lodash Tutorial](./lodash.html)

Click to show TOC

TryITJS - What is it

Problem statement

Documenting JS Libraries

API docs are hard to digest

So Much To Read

We all know developers are bust, and documenting API is hard to do. Let's face it reading somebody else's code is hard particularly if the API is anyting other than small and simple.

It is often harder to write documentation for a function than it is to write the function in the first place. Most often the doctment barely enough to even understant the simple usage of the API. But ther is one saving grace - developers love to tinker with som code that is known to work.

  • Developers love to play with code
  • Make displaying data simple


Solution option

Jsfiddle JSBin

Jupyter Notebook (for Javascript)

TryiyJS

  • KISS principle

  • Tools you know

  • Javascript

  • Markdown

  • HTML

  • Scalable

    • *


TryItJs Tutorial

This is an interactive tutorial on how TryItJS can be use to document a API.

Introduction

Simple tool to help JavaScript module developers to provide tutorials for the library. It generates a standalone HTML file that behaves like a Jypyter Notebook

An example of a tryit block

You can edit and run the code below and display the result.

 
 
       

Jupyter Notebook

Jupyter is a great way of playing with javascript libraries (or any other langeage supported). You can build well crafted tutorials with code examples that can play with all in the browser. The real downside is that the jupyter environment has to be setup locally. It takes substantial knowledge and effort to setup a Jupyter environment. Further, it takes yet more effort to setup everything required to test a library.

Why TryITJs

Lets Begin

Simple API Project

Lodash Tutorial

Another block

!head --- to be a page this must be at the top of the page
  <!-- add a title -->;
  <title>Test Tryit</title>
  <!-- add some custon scripts, in this case the lodash library -->

  <script src="https://cdn.jsdelivr.net/npm/lodash@4.17.15/lodash.min.js"></script>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.2.0/build/styles/solarized-light.min.css">
  <!-- some in-line script -->

  <script>
  let words = ['sky', 'wood', 'forest', 'falcon', 
      'pear', 'ocean', 'universe'];
  </script>
  <!-- end of the inline script -->

!md
## Simple API Project

## [Lodash Tutorial](./lodash.html)
!html
   </div>
    

      <iframe width="560" height="315" 
        src="https://www.youtube.com/embed/0pcOxoPJ7-U" frameborder="0" 
        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 
        allowfullscreen>
      </iframe>
    </div>
    </div>


    @@include xxx.try  --- this includes the body of the file 'xxx.tyy' here (a page fragment)

!tryit 
var x = 5; // var decl (full file scope)
let y = '10'; // scope of this code snippet    

!end --- end of the file
    ... HTML ot add to the bottom of the page goes here...
 
 
       

Simple API Project

Lodash Tutorial