Getting started
How to get started with JSFiddle.
Opening an empty fiddle will give you the option to start fresh or create a fiddle from our boilerplates:
JSFiddle has the notion of panels (or tabs if you switch into the tabbed layout), there are 4 panels, 3 where you can enter code, and 1 to see the result.
- HTML - structure code, no need to add
bodydoctypehead, that's added automatically - CSS - styles. You can switch pre-pocessor to SCSS
- JavaScript - behavior. There are many frameworks and code pre-processors you can use
Once you enter code, just hit Run in the top actions bar, and the fourth panel with results will appear.
- Save / Update will do what you think, it'll save a new fiddle or update an existing one (and add a version number to it)
- Fork will split out an existing fiddle into a new one, starting with version 0
This action is available for logged in users only.
If you're working a fiddle and updating it, the version number will increase, sometimes if you're satisfied with the code you have it's good to save it so that the version numbers are hidden, and the version you've set as base is the default one.
For example if you have a fiddle
jsfiddle.net/oskar/aba321/23 setting as base will make the 23 version accessible at jsfiddle.net/oskar/aba321When you save a new title or description for the fiddle, saving it will not result in any change on your dashboard, you need to set the fiddle as Base for the new title and description to appear.
Last modified 4yr ago