[{"slug":"phineas-in-css","frontmatter":{"content":"\nRecently I stumbled upon [this](https://twitter.com/prathkum/status/1345285253632569344) guy on Twitter and started following him. He explains CSS so well and keeps sharing his CSS Art. I have always been fascinated by how people are able to build beautiful things just using CSS. But I have been solely involved with working in JavaScript writing libraries in the past few years which involved negligible CSS.\n\nWith a lot of time in my hands now, I thought of working on one such art just to understand what is behind that magic :)\n\nI picked [this](https://twitter.com/prathkum/status/1345285253632569344) piece from Pratham's twitter and started working on it. This was a an entirely different experience. You have to visualize how you can make use of Box Model in a creative way to make various shapes. This is like applying a lot of HACKS but you get beautiful results with that :)\n\n![Phineas%20in%20CSS%20e43438c5beb649db977e2cd71b14adfd/Screenshot_2021-06-14_at_5.44.27_PM.png](/notion/Phineas%20in%20CSS%20e43438c5beb649db977e2cd71b14adfd/Screenshot_2021-06-14_at_5.44.27_PM.png)\n\n### [Here](https://codepen.io/hariom_balhara/pen/oNZQQpB) is the ***codepen*** for Phineas.","data":{"category":"css-art, show-and-tell","creationTs":1623672540000,"date":"June 14, 2021 2:09 PM","lastModified":"September 9, 2021 3:10 PM","lastModifiedTs":1631193000000,"published":"Yes","socialImage":"https://hariombalhara.in/notion/7f9780460ee1ac10f3f5ec8cf8c8401600dc4b59.png","title":"Phineas in CSS"},"isEmpty":false,"excerpt":"","category":["css-art","show-and-tell"],"creationTs":1623672540000,"date":"June 14, 2021","lastModified":"September 9, 2021 3:10 PM","lastModifiedTs":1631193000000,"published":"Yes","socialImage":"https://hariombalhara.in/notion/7f9780460ee1ac10f3f5ec8cf8c8401600dc4b59.png","title":"Phineas in CSS","updated":"September 9, 2021"},"content":"

Recently I stumbled upon this guy on Twitter and started following him. He explains CSS so well and keeps sharing his CSS Art. I have always been fascinated by how people are able to build beautiful things just using CSS. But I have been solely involved with working in JavaScript writing libraries in the past few years which involved negligible CSS.

With a lot of time in my hands now, I thought of working on one such art just to understand what is behind that magic :)

I picked this piece from Pratham's twitter and started working on it. This was a an entirely different experience. You have to visualize how you can make use of Box Model in a creative way to make various shapes. This is like applying a lot of HACKS but you get beautiful results with that :)

$\"Phineas%20in%20CSS%20e43438c5beb649db977e2cd71b14adfd/Screenshot_2021-06-14_at_5.44.27_PM.png\"$

Here is the codepen for Phineas.

\n"},{"slug":"often-forget-to-install-types-of-a-nodejs-package","frontmatter":{"content":"\nHave you ever installed a NodeJs package in a TypeScript project and saw that you are not getting type safety for that package in your TypeScript files? \n\nYes, you would have seen this. The solution is that you would go and install the types of that package from the awesome [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped) repository.\n\nBut why do this additional step manually if you can do it automatically, so I introduce [TypeScript Types Supported Installer.](https://github.com/hariombalhara/tss-installer)","data":{"category":"show-and-tell","creationTs":1622551260000,"date":"June 1, 2021 2:41 PM","lastModified":"September 9, 2021 3:10 PM","lastModifiedTs":1631193000000,"published":"Yes","title":"Often forget to install types of a NodeJs package?"},"isEmpty":false,"excerpt":"","category":["show-and-tell"],"creationTs":1622551260000,"date":"June 1, 2021","lastModified":"September 9, 2021 3:10 PM","lastModifiedTs":1631193000000,"published":"Yes","title":"Often forget to install types of a NodeJs package?","updated":"September 9, 2021"},"content":"

Have you ever installed a NodeJs package in a TypeScript project and saw that you are not getting type safety for that package in your TypeScript files?

Yes, you would have seen this. The solution is that you would go and install the types of that package from the awesome DefinitelyTyped repository.

But why do this additional step manually if you can do it automatically, so I introduce TypeScript Types Supported Installer.

\n"}]

Category: show-and-tell