tutoaster

• TuToaster Toast your tutorials for publishing. Tutoaster is a simple tool I've created to:

• Learn FRP (RxJS)
• Convert my code to publisheable content

** Why Well, we're always complaining there isn't enough good material to teach real code, examples in tutorials are too shaby and childish to be useable in real world and so on. At least I do. So many times it happen that I am trying to learn something new doing painful things which someone else has already been through. I wish that someone had blogged about it, put it somewhere on some forum or something. So much of my life's time would've saved. Then I learn it, and I don't blog about it. Because blogging is boring. That is the problem. But hey! coding is fun, right? So I thought let's make something that'll convert code to publishable content. There already are awesome tools like [[https://jashkenas.github.com/docco/][docco]] and [[https://github.com/nevir/groc][groc]] which create docs for your code (annotated code). This tool does something similar, but with a context. I mean it does that for publishing. It (should) convert your code to blog posts, presentations, books, even interactive tutorials. ** Really? No, just kidding. It can do all that though, but all those publishing components are not implemented yet. It has a single recipe and a single cook for that recipe, which creates a battling code and cook a presentation like single HTML file for that. ** Recipe? Cook? (are you) Nuts? Oh! I didn't tell you? I wrote tutoaster as an experiment for writing funny code. Most of the app (as much as I wrote before I had to rush it, almost 80% of it) is written in reference to a toast. Your project is the bread, files are slices, slices have sections in them. The bread is toasted using a recipe (which decides how the sections should be formatted), and cook cooks the recipe (convert code to publishable content) to end-produce (toast). There can be different cooks which publish same code for different mediums, like convert the code to a blog post, a presentation etc. ** How to use? #+begin_src bash $> tutoaster --help

Usage: tutoaster [options] [command]

Commands: toast [recipe] [cook] Toast the tutorial from files with -x extension with recipe

Options:

-h, --help             output usage information
-V, --version          output the version number
-v, --verbose          Show debug and info messages
-x, --extension [ext]  Extension of files you wanna toast

Example: tutoaster toast [recipe] help

Available recipes:

• compare

$> tutoaster toast --help

Usage: toast [options] [recipe] [type]

Toast the tutorial from files with extension ext with recipe

Options:

-h, --help  output usage information

$> tutoaster toast -x js compare help Example: tutoaster toast compare [type]

Available cooks:

• deck - deck cooks your code to a simple deck.js presentation. The published content is like a blog post only, but different sections are presented as slides, navigable with arrow keys etc. It uses a Medium like simple theme by default. #+end_src

Yea I know that looks like wtf. Just do this and you'll know what it does for now: #+begin_src bash tutoaster toast -x js compare #+end_src Replace js above with whatever extension of your code files is. It supports several langauges. It will create a toast folder in your present directory which will have a deck.html file. deck cook inline all the css/js/images it need to publish your code, so that single file is all you need. ** I said HOW TO USE IT you moron Oh, you meant how to write code for publishing. You don't need to be so man you sick fuck. Anyway, only recipe right now is compare and it only has deck cook (default). *** Recipes **** Compare Compare is for comparing two sets of code. You write examples of code that are comparable, and compare cook publish that code using one of its cooks. Comparable code means the code which does same thing, but using different techniques. e.g Functional Vs Imperative. You can write your code in a single file, or span it to multiple files, compare doesn't care. Your code is divided into different sections. Sections are marked by blocks of code. You have to provide some metadata about your section in the comments right above the section. Look at below example for understanding it better. Example: #+begin_src javascript /**

• Functional vs Imperative

• This section is outside all sections and have no meta-data. This will become the first page of your published recipe.
• i.e the header/face of your presentation. */

/**

• @section Loop over an array for side effects : Name of the section. It become the title of the slide/post
• @name Imperative : Name of the section. Used to mark the code in published slide/post with.
• @compare-id iteration : Not required, but you can have multiple compare blocks in same slide/post. In that case you need to mark them with ids.
• @compare-side left : The side on which this section should be shown in compare block (can be right or left)
• Following this is the commentory that follows the code comparison in your post/slide.
• In imperative programming, we create a for loop for looping over the array, to
• iterate the loop and do something with the value, like print it to the console.

*/

var array = [1, 2, 3, 4, 5, 6, 7, 8];

for(var i = 0; i < array.length; i++) { console.log(array); //this is comment inside code }

/**

• @section Loop over an array for side effects
• @name Imperative
• @compare-id iteration
• @compare-side right

*/ var array = [1, 2, 3, 4, 5, 6, 7, 8];

array.forEach((item) => console.log(item));

#+end_src The end result will look something [[http://i.imgur.com/sriu5qw.png][like this screenshot]].

** FRP, huh? Yea. I wrote this mostly for fun. I used [[https://github.com/Reactive-Extensions/RxJS/][RxJS]] and ES2015 for writing this module. Don't worry, I transcompile it to ES5 with babel, so you don't need to use latest version of node/io for using it. But you can read the code if you might, you might like it. I wrote it in a funny way to. ** How to install? Well, #+begin_src bash npm install -g tutoaster #+end_src Or, you can clone this repo, cd to it, do a npm install and then npm link to install a local version. ** How do I modify it on my machine? First clone this repo, cd to it, do a npm install and then npm link to install a local version. Then you can run following command from the cloned repo to launch babel to watch for changes so it will compile the code to ES5 whenever you make a change: #+begin_src bash nodemon -V which npm run compile -w ./src #+end_src