Prototyping and coding is an iterative, explorative and collaborative activity. When it comes to reaching out to technical support, customers, peers or the crowd, you may need to share code snippets that illustrate a prototype or an encountered problem.
The snippet is a small block of code that works on its own without necessity for the other party to install the entire environment. With free online services it has become really easy to exchange JavaScript snippets with other people.
Thus, the purpose of the code snippet is to prototype a project, to localize an issue, or a bug, and jointly evolve your project.
This quick tutorial will help you publish a code snippet to get across to the NEXT team.
A lot of companies and Internet services provide web-based JavaScript sandboxes for free. In general, they provide three code editors: HTML, CSS and JavaScript, as well as a pane to render the result in. You can save, share, "fork" (that is, copy) and even like and comment on the snippets.
Here's a short list of most known sandboxes:
There are many more others, so choose the one you prefer.
We normally use Codepen for the examples we share in our support group and mailer, as well as for the published tutorials.
To start, open http://codepen.io in your favorite web browser.
First, hit "New Pen":
Three panels (HTML, CSS, JS) will show up:
Press "Settings" button to reveal the window.
Tap the CSS tab and add https://abdvl.github.io/src/dist/css/next.css as an external CSS file.
Switch to the JavaScript tab and add https://abdvl.github.io/src/dist/js/next.js as an external JS source.
Now you can start writing code of your snippet in the JS text editor.
Don't forget to save your code before you copy the link and close the tab.
Great, you've created the snippet! Now that it runs on your system, you're welcome to copy the link to the webpage and share with us :)