---
title: 'How to clear global npx cache'
date: '2023-05-30'
slug: 'clear-global-npx-cache'
thumbnail: '/thumbnails/terminal.png'
tag: 'tools'
canonicalUrl: 'https://amanhimself.dev/blog/clear-global-npx-cache'
---

Recently, I've seen myself running into the following message whenever I'm using a certain CLI tool with `npx`.

```bash
A new version of "x-package" is available
You can update by running: npm install -g x-package
```

I don't want to install the CLI tool globally and go into the rabbit hole of maintaining it as a dependency.

One way I've found that works on macOS to clear the global `npx` cache:

```bash
rm -rf ~/.npm/_npx
```

This will clear the global `npx` cache and you'll be able to use the latest version of the CLI tool.

Also, you can add an alias to your `.zshrc` or `.bashrc` file to make it easier to run:

```bash
alias clearnpx="rm -rf ~/.npm/_npx"
```

If you've trouble finding where npm stores `npx` cache on your system, run the following command to find out the exact path to the `_npx` directory:

```bash
npm config get cache
```


How to clear global npx cache

---
title: 'Bypass CORS to fetch files when working with localhost'
date: '2023-05-24'
thumbnail: '/thumbnails/terminal.png'
slug: 'bypass-cors-when-working-with-localhost'
tag: 'tools'
canonicalUrl: 'https://amanhimself.dev/blog/bypass-cors-when-working-with-localhost/'
---

Sometime back I learned about [opening files or directories using the `open` command from the CLI on a Mac](/blog/how-to-open-any-folder-from-terminal-in-finder-on-mac/). It's simple yet effective.

Another use case that I've been using it for is to open the current project when in `localhost` in the browser and bypass the CORS policy to fetch files that are also available locally.

```shell
open -a "Google Chrome Canary"  --args --user-data-dir="/tmp/chrome_dev_test" --disable-web-security
```

The argument passed in the above command overrides the browser's default behavior.


Bypass CORS to fetch files when working with localhost

Setup Macbook M1 for Web and React Native development

---
title: 'Convert png to jpg using ffmpeg'
date: '2023-04-01'
slug: 'convert-png-to-jpg-using-ffmpeg'
thumbnail: '/thumbnails/terminal.png'
tag: 'tools'
canonicalUrl: 'https://amanhimself.dev/blog/convert-png-to-jpg-using-ffmpeg'
---

As a documentarian, I've used [ffmpeg](https://ffmpeg.org/) command-line tool for a while now. It is a powerful tool that can do a lot of things. At work, I use it to convert videos and images.

## Prerequisites

Install [`ffmpeg` using homebrew](https://formulae.brew.sh/formula/ffmpeg).

## Why use ffmpeg?

On macOS, Cleanshot X app by default captures the screenshot in **png** format. These files are large in file size and have a large resolution (not usually suitable for a web page).

## How to use ffmpeg to convert png to jpg?

A **jpg** can have a smaller file size and is preferred for web pages. To convert a **png** to **jpg** using ffmpeg, use the following command:

```shell
ffmpeg -i input.png -preset ultrafast output.jpg
```


Convert png to jpg using ffmpeg

---
title: 'Keep homebrew up to date'
date: '2023-04-01'
slug: 'keep-homebrew-up-to-date'
thumbnail: '/thumbnails/terminal.png'
tag: 'tools'
canonicalUrl: 'https://amanhimself.dev/blog/keep-homebrew-up-to-date'
---

I've been using [homebrew](https://brew.sh/) for as long as I can remember using macOS. I recently learned about cleaning up old and outdated files using the `brew cleanup` command.

Sometimes, I periodically upgrade packages that are installed using brew. Thus, I thought, why not add an alias such as below in my `.zshrc` file:

```shell
alias hbc="brew update && brew upgrade && brew cleanup"
```

This helps me to update and upgrade outdated packages, and clean up old files. Now, whenever I have to run all three tasks, I simply run `hbc` in the terminal.

Upgrading outdated packages periodically saves me from a situation when installing a new package, homebrew will upgrade all outdated packages first.


Keep homebrew up to date

---
title: 'Open any folder from the Terminal app in a Finder on macOS'
date: '2022-07-21'
thumbnail: '/thumbnails/terminal.png'
slug: 'how-to-open-any-folder-from-terminal-in-finder-on-mac'
tag: 'tools'
canonicalUrl: 'https://amanhimself.dev/blog/how-to-open-any-folder-from-terminal-in-finder-on-mac/'
---

Often, I struggle or want to open the current directory I am working from the Terminal app to the Finder window on macOS.

I have been a macOS user for almost eight years now, and it never occurred to me that I couldn't open the current location from the Terminal app. Until recently, a frustration point led me to find the solution. Again, though, I am surprised by its simplicity.

To open the current working directory in the Finder window, use the following command:

```shell
open .
```

The `open` command opens a file or a folder. It exists on the macOS.

You can do more with this command. The `/` argument opens the root directory.

```shell
open /
```

A specific directory is also allowed:

```shell
open ~/Desktop
```

Using the option `R`, you can locate a specific file or folder in the Finder:

```shell
open -R /blog
```

## Opening files

There are more things that the `open` command can do. It can open files. For example, to open a markdown file in the default editor or IDE:

```shell
open ./blog/mm-yy/your-file-name.md
```

The above command opens the markdown file in the Xcode. You can pass the `-t` option to open in the file in a text editor.

```shell
open -t ./blog/mm-yy/your-file-name.md
```

## Opening URLs

It can do more than open files and folders. It can also open a URL in the default web browser set up on your machine:

Use option `a` to override the default web browser and specify a different one.

```shell
open -a Safari https://www.google.com
```


Open any folder from the Terminal app in a Finder on macOS

---
title: 'Using Bower With Heroku'
date: '2016-12-29'
thumbnail: '/thumbnails/heroku.png'
slug: 'using-bower-with-heroku'
tag: 'tools'
canonicalUrl: 'https://hackernoon.com/using-bower-with-heroku-cdc791320c88'
---

> [Originally Published at Hackernoon.com](https://hackernoon.com/using-bower-with-heroku-cdc791320c88)

Yes, I use [Bower](http://bower.io) to maintain front-end dependencies, mostly for my side projects. Whatever you say, Bower is good and I am too anxious to mess with npm dependencies for front-end development. Plus, I feel that maintaining front-end dependencies with Bower helps in keeping my application’s skeleton clean.

So for last two of my projects, I have been using [Heroku](http://heroku.com) for deployment. Since I am maintaining front-end dependencies using Bower, I went through [_this article_](https://devcenter.heroku.com/articles/buildpacks) which is about generating buildpacks on Heroku. I find generating buildpacks adds unnecessary complexity in the process of application deployment, at least for _rapid prototyping_. Thus, I choose a different path. Adding Bower as an npm dependency seems an easy process and doesn’t add any kind of complexity. I find it’s great only if you are using Bower for rapid prototyping JavaScript applications.

After you are done with building your application, all you have to do is add `Bower` as an npm dependency in `package.json` file and then add a script under `npm scripts` to execute a command that will install bower dependencies before the application is deployed on Heroku.

Bower as dependency in `package.json` :

```json
"dependencies": {
     "bower": "1.8.0"
}
```

And then add a`postinstall` command in `npm scripts` :

```json
"scripts": {
    "postinstall": "./node\_modules/bower/bin/bower install"
}
```

You can read more about customizing [**Heroku Build Process here**](https://devcenter.heroku.com/articles/nodejs-support#customizing-the-build-process)**.**


Using Bower With Heroku

---
title: 'ATOM- An Editor of 21st Century'
date: '2016-07-14'
thumbnail: '/thumbnails/atom.png'
slug: 'atom-an-editor-of-21st-century'
tag: 'tools'
canonicalUrl: 'https://amanhimself.dev/blog/atom-an-editor-of-21st-century'
---

The [Atom](http://atom.io/) I am talking about is not a small particle in the world of developers. Built and maintained by Github and the community, it is more than just an editor.

In our world, in the world of developers, an editor plays an amount of significant role when it comes to writing code. They might seem just a tool, as a matter of fact, they are, but for someone who takes pleasure in writing code, it is an essential piece in their setup.

Using an editor is really a matter of choice, your comfort zone but the game of plugins have a big role to play. As yourself, I have tried my hands on different editors & IDEs and for now I have decide to settle with Atom for its enormous amount of plugins available. Another reason for me is that it’s written in JavaScript (exactly CoffeScript & since I am a JS enthusiast) and is completely free to use because of its open source normality.

It is inspiring to open-source community as well. Few months back, Facebook released there version called Nuclide which focus more on mobile development. Then there is Electron for building cross-platform desktop application. Both are based on Atom Shell.

Atom is mature in terms of plugins when comes to keeping the pace with newer technologies. When I started out with Node.js, I tried to stick with Webstorm IDE but soon Atom lured me for its support of frameworks like Ionic (a plugin called Ionic-Preview and I am still exploring) thanks to the community plugins and the other matter of fact that it’s open source.

![1](https://i.imgur.com/a5Ziwot.jpg)

## Packages

There are more than 4.5k +packages published already. To view, Open the Settings view by clicking Packages > Settings View > Open in the menu bar or by using the (cmd + ,) keyboard shortcut.

Atom Packages are categorized further into:

- Community packages: Packages written by people outside of GitHub’s Atom team.
- Core packages: These are developed by the Atom team and come bundled with Atom but you can disable them if they are no use to you.
- Development packages: Packages which you have on your machine and use in Atom from that local source.

Core Packages do provide support for most favorable programming/scripting languages but if you are using something out of the box then you must check the Community packages. Chances of finding the one are in your favour there.

If you are still unable to find what you are looking, you should try developing a package for yourself and then if you like share it with the community.

## TIP- Decreasing Startup Time

There may come a period of time when your Atom might behave sluggishly. What will you do?

- You’ll remove all the packages (a.k.a plugins) you don’t use but for some reason you had them installed,
- or there isn’t much use of that particular package and you can do without it,
- or it was there just for fun. But before removing the packages, one must know which package is consuming how much startup time. You might want some of those unnecessary packages to stay with you if you know they are not the real culprits who are slowing down your development environment.

![2](https://i.imgur.com/HEqlVPv.png)

I have seen (mostly on online forums) some developers groan about this kind of sluggishness but I haven’t met it yet.

**Recommended Packages**

Most of these packages are helpful in my daily JavaScript coding environment. I think they will be helpful to you too.

- open-recent (to continue where you left)
- sync-settings (do you work more than one machine? This for you)
- Ionic-Preview (for people who are working Ionic Framework)
- terminal-plus (terminal inside atom)
- atom-jade (there is support for ejs, handlebars, mustache too)
- jade (if you are into jade, this is a snippets package)
- js-hyperclick (as your project goes bigger, you will get addicted to it)
- atom-lupa (nice one if your daily musings includes React)
- autocomplete-modules (Node.js devs: autocompletes require statements)
- atom-pair (developed by the guys at Pusher, a must if you do pair coding)
- javascript-snippets (JavaScript and Node.js snippets)
- atom-nodejs-snippets (this is another Nodejs & JavaScript snippet package, made by me. Supports ES6 syntax)
- linter + linter-jshint
- atom-ternjs (JavaScript code intelligence for Atom)
- encourage (a nice one to have, if you are having a dark day, fun)

The main advantage of an editor like Atom is that you can highly customize it. You can hack it, make your own packages, or use the one that are already there in the community and bend them as per your needs.

## Lastly

![3](https://i.imgur.com/HIgoDE2.jpg)

_Note: At the time of writing this post, Webstorm IDE did not have support for frameworks like Ionic and the latest Atom Version is 1.8.0._


🔥 8 Posts filtered by tag "tools"