Summary -

In this topic, we described about the below sections -

Adobe bracket editor is an open-source code editor, lightweight software for front-end development and very useful to the web designers.

Brackets is written in HTML, CSS, and JavaScript.

Brackets have close-by features along with CSS code reference and HTML development.

Brackets allow us to see the live preview, that means the new changes incorporated in the code using the editor can immediately reflected on the browser without saving or reload the page.

Brackets editor is developed using front-end technologies and is highly extensible.

History –

Brackets have started as a text editor in the initial days of development. This text editor is designed for web development on edge code. However, it stopped the development of this text editor in November 2014. Later, it has transformed into the Adobe Brackets.

Adobe has MIT license and released the first version of text editor in 2014, that is adobe Brackets 1.0. Adobe declared that version 1.0 is not an experimental project anymore. It has full functionalities for front-end web development.

Adobe released many improved versions after the initial releases. PHP also supported in the latest update and run the PHP code using this editor.

The current version of adobe brackets is 1.14.2.

Why Brackets?

Brackets is a robust, lightweight, and advanced text editor with visual tools and editors combined to get the right amount of help without knowing a creative process.

Brackets is an open-source editor for web design and development, such as HTML, CSS, and JavaScript.

Brackets supports PHP coding with integration of PHP Servers XAMPP, WAMP, NAMP or any other local web server.

What is special about Brackets?

  • Optimised for Web Development - HTML, CSS and JavaScript.
  • Modification/Changes can reviewed immediately using Live Preview option.
  • Built with HTML, JS and CSS.

Brackets vs Edge code

Brackets Edge code
Adobe editor is an open-source editor consisting of different features like quick edit, split view, extension, themes, cross-platform, etc. Adobe edge code is a distribution of the Brackets project. Edge code can contain the functionality of brackets and additional like edge inspect and edge web fonts.
There is no automated update mechanism. There is an automated update mechanism that can be done by using a cloud desktop application.
Brackets already consist of browsing and installing extensions. Extensions must be manually installed into the edge code.
Brackets can adapt to new features fastly. Edge code can adapt to new features slowly.

Features -

Adobe brackets provides many features to personalize the brackets according to the developer’s choice or interest.

Brackets provide several numbers of features and they are -

  • Quick edit
  • Quick Docs
  • Live preview
  • Auto save
  • JSLint
  • Preprocessor support
  • Open source
  • Extension and themes
  • Clear interface
  • Split view
  • Cross platform
  • Autocomplete
  • Go to definition
  • Support documentation
  • Frequent updates and maintainability

Advantages -

  • It's open-source and free.
  • It's cost-efficient.
  • Easy coding.
  • Fast and easy setup.
  • Simple user interface.
  • Auto filling code and highlighting code.
  • Javascript auto minification.
  • Code auto-completion.
  • It provides real-time editing of HTML, CSS, and JS.
  • Live preview is the best feature of the Brackets. We can make changes to CSS and then see how it affects the page we're coding.
  • Switching between the tabs or pages quickly.
  • Extensibility (custom add-ons) is easy to configure. Many add-ons are available for code beautification, formatting, syntax checking.
  • It is relatively easy to create custom themes.
  • Multiple cursors. It is incredible to be able to insert various cursors and type the same thing in various places.
  • Code indenting with a hotkey (should enable the feature).
  • Had the ability to update the core program with extensions.
  • It is pretty fast and brilliant when working with front-end website files.
  • It is Cross-platform, so it is available for Macros, Windows, and Linux OS.
  • Image hover information. If we hover the mouse on an image link in the code, we get specific file information. i.e., image size and dimensions, etc., and as well as a preview.

Disadvantages -

  • Takes more time to startup and understand.
  • Sometimes 'live preview' automatically shuts down.
  • It is a javascript-based program. It can have some performance issues, significantly with larger files (too large, and it can't even open them).
  • Autosave option - Sometimes unwanted changes gets saved.
  • Since Brackets is open-source software, it is continuously improving. So if you feel it lacks something, it almost always appears in the following software release shortly after that.
  • Using extensions is at our own risk.
  • It isn't as powerful as some new competitors.
  • Unlike some other HTML5 text editors, Brackets requires installation, an overhead for users who can directly link from the website.
  • Some 'suggestions aren't robust.