You're web front-end developer, front-end engineer, you want to find best IDE to develop front-end design, I can introduce you to one tool for do it easy :), That's Brackets
What's Brackets?
Explore My Other Channel for More Cool and Valuable Insights
👉 Youtube Learn Tech Tips👉 Tiktok
👉 Facebook:Features of Brackets:
Live HTML - Live CSS
Get a real-time connection to your browser. Make changes to CSS and HTML and you'll instantly see those changes on screen. Also see where your CSS selector is being applied in the browser by simply putting your cursor on it. It's the power of a code editor with the convenience of in-browser dev tools.
Instead of jumping between file tabs, Brackets lets you open a window into the code you care about most. Want to work on the CSS that applies to a specific ID? Put your mouse cursor on that ID, push Command / Ctrl+E and Brackets will show you all the CSS selectors with that ID in an inline window so you can work on your code side-by-side without any popups.
Quick Edit - CSS
Use Ctrl + E command
Brackets extension:
Except for the above features, you can also install extension for Brackets
Below some best extension which I had known
1. Brackets SASS – Support enable Live Preview and compile SASS files within Brackets
2. Beautify – Beautify HTML, CSS, and Javascript in Adobe Brackets
3. Brackets CSS Color Preview – css color preview extension for Brackets - Mặc định các mã màu sử dụng trong Brackets sẽ hiển thị khi rê chuột vào mã màu, nhưng với extension này bạn có thể biết được màu chính xác mà không cần rê chuột vào.
4. Brackets File Icons – File icons in Brackets editor's file tree - Hiển thị icon đại diện cho các tập tin ở cây thư mục bên trái.
5. Brackets Code Folding – Code folding extension for brackets IDE - Hỗ trợ tạo nếp gấp cho các block code để hiển thị gọn hơn.
6. Brackets FixMyJS – Brackets extension for FixMyJS - Tự động sửa các cảnh báo Javascript trong JSLint.
7. Brackets Grunt – Extension that lists and runs Grunt tasks inside Brackets - Hiển thị danh sách các task trong Grunt của dự án trong code editor để tiện sử dụng.
8. Brackets Gradient Editor – Brackets extension: Visually edit CSS gradients inline via Quick Edit - Sửa các dãi màu trong CSS nhanh hơn.
9. Brackets Bower – Bower integration in Brackets. - Cài các thành phần cần thiết cho dự án front-end với Bower trực tiếp trong Brackets. Hãy quên đi lệnh bower install <pack>
10. Brackets Git – brackets-git — git extension for adobe/brackets - Extension phải dùng nếu bạn đang dùng Git, nó sẽ quản lý lịch sử các lần commit, push, pull, theo dõi branch, tags,…rất trực quan.
11. Brackets Sidebar Plus – Terminal Emulator for Brackets test editoradding auto show/hide to sidebar - Thêm tuỳ chọn ẩn hiện sidebar của Brackets.
12. Brackets Terminal – Terminal Emulator for Brackets test editor - Sử dụng terminal ngay trong Brackets, terminal này là của Linux chứ không phải của riêng Brackets. Hữu dụng cho dân Linux.
13. Brackets FTP Sync-Plus – FTP/SFTP for Adobe Brackets - Gửi file lên FTP nhanh chóng.
14. Brackets WordPress Hint – WP Functions Hint - plugin for Brackets, which will help you in writing Wordpress Themes/Plugins - Tự động gợi ý các hàm trong WordPress, bao gồm các hàm trong plugin Woocommerce.
15. Brackets WordPress Hook Hint – Brackets WordPress Hooks Hints - Gợi ý các action và filter hook trong WordPress.
16. Brackets Emmet – Emmet plugin for Brackets editor - Viết HTML và CSS nhanh.
If you have any feedback or questions on Brackets , leave your comment, we can discuss about it!
Have a nice day!
Webzone tech tips Zidane
