You may remember in the past article we have introduced our collection of front-end developers essential tools, scripts and resources, in today's article, we will continue to recommend a group of our carefully selected Web development design of the necessary online tool application. I believe in the Web development and design process to bring you convenience and quick!
Front-End development related
Jsfiddle
Jsfiddle is a veteran online debugging and sharing code site that helps you debug javascript/css/html code online and easily be posted to communities, forums, or social media to share or ask questions with friends. There are many different classes of libraries to choose from. Similar tools and jsbin.com are also very good. More tools Please refer to our previous articles.
Codepen
Codepen is also a place to help you debug and share your front-end code online, unlike Jsfiddle, which is more like a community where you can see the latest user-added online demos or code, and can be more easily shared with other sites or fork. Compared with Jsfiddle, it is more like a platform to help show the front-end effect. If you often patronize, can find a lot of good front-end effects, including HTML5,JS,CSS3 and so on. Quite good, recommend to everyone!
Gbdebug
Gbdebug is the integrated front-end debugging tool in the GB tag community that was originally developed to help friends with the Community ask questions or to show the effects of jquery code, and if you use Jsfiddle, you'll be very familiar with it. The most powerful is the integration with the GB community content, you can share the development of the front-end display, templates or tutorials, and use Gbdebug to add "online debugging", more convenient for everyone to read and debug online.
Refiddle+
If you're a regular form enthusiast, this online tool is certainly one of your necessary tools, Refiddle+ can help you debug the online regular form, you only need to input data and corresponding regular expression, you can see the highlight of the results, is not very intuitive and simple, I'm sure you'll like it!
Rubyfiddle
If your development language is Ruby, you may already know the online tool rubyfiddle, and using this online tool can help you debug Ruby code online, a bit like Jsfiddle and Codepen, just a ruby version of the code. You just need to paste the Ruby code and click the "RUN" button to even support the input of vim or Emacs Oh!
CSS3 Generator
This CSS3 code generator is not quite the same as a generic CSS3 code generation tool that uses parallax scrolling to present content and provides custom options to dynamically generate the CSS3 code you need. Super cool and Super style!
HTML5 please
This site in the previous related articles also introduced, if you need to know how to correctly use HTML5 related technology, it is best to carefully look at this tool site, quite practical!
front-end performance optimization Tools
DOM Monster
When we develop Web applications, performance is a problem that can never be avoided. In fact, the performance of the DOM debugging is also an indispensable process. Using DOM monster you only need to add to your "bookmarks" and click on any page that needs to be debugged to help you list the performance issues that appear on your current page. is not very convenient!
Zbugs
Zbugs looks like a bug-related tool, but it's an online tool that quickly helps you compress css/javascript, you just have to provide a link to your site, download the relevant files, and upload them to your site!
other types of tools
Builtwith
Buildwith is a help to understand the Web site using technology online tools, you simply enter the site you want to test the address, it will give you the site to generate the use of the front and back technology and RELATED links, I believe that if you are a hacker, this tool is essential: D