Thursday, July 4, 2019

Must Have Atom Packages



https://atom.io/packages/emmet-simplified
This is a fork of the emmet-atom package, and its main goal is to solve the keybinding conflicts with Atom itself that existed in the original package. The original package overwrote keybindings such as the ctrl + shift + M for toggling the Markdown preview, the ctrl + , for opening the Settings View, and tab for Atom's autocomplete

https://atom.io/packages/clipboard-plus
https://atom.io/packages/git-time-machine
http://philhosoft.github.io/Software/GitHub-Atom-review/
https://atom.io/packages/markdown-mindmap
Markdown Writer
    • code (cmd-')
    • bold (cmd-b)
    • italic (cmd-i)
    • strike through (cmd-h)
    • '''code block''' (shift-cmd-")
    • <kbd>key</kbd> (cmd + k)
    • - unordered list (shift-cmd-U)
    • 0. ordered list (shift-cmd-O)
    • > blockquote (shift-cmd->)
    • - [ ] task list (markdown-writer:toggle-task)

https://github.com/atom/bracket-matcher
Use ctrl-m to jump to the bracket matching the one adjacent to the cursor. It jumps to the nearest enclosing bracket when there's no adjacent bracket,
Use ctrl-cmd-m to select all the text inside the current brackets.
Use alt-cmd-. to close the current XML/HTML tag.

https://atom.io/packages/hyperclick
https://atom.io/packages/hyperlink-hyperclick
Open link in Atom
https://stackoverflow.com/questions/39391688/multi-line-editing-on-atom
2. RegEx Search & Replace
Search for ^(.*)$ and replace with "$1",.

https://atom.io/packages/change-case
A quick way to change the case of the current selection.
https://en.wikipedia.org/wiki/Snake_case
Snake case (or snake_case) is the practice of writing compound words or phrases in which the elements are separated with one underscore character (_) and no spaces, with each element's initial letter usually lowercased within the compound and the first letter either upper- or lowercase—as in "foo_bar" and "Hello_world". 

https://benmccormick.org/2017/05/29/atom-tips/

5. Check Timecop and clean up plugins that you’re not using

https://atom.io/packages/maximize-panes
maximize-panes:maximizecmd-shift-enter

https://github.com/santip/resize-panes

https://github.com/atom/atom/pull/7354

pane:enlargecmd-alt-=enlarge the current pane by 10%
panes:shrinkcmd-alt--shrink the current pane by 10%

https://atom.io/themes/unity-ui

An Atom theme for a more native experience on OS X

https://github.com/zhuochun/md-writer
Execute command Markdown Writer: Create Default keymaps to add the recommended keymaps
ctrl-alt-[1-5]switch among H1 to H5.
cmd-’code
cmd-bbold
cmd-iitalic
cmd-hstrike through
shift-cmd-"’‘’code block’’’
- unordered list(shift-cmd-U)
0. ordered list(shift-cmd-O)
https://gist.githubusercontent.com/0x1ad2/3dcc76bd77334753c9993f2be38ebac3/raw/05b0eac18ae85b9ae346c45b3c0e74ff287db808/packages.json
Package sync

Package sync lets you synchronize packages installed between computers. This comes in handy if you are working on different working environments.

https://atom.io/packages/package-sync
https://atom.io/packages/atom-package-sync
Synchronize packages, settings, keymaps, user styles, init script and snippets automatically across Atom instances. The code is based on the great sync-settings package.
  1. Login with your Google account (Github coming soon)

https://atom.io/packages/package-sync

https://medium.freecodecamp.org/atom-treasures-82a64ac391c
Emmet is a universal plugin (it works with many popular text editors) to write HTML and CSS in a more efficient way thanks to intelligent textual expansions.

https://medium.freecodecamp.org/atom-treasures-82a64ac391c

Highlight selected

Highlight selected allows you to highlight your selected words throughout the file that you are editing. You can use Ctrl-U or Cmd-U to multi selected the words
Sort lines
Sort your lines in alphabetic order
Double tag

Double tag allows you to edit both the start and end HTML tags at the same time. This is extremely useful when editing big files with a lot of HTML.
https://atom.io/packages/jumpy
  • Enter jump mode
    • shift + enter NOTE: This particular hotkey conflicts with the very awesome Hydrogen package. Please rebind jump mode to something else or override it for Jumpy (see below)
  • Reset first character entered
    • backspace
  • Cancel/exit jump mode (any)
    • shift + enter
    • enter
    • esc
    • space
https://blog.nukomeet.com/10-essential-plugins-for-atom-editor-7ff4803ecffc
Script (by Kyle Kelley) is a simple plugin to run the code from the current file as a whole, or via a selection. It supports plenty of different languages out of the box.
https://atom.io/packages/script

Pigments (by Cédric Néhémie) is a simple plugin which scans source files in your project directories looking for colors and will build a palette with all of them. It supports most of the color transformations functions and expressions of the three biggest CSS pre-processors out there (LESS, Sass & Stylus).

Tern is a stand-alone code-analysis engine (created by Marijn Haverbeke, the author and maintainer of Eloquent JavaScript and CodeMirror) to improve JavaScript programmers’ productivity. It provides autocompletionfunction argument hintsjump-to-definition, and various automatic refactoring operations. Here’s Atom’s integration with Tern.

https://atom.io/packages/document-outline
Show a hierarchical outline of a text document

https://atom.io/packages/symbols-tree-view
https://atom.io/packages/atom-csv-markdown
https://atom.io/packages/markdown-table-editor
https://atom.io/packages/spell-check

http://timgthomas.com/2015/04/simple-file-tricks-with-atom/
You may have used Atom’s “rename” feature a time or two, but did you know you can also use it to move files, as well? When you open the “rename” palette, Atom displays the file’s full path (relative to the project root). Want to relocate the file? Simply change the path and hit return:

The next time you need to copy and paste a file, why not use Atom instead of your OS’s file explorer? Right-click a file, select “Duplicate”, and Atom prompts you for the file’s new name. Much like moving a file, just change the path to wherever you’d like to copy the new file, hit return, and presto!
- [linter](https://atom.io/packages/linter) [link](https://atomlinter.github.io/)
  * [jsonlint](https://atom.io/packages/linter-jsonlint)
https://hackernoon.com/making-atom-even-more-awesome-my-setup-e7a89969a876

Find previous: shift + enter in the search dialog
https://github.com/atom/find-and-replace/issues/453

https://atom.io/packages/split-diff
https://shd101wyy.github.io/markdown-preview-enhanced/#/presentation
--- presentation: width: 800 height: 600 --- <!-- slide -->

Apache Zeppelin (https://zeppelin.apache.org/docs/0.7.0/interpreter/markdown.html)
Jupyter (http://jupyter-notebook.readthedocs.io/en/stable/examples/Notebook/Working%20With%20Markdown%20Cells.html)

http://trevershick.github.io/atom/2015/12/04/plantuml-snippets.html
brew install graphviz
Installing the language-plantuml (plafue)
Installing the plantuml-preview Package

https://shd101wyy.github.io/markdown-preview-enhanced/#/diagrams?id=mermaid
  • You can install Graphviz (not required) to generate all diagram types.
  • Code block with puml or plantuml notation will be rendered by PlantUML.
https://mermaidjs.github.io/
https://atom.io/packages/atom-mermaid

https://shd101wyy.github.io/markdown-preview-enhanced/#/code-chunk
```bash {cmd=true} ls . ``` ```javascript {cmd="node"} const date = Date.now() console.log(date.toString()) ```

https://github.com/GitbookIO/gitbook

https://github.com/t9md/atom-vim-mode-plus/wiki/TIPS
In insert-mode, hitting escape to close autocomplete popup result in normal-mode, but want to remain in insert-mode.
By default escape always escape insert-mode regardless of autocomplete's popup.
To change default behavior of escape, set following keymap in your keymap.cson.
'atom-text-editor.vim-mode-plus.insert-mode.autocomplete-active':
  'escape': 'autocomplete-plus:cancel'
Or you can use different keymap to explicitly close autocomplete-plus's popup like bellow.
'atom-text-editor.vim-mode-plus.insert-mode.autocomplete-active':
  'ctrl-g': 'autocomplete-plus:cancel'
https://atom.io/packages/delete-whitelines
Just Select the text, use command palette (cmd + shift + P) > delete-whitelines:toggle or alt+shift+D(for MAC & windows) to remove empty lines within the selected text area.
https://discuss.atom.io/t/deleting-all-empty-lines/29358
Add this in your init.coffee file:
atom.commands.add 'atom-workspace', 'lines:delete-whitelines', ->
  buffer = atom.workspace.getActiveTextEditor().getBuffer()
  newLines = buffer.getLines().filter (line) -> line isnt ''
  buffer.setText newLines.join '\n'
atom.commands.add 'atom-workspace', 'lines:delete-whitelines-regex', -> buffer = atom.workspace.getActiveTextEditor().getBuffer() buffer.replace /\n\n/g, '\n'

https://github.com/atom/atom/issues/3429
It boils down to the fact that people want to control whether VCS ignored files are visible in the tree view separately from whether they are visible in other parts of the editor. For example, I may not want VCS ignored files to show up when I use the fuzzy finder or in Find in Projects, but I may want them to show up in the tree view so I know what files are actually in the folder.

https://atom.io/packages/teletype
An Atom package that lets developers share their workspace with team members and collaborate on code in real time.
https://discuss.atom.io/t/installed-packages-list-into-single-file/12227
apm list --installed --bare
apm uninstall PACKAGENAME
https://discuss.atom.io/t/project-search-does-not-index-files-in-gitignore/2804
You can change that behavior by editing your config file. Or by opening the settings view (cmd-,) and unchecking Exclude VCS Ignored Paths

https://github.com/atom/language-html/issues/9
install 'Emmet' package
shift+cmd+A to wrap in tag [http://docs.emmet.io/actions/wrap-with-abbreviation/]

https://atom.io/packages/atom-wrap-in-tag
Both atom-wrap-in-tag and atom-tag-wrapper work prefectly.

https://github.com/atom/settings-view/issues/394
Find should allow you to search within the Settings View #394
https://daijiang.name/en/2015/04/10/useful-atom-shortcuts/
  • atom-material-syntax # great syntax highlighting
  • atom-material-ui # great user interface
  • vim-mode # I like the vim mode of moving cursor
  • Zen # distraction free
I also like the multi-cursor feature from sublime text, which I feel is a must for me. Shortcuts within Atom:
  • ctrl-D if you select a world, then you hit ctrl-D and Atom will select next same word for you. Then you can either type directly (which will replace the old word) or use left or right arrow to append things.
  • ctrl-leftclick you can use this to select locations for multi-cursor wherever you want.
  • shift-alt-down or shift-alt-up to put multi-cursor at multiple lines. Or you can select multiple lines first, then selection -- split into lines (in Mac, you can use cmd-shift-L, sadly, for windows and linux so far, no similar shortcut for this [in sublime, we can use ctrl-shift-L].).

https://atom.io/packages/jumpy
An Atom package that creates dynamic hotkeys to jump around files and across visible panes.

https://www.sitepoint.com/12-favorite-atom-tips-and-shortcuts-to-improve-your-workflow/
Duplicate line
Cmd + Shift + D (Mac)
Select the next matching characters
Cmd + D (Mac)
Ctrl + D (Windows/Linux)
This command allows you to select the next matching word or characters to that which is highlighted. You can then (using the auto generated multiple cursors) delete, edit or update the highlighted values.

Select all matching characters

Cmd + Ctrl + G (Mac)
Alt + F3 (Windows/Linux)
https://benmccormick.org/2017/05/29/atom-tips/
Fuzzy finders have been a key feature on modern editors since TextMate first popularized the ⌘T command1 for searching through project files. ⌘T (or ⌘P) still works great in Atom, but what you may not know is that Atom provides 2 other versions of the command. ⌘B searches only among currently open files. ⇧⌘B searches only among files that are “dirty” according to git2. Both of those options are built in. You can also find other uses for the fuzzy-finder if you start exploring plugins, including atom-fuzzy-grep, a plugin that lets you use the fuzzy-finder interface to search file contents using grep, ack, ag, or ripgrep.

https://github.com/t9md/atom-vim-mode-plus/wiki/AdvancedTopicTutorial
  1. v i p.
  2. d to delete selected text.
  3. i to start insert-mode.
  4. Type abc then escape.
https://github.com/t9md/atom-vim-mode-plus/wiki/Commands#motion
better find mode
  # scroll
  'ctrl-f': 'vim-mode-plus:scroll-full-screen-down'
  'ctrl-b': 'vim-mode-plus:scroll-full-screen-up'

  'ctrl-d': 'vim-mode-plus:scroll-half-screen-down'
  'ctrl-u': 'vim-mode-plus:scroll-half-screen-up'

  'ctrl-e': 'vim-mode-plus:mini-scroll-down'
  'ctrl-y': 'vim-mode-plus:mini-scroll-up'

  'g 0': 'vim-mode-plus:move-to-beginning-of-screen-line'
  'g ^': 'vim-mode-plus:move-to-first-character-of-screen-line'
  'g $': 'vim-mode-plus:move-to-last-character-of-screen-line'
  'g altgraph $': 'vim-mode-plus:move-to-last-character-of-screen-line'

  '0': 'vim-mode-plus:move-to-beginning-of-line'
  '^': 'vim-mode-plus:move-to-first-character-of-line'
https://github.com/atom/find-and-replace/issues/149
Exclude file types or paths
!.git
!**/node_modules/**,!**/bower_components/**
!*.java

There is a “close window” shortcut, ⇧⌘W
https://discuss.atom.io/t/search-file-directory-pattern-not-working/16900

Where Atom accepts file globs, it uses the minimatch library 266. It looks like +(js|tests)/**/*.js might work.
https://flight-manual.atom.io/using-atom/sections/find-and-replace/
You can limit a search to a subset of the files in your project by entering a glob pattern into the "File/Directory pattern" text box. For example, the pattern src/*.js would restrict the search to javascript files in the src directory. The "globstar" pattern (**) can be used to match arbitrarily many subdirectories. For example, docs/**/*.md will match docs/a/foo.mddocs/a/b/foo.md, etc. You can enter multiple glob patterns separated by commas, which is useful for searching in multiple file types or subdirectories.
https://www.zhihu.com/question/39938370
- markdown-preview-plus@2.2.2
- markdown-assistant@0.1.0(Upload images from the clipboard automatically, win10 下失败,osx 完美成功,粘贴图片直接转成 md 文本,不要太棒,优雅的没朋友)
- qiniu-uploader@0.0.3
- markdown-writer@2.3.2(在设置里面设置一下,就拥有了正常 md 编辑器的编辑 md 的各种快捷键 例如 cmd + b, cmd + shift + k 插入链接,而且更棒非常值得一试)
- markdown-toc@0.4.1
https://atom.io/packages/markdown-writer
To use features such as create draft/post, Markdown-Writer needs to be configured to know the path to your blog.
Go to Settings (cmd-,) -> Packages -> markdown-writer -> Settings -> Set siteLocalDirand related.
https://atom.io/packages/language-log

print:
export-html works better, but only supports source windows (not the Markdown Preview or RST Plantdoc Preview).
Have you checked to see if print-atom131print-code108, or export-html89 accomplish what you desire?
https://blog.bugsnag.com/atom-editor-cheat-sheet/
ctrl + g Goto line
⌘ + r Goto symbol
https://gist.github.com/chrissimpkins/5bf5686bae86b8129bee
Find Matching Bracket⌃-m
Cut to End of Line⌃-k

Delete Line⌃-⇧-k
Go to Matching Bracket⌃-m
Convert to Upper Case⌘-k-u
Convert to Lower Case⌘-k-L

Deleting empty lines at end of text files


https://atom.io/docs/latest/
Command Palette + cmd-shift-P
cmd-O -> Open files

http://nuclide.io/docs/hack/

http://www.sitepoint.com/10-essential-atom-add-ons/
Highlight Selected
Open Recent
Pretty JSON
atom-beautify
xml-formatter
escape-utils
Set Syntax
http://hahack.com/codes/learn-react-native-for-android-01/
  • browser-plus:在 Atom 中内嵌一个浏览器窗口,方便页面调试(其实 Atom 本身就是一个浏览器);
  • minimap:如果你对 Sublime Text 的 minimap 念念不忘;
  • react:React 的语法补全和智能重排;
  • react-snippets:React 的代码段;
  • highlight-selected:高亮当前双击选中的标记;
  • jshint:检查 JavaScript 的语法,支持 JSX (需要在插件设置中开启 Support Linting JSX);
  • emmet:用 emmet (Zen Coding)方式快速编写页面;
  • vim mode
http://www.jeffjade.com/2016/03/03/2016-03-02-how-to-use-atom
  • Atom算是一款web app,源码都是 CoffeeScript 写的,连界面都可以用 CSS 来自定义,扩展可以用JS开发,完全可以深度定制打造自己的IDE。Sublime基于Python,两者扩展性都非常强。

代码片段

alt-shift-S 查看当前可用代码片段
~/.atom目录下snippets.cson文件中存放了你定制的snippets

Hit Cmd-Alt-O/Ctrl-Alt-O to open the file list to the directory of the current file. As you edit the path the file list will automatically show matching files and directories. Hit Tab to autocomplete the path.

Labels

Review (572) System Design (334) System Design - Review (198) Java (189) Coding (75) Interview-System Design (65) Interview (63) Book Notes (59) Coding - Review (59) to-do (45) Linux (43) Knowledge (39) Interview-Java (35) Knowledge - Review (32) Database (31) Design Patterns (31) Big Data (29) Product Architecture (28) MultiThread (27) Soft Skills (27) Concurrency (26) Cracking Code Interview (26) Miscs (25) Distributed (24) OOD Design (24) Google (23) Career (22) Interview - Review (21) Java - Code (21) Operating System (21) Interview Q&A (20) System Design - Practice (20) Tips (19) Algorithm (17) Company - Facebook (17) Security (17) How to Ace Interview (16) Brain Teaser (14) Linux - Shell (14) Redis (14) Testing (14) Tools (14) Code Quality (13) Search (13) Spark (13) Spring (13) Company - LinkedIn (12) How to (12) Interview-Database (12) Interview-Operating System (12) Solr (12) Architecture Principles (11) Resource (10) Amazon (9) Cache (9) Git (9) Interview - MultiThread (9) Scalability (9) Trouble Shooting (9) Web Dev (9) Architecture Model (8) Better Programmer (8) Cassandra (8) Company - Uber (8) Java67 (8) Math (8) OO Design principles (8) SOLID (8) Design (7) Interview Corner (7) JVM (7) Java Basics (7) Kafka (7) Mac (7) Machine Learning (7) NoSQL (7) C++ (6) Chrome (6) File System (6) Highscalability (6) How to Better (6) Network (6) Restful (6) CareerCup (5) Code Review (5) Hash (5) How to Interview (5) JDK Source Code (5) JavaScript (5) Leetcode (5) Must Known (5) Python (5)

Popular Posts