Posted in apps
4189
11:35 pm, October 13, 2020
 

My Favourite Atom Packages (Plugins) 2020

I did a list for this last year, updating it again for this year, i will add and remove packages as i change them. This is just my personal preferences for atom as i usually code in js css html and php with a small amount of aspx. Listed in no particular Order.

I kept loosing packages when i reinstalled atom until i found the package sync-settings, you can add a gist to your github account and link the package there where it will keep a backup of all of your atom settings incase you want to restore it on another pc or re-install which is nice. 

You can also browse through all the packages and sort them by downloads if you want to see the most installed ones.

sync-settings

very useful for syncing your settings and plugins and even themes between different atoms, keeps a copy in a git gist for easy linking in all

atom-html-preview

you can preview a html file you are editing, it loads it in another pane so when you update the html file and save it it auto reloads the preview very handy!

Access it with: CTRL+SHIFT+H

ftp-remote-edit

Edit remotely files on your ftp/sftp(ssh) server without a project. All your connection information will be encrypted.

Very useful for directly editing files on ftp servers directly into atom.

atom-beautify

Beautify HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, Coldfusion, SQL, and more in Atom.

Makes your code much more Beautiful!

autoclose-html

Automates closing of HTML Tags

file-icons

Assign file extension icons and colours for improved visual grepping

highlight-selected

Highlights the current word selected when double clicking

pigments

A package to display colors in project and files.

This one detects hex codes or rgb(a) codes and adds the colour to them good addition to the next colour picker plugin. 

It show the colours inline like the following example:

color-picker

Right click or press CMD-SHIFT-C/CTRL-ALT-C to open it.

Loads a colour picker from the editor, just highlight the colour and press the above key combo to load it saves loading into gimp or chrome and using that colour picker. 

Save Workspace

not yet tested this one, but thought it might be good as when starting up atom, it takes a few minutes to get back to where you were before.

https://atom.io/packages/save-workspace

 

View Statistics
This Week
104
This Month
384
This Year
481

No Items Found.

Add Comment
Type in a Nick Name here
 
Search Articles
Search Articles by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code here, mostly for my reference. Also if i find a good link, i usually add it here and then forget about it. more...

Subscribe to weekly updates about things i have added to the site or thought interesting during the last week.

You could also follow me on twitter or not... does anyone even use twitter anymore?

If you found something useful or like my work, you can buy me a coffee here. Mmm Coffee. ☕

❤️👩‍💻🎮

🪦 2000 - 16 Oct 2022 - Boots
Random Quote
In this case my anchor this week becomes driving almost 2hrs outside of Atlanta to one of my favorite hard core gyms in the world.. MetroFlex aka The Dungeon. The gym owners turn the heat way up so it becomes a fun sweat box and the gym members just watch from afar and leave me alone. I happily drive myself long distances to find MY ANCHOR. Our anchor allows us to have balance, focus and be as productive as possible. And if you're in the middle of a heavy set and your headphones start to fall off your head, like mine did here.. well.. f*ck the headphones. Let em break and fall. You can always get a new pair, but the iron ain't ever gonna lift itself.
Unknown
Random CSS Property

@media

The @media CSS at-rule can be used to apply part of a style sheet based on the result of one or more media queries. With it, you specify a media query and a block of CSS to apply to the document if and only if the media query matches the device on which the content is being used.
@media css reference