This repository is made to document various tools that I use to support productivity in writing code.
For text editors, I use Visual Studio Code or vscode. Here are some reasons why using visual studio code.
- Free and open source!
- There are many plugins that are always updated.
- There are many themes and are very light!
Download here: https://code.visualstudio.com/ Github link: https://github.com/Microsoft/vscode
I myself focus on web-based programming. Here are some cool plugins that I usually use.
Ever made static templates only html and css? usually so that the road can be placed in the htdocs
apache folder right? Now this Live Server plugins are used to run the html and css files through the project folder by creating a new local server. By default it will make the server on localhost:5050
.
Install plugins:
ext install ritwickdey.LiveServer
Bored with the icon of the vscode project folder? try Material Icon Theme so that your file icon and folder become more colorful and nice!
Install plugins:
ext install PKief.material-icon-theme
If the previous one changes the icon to make it more interesting, now this makes your editor more interesting and comfortable during the coding process. There are several themes that can be selected starting from the dark to the high. I really recommend it.
Install plugins:
ext install Equinusocio.vsc-material-theme
The role of git in the development process software is like rice with side dishes! it's really important to be more enjoyable: D Now if you use this GitLens plugins, the project versioning process becomes even easier and much more productive. My favorite feature is, the popup feature about information about who is committed? Which logs? When?
Install plugins:
ext install eamodio.gitlens
In this modern and fast-paced era, various snippets for certain programming languages are needed so that the coding process becomes faster and more efficient. So it's perfect for you to install code snippets in the text editor. Here are some of the snippets that I use.
- ES7 React/Redux/GraphQL/React-Native => for user react =>
ext install dsznajder.es7-react-js-snippets
- Vetur => for VueJS users =>
ext install octref.vetur
- Javascript (ES6) Code Snippets => for JS users =>
ext install xabikos.JavaScriptSnippets
And so on, you can find yourself in the market place according to the programming language used.
Language Support is almost similar to Code Snippets, usually one package. So some recent languages such as stylus
, go
, solidityit
is not supported by default, it is necessary in order to install itself as well as syntax highlighting snippet can appear in a text editor.
If I used to use PHPStrorm and WebStorm and get used to the shortcuts on the product jet brains. Now, instead of learning more about the shortcuts in vscode, I just install the keybindings. So vscode feels like PHPStorm or WebStorm: D
Install plugins:
ext install k--kato.intellij-idea-keybindings
For me, the selection of fonts in the code is very important, especially those who can support various things such as arrows and special characters. So that the fonts are cool, I recommend using Fira Code.
How to install it can be seen at https://github.com/tonsky/FiraCode
I recommend using Google Chrome or Mozilla Firefox Developer Edition. Because both browsers have Dev Tools that are very complete. Good debugging and so on.
- Google Chrome => https://www.google.com/chrome/
- Firefox Quantum Developer Edition => https://www.mozilla.org/en-US/firefox/developer/
For browser extensions, I use some cool tools including:
- Wappalyzer => for what stack analysis is used by the opened website. => https://www.wappalyzer.com/
- JSON Viewer => to view formatted JSON data through a browser => https://chrome.google.com/webstore/detail/json-viewer/gbmdgpbipfallnflgajpaliibnhdgobh
- React Developer Tools => to see the state of the process when developing the web with the React framework => https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi
- Redux Devtools => to see the managent state during the developent process using redux => https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd
- Vue Devtools => vue programmer must have! => https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd
- Google Translate => can translate directly when selecting text in the browser (don't have to open translate.google.com) https://chrome.google.com/webstore/detail/google-translate/aapbdbdomjkkjkaonfhkkikfgjllcleb
- Google Calendar => Check schedules, events and so on directly from extension => https://chrome.google.com/webstore/detail/google-calendar/gmbgaklkmjakoegficnlkhebmhkjfich
- Adblock Plus => Block ads is not clear! => https://chrome.google.com/webstore/detail/adblock-plus/cfhdojbkjhnklbpkdaibdccddilifddb
- MetaMask => makes it easy to inject web3 for development Ethereum Network => https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn
- Search by Duckduckgo! => https://duckduckgo.com/?q=indra+kusuma&atb=v133-1_i&ia=web
- Mozilla Developer Network => https://developer.mozilla.org/en-US/
- W3Schools => https://www.w3schools.com/
- Freecodecamp => http://freecodecamp.org
- berbagai official web documentation
Contributors English Language