Code Monkey home page Code Monkey logo

recognizer's Introduction

Recognizer

Experimental implementation of semantic highlighting for JavaScript development.

Every color is based on real data flowing through the app, not just an abstract syntax. So if the last value of a variable was a number, it would be blue. If it was undefined, it would be red. This makes it easy to spot bugs.

Colors

Follow me on @equiet to get the latest updates.

How to install

From Brackets (recommended)

Go to Extension Manager in Brackets and look for recognizer.

From source

Clone this repository into Brackets' extensions/user/recognizer/ folder.

How to use

  1. Open a folder in Brackets (a project) with JavaScript files you want to debug.
  2. Double-click on the JavaScript files you want to instrument (so that they are in Working Files).
  3. Open Live Preview. You should now be able to inspect variables in JavaScript files.

Please note that Recognizer will create a new .recognizer folder in the project root. This is where all instrumented files are stored.

If you encounter any problems, more information might be available in the console (Debug -> Show Developer Tools).

Screenshot

Screenshot

Some ideas which are not yet fully implemented

Ideas

  • live editing
  • inline tests
  • code flow visualization
  • code documentation
  • flash changed value
  • execution timeline

recognizer's People

Contributors

equiet avatar

Watchers

Ben Garnett avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.