• There is NO official Otland's Discord server and NO official Otland's server list. The Otland's Staff does not manage any Discord server or server list. Moderators or administrator of any Discord server or server lists have NO connection to the Otland's Staff. Do not get scammed!

Brackets - open-source code editor

Zysen

=)
Joined
Sep 18, 2010
Messages
2,270
Reaction score
170
Location
Bosnia & Herzegovina
DZNXMQL.png



I thought I would take some time to write a thread to let you all know about a new code editor that I found a few months ago, I don't know exactly when the first build was released or how many of you actually know about it but their has been many threads asking for the best editor and I have never seen this mentioned. The software is created by Adobe, it is FREE, and it is Open Source. I know Adobe, Free, Open Source are words that don't go together often but it is true.

The code editor is written in HTML, CSS and JS compiled into a shell. You can edit the appearance of the editor via CSS and add your own additions with JS.

Some Features:

Live Preview
As you code CSS it automatically and instantly updates in the browser. If you change documents in the navigation of the editor it directs to the corresponding page in the browser and it also automatically refreshes the browser when you press save.

NNtKHAz.png


Inline / Quick Editing
This is a great feature that allows you to edit the CSS of elements without having to change documents / open a CSS file. If you have a HTML document set up correctly and have a stylesheet linked you can press "CTRL + E" when your cursor is on any HTML element, ie) a div, an input etc. This will open the corresponding css tag underneath in a box allowing you to edit that item.

O8x2kfF.png


Plugin Manager / Plugins
As any code editor should have it supports plugins which you can find in the link provided below, with a super fast and easy installation step. You simply get the zip link of GitHub and paste into the Plugin Installer on the editor, click install and it will be installed within a few seconds.

Wy6Q0IV.png


Color Preview
It shows a preview of colors when you hover over a HEX code.

SC3x2Gr.png


Project Management
In the left navigation pane you can open a specific folder onto the navigation, or numerous folder and then use whatever one you are working on by double clicking to bring into the Working Files

XxaMvCI.png


Overall Editor
Overall I don't even think you would need to edit the design as it already very attractive. It's also fast, and user friendly. Unlike notepad ++ this is very simple and not cluttered with tool bars. You have just what you need.

G7odIOS.png


Brackets also supports theme, you simple install then as an extension -
ZIP: https://github.com/MiguelCastillo/Brackets-Themes/archive/master.zip


(Don't click the link, copy the address and install via the extension manager)

yprK6u8.png



Video Preview

[video=youtube;rvo3Mv1Z4qU]http://www.youtube.com/watch?feature=player_embedded&v=rvo3Mv1Z4qU[/video]


Main website

Brackets

Download website

Brackets | Downloads

Extensions

https://github.com/adobe/brackets/wiki/Brackets-Extensions


 
Adobe? Free? Open Source?

What is this sorcery?
 
Back
Top