Ein Baum und seine Abenteuer



Extending Brackets

For some time now Brackets has been my Editor of choice for web projects.

For those of you who don't know it. It is a HTML5 based editor. Using it you develop with the web, for the web. Alongside many great features like quick edit for styles and just generally being awesome to code HTML, CSS and JavaScript the thing that makes me really love it is it's live preview that can show you in real time how your changes to your code will look. With the new 0.42 Version Brackets now supports Designs, or Themes if you want to call them that. Due to that I revisited my Plugins and thought I would share what I am using.

Extensions I use

HTML templates

Who want to type the skeleton of a HTML page every time he creates one? I for one do not. So this extension comes in very handy. It created the most needed tags for a projects and lets me jump right into it. Here is what a HTML file may look after using this extension:

<!doctype html>
<html>
<head>
 <meta charset="UTF-8">
 <title>Untitled Document</title>
</head>
<body>

</body>
</html>

Brackets Todo

I don't use this nearly as often as I could but it is a great tool. It enables you to type "TODO" somewhere in your code and will than generate you a list of things to do for the current file or project. Great to keep organized and a good place to start if you are not sure what to do next. There is surely something you still have to do.

File Icons

[caption id="" align="alignleft" width="159"]

Geöffnete Dateien in Brackets, mit File Icons Extension.[/caption]

This extension is just so awesome. I have no idea how I could life without this. A lot of times I find myself working with three files. One HTML, one CSS and one JS file. Taking a glance at the open files sometimes is not enough to see which is which and open the correct one. This extension however makes that way easier. It adds icons in front of the file names making it possible to see the file I want to jump to at a glance.

Code Overview

This extension provides Brackets with a feature I love about Sublime. You get a bar at the side of the editor which shows you an overview over your code. Useful to quickly find the part of your code you want to jump to.

Themes I use

With 0.42 Brackets introduced the possibility to use Themes. I currently am still playing around with two themes as well as the default dark one and am not sure which one I will choose just yet.

Monokai Dark Soda

This theme makes Brackets look like Sublime. On the one hand this is a theme I am used to especially since I still use Sublime for parts of the PHP work. On the other hand it brings strong colors and differences which at times can be a pain when working with HTML.

Mystique

This theme has less contrast than Monokai and is therefore easier on the eyes. but it comes with a way to display indentation that goes on my nerves.

Brackets Default Dark

The colors bring a bit more contrast and it does not have the weird indentation. Currently my favorite.

 

May this short list of mine inspire you as to what you might use.

Feel free to leave your favorites in the comments.

Author

Portrait picture of Hendrik

I am a JavaScript and GenAI Enthusiast; developer for the fun of it!
Here I write about webdev, technology, personal thoughts and anything I finds interesting.

More about me

Read next

Object-oriented JavaScript

Attention: This is kinda "old" and I personally now consider this to bad style so I won't make the effort to reformat this after moving from Wordpress to Hexo.

This Tutorial strives to enable you to build object oriented applications in JavaScript. Another goal of mine is to give you a deeper understanding of the language and principles at work. If you just want som code to copy-past and understand it while you got refer to section 7.

Dodge-JS

dodge-js logo
dodge-js logo

One thing I had to learn is called require.js, there will be a blog post about it soonish. To get that down I wrote a little game. I call it Dodge-JS. You are a little block and have to dodge falling blocks. Some kids really liked it so I also implemented a leader board. Give it a try. I am warning you though, you may get addicted.

Holiday greetings with GenAI

Festive Greetings - ChatGPT and Midjourney
Festive Greetings - ChatGPT and Midjourney

Happy Holidays and festive greetings, powered by ChatGPT, Midjourney and a little bit of Photoshop.

Utilizing my Custom GPT for Midjourney prompts (open source on GitHub), I generated the image and some subtle variations in three rounds. Finally touching it up with a tagline in Photopea.