Add a method for context-based code snippets

[sanderson]

It would be awesome to have a method for context/language-based code snippets. I see it being essentially the same as the existing db snippet method, with a bit of a different implementation.

Use Cases

JS Front-End Frameworks

When using frameworks like Ember, React, Vue, and Angular, the backend of the app may be something other than node and the boxfile.yml requirements change. If using a Node.js backend, the boxfile.yml would look like this:

run.config:
  engine: nodejs

But if using other backends, it requires the following:

run.config:
  engine: ruby
  extra_packages:
    - nodejs
  cache_dirs:
    - node_modules
  extra_path_dirs:
    - node_modules/.bin
  extra_steps:
    - yarn

(The engine would depend on the language of the backend)

Different Dependency Managers

Node.js has both npm and yarn, whose commands differ slightly. We could create snippets for both and let the users choose between the two.

Yarn

$ yarn

NPM

$ npm install

Note about implementation: The method could look for an "icon" attribute in the data, but if it doesn't exist, it just uses the text in the "name" attribute. I think the "name" attribute could also be used as a browser tooltip for text and icons.

Integration / Implementation Examples

At some point we may want to include guides for integrating with 3rd party services. If this method could be built is such a way to show integration examples in different languages, it would be awesome. This would require that each snippet defines its syntax.

In Summary

(Just thoughts, not necessarily requirements)

• A new method that works similarly to the current db snippet method

• If an "icon" isn't provided, it just uses the "name".

• Each different snippet should define its own syntax

• One possible way to build this is that the html in the markdown file references a specific "snippets-set" file that includes all the necessary data. It would have the name, icon, etc along with all the different code snippets. The could even be written in GFM, with the syntax defined after the fence. For example:

  In the article markdown

  <div class="meta" data-class="snippet" data-snippet-set="frontend-js-framework-opts" ></div>

  frontend-js-framework-opts.yml
  Not sure if yaml is the best for this or if the syntax below would even work

  name: Nodejs
  icon: nodejs
  snippet: > 
    ```yaml
    run.config:
      engine: nodejs
    ```
  
  name: Ruby
  icon: ruby
  snippet: > 
    ```yaml
    run.config:
      engine: ruby
      extra_packages:
        - nodejs
      cache_dirs:
        - node_modules
      extra_path_dirs:
        - node_modules/.bin
      extra_steps:
        - yarn
    ```