Developer's must-have code playground

Source: Internet
Author: User
Tags mootools

If you are a developer, in search of the best code playground, enjoy the fun of the code then you come to the right place. In this article Devstore has collected 10 of the best free code playgrounds and sandbox tools for testing, debugging, and sharing code. If you know other good code playgrounds, you can tell me through the comments.

1. Codepen

Codepen is a web-front playground. It is based on stimulation, imparting and sharing. Can highlight popular examples ("Pen") and provide advanced features such as sharing and embedding. Need to create a reduction test case to demonstrate and find a bug? Codepen is absolutely perfect for this scene. Want to show off your latest creations and get feedback from your peers? Codepen is an absolute choice.

2. Cssdesk

Cssdesk is an online CSS sandbox. It enables people to quickly test a snippet of CSS code and observe real-time results. I have a very optimistic about this project. There are line numbers and text boxes that enter real-time syntax highlighting. One of the best things about it is that it allows users to share their code with others.

3. Google ' s Code Playground

Google's code playground is a Web-based tool that allows Web developers to try out all of Google's provided APIs, tweak code, and view results. Google's code playground allows you to enjoy without having to open an external editor, and all the APIs are loaded on the (left) "Pick an API" box.

4. JS Bin

JS bin is a web app designed to help JavaScript and CSS Pro test and collaborate on debugging code in some contexts. JS bin allows you to edit and test JavaScript and HTML. Once satisfied, you can save and send this URL to peer review or ask for help. They can then make further modifications if they need to save the update.

5. Jsfiddle

Jsfiddle is a shell editor that simplifies the writing of JavaScript by creating a custom environment based on the popular JS framework. You can choose the frame and version (optional with Mootools,jquery,ojo, Prototype, YUI, Glow,vanilla). In addition, if you do, you can add a free framework like jquery UI or mootools more. It has an excellent feature of being able to generate a unique URL to save and share the code. In addition, Jsfiddle also comes with embedded features. It's an excellent platform to try and share JS code without a website.

6. Dabblet

Dabblet is an interactive playground for quickly testing CSS and HTML snippets. It uses-prefix-free and does not have to add any prefixes in your CSS code. You can save your work on GitHub gist, embed it on other sites, and share it with others. It currently only supports modern versions of Chrome,safari and Firefox. All published code belongs to the publisher and there is no mandatory license. Dabblet itself is open source software, released under the NPOSL-3.0 license.

7. Editr

Editr is a set of html,css and JavaScript playgrounds that you can host on your own server. It is an ace-based editor. It's super easy to install. It supports multiple instances of a page. Can be configured by JS object or HTML attribute. EDITR supports 3 visual layouts: horizontal, vertical and single. The first two are for online editing. The third one is for demonstration purposes. Editr is based on the MIT License.

8. Livewave

Liveweave is a playground for HTML5, CSS3, JavaScript, and a real-time editor for web designers and developers. It's a great tool for testing, practicing, and sharing results! The panel size is adjustable, allowing you to write (or weave, as we call it, the name) code. Liveweave also has built-in code hints for HTML5 and CSS3 tag/attribute context sensitive, making life easier.

9. D3 Playground

D3.js is designed to enable you to interactively use the D3.js library. Every edit (producing a valid code) will affect the d3.js playground in real time. Because CSS is an important part of visualization, you can also edit CSS online.

Ten. HTML5 Playground

HTML5 's playground includes a code base that can look at the HTML5 action. They include some basic boot routines, such as HTML5 doctype and audio tags (still good demos that are compatible with the playback features in the browser). has an interactive table that contains HTML5 elements, such as range, date input, and automatic validation for e-mail addresses and websites.

More third-party services, service evaluation package download, source download, in Devstore.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.