Hacker Newsnew | past | comments | ask | show | jobs | submit | ryanhefner's commentslogin

Hi, Pkg Stats is a little tool that evolved from a quick day project that I threw together to help me monitor the downloads of my published packages. I wanted a way to easily scan how my packages were being used, and help me prioritize which of them I should focus on.

It was also an example project to help get my feet wet with Next.js + React for a client project that was on the horizon, so I decided to expand on it and make it more like a real project with various types of routing and endpoints.

The weird thing is, it’s now become my defacto way to search and browse packages while I’m working on projects since the data is condensed and surfaces more information, I can quickly see how popular and maintained a package is. I hope you find it as useful as I have.


Nice! I actually just released a Chrome extension that makes it really easy to render a grid–that includes a baseline grid–over any site. I hope others find this as useful as I have.

https://chrome.google.com/webstore/detail/grids-by-color-set...


Thanks, that's actually quite useful for the layout stuff I'm trying to do on a personal project right now :)


I’ve always loved this concept. I made this back in the day, kind of relevant. https://www.launchclock.co


If you happen to have a product video in your site that has been formatted for a specific phone, you can make sure the container of the video is set as the same aspect ratio of the phone.

I also see the CSS as an add-on, the devices for me are more for reference, but I have used the CSS here and there for some of the Apple phones.



Thanks! Yeah, definitely going to be adding more devices and common resolutions.


Exactly.


Thanks. Yeah, not really a "web service", just a reference tool, along with an NPM module you can use.

Also, I’ll be extending the device/resolutions listing, so hopefully it can be a handy reference for designers/developers.


The upvote was for `sd8dgf8ds8g8dsg`

> just a reference tool, along with an NPM module you can use.

Why does ~6 lines of basic logic need an NPM module?


Yeah, probably doesn't. I just found myself using it across a couple different projects and seemed like it would be easier than having to copy and paste it everywhere.

Also, it has a command line tool that you can use to get the aspect ratio from width/height. So, not just the code.


Yeah, that was the intention. Good to use for placeholder styling until the image/video has loaded. And for things like responsive embeds/iframes.


Maybe add an "about" or "how do I use it?" button with a panel, or a second page in case anybody is confused?


Yeah, I need to beef up the devices/resolutions listing. What device(s) have 1920x1200?


The maximum scaling option in macOS for 15" retina MacBook Pro's (all 15" retina models since 2012) is 1920x1200. So it's probably used quite a lot.

https://www.apple.com/macbook-pro/specs/

Select 15" and scroll to Display section.


Might be nifty to just match the list of devices in Chrome Inspector ..?



I just looked at Responsive Design Mode in Firefox Developer Tools and they also have a list of 16 devices with resolutions (Chrome has 29). There is a lot of overlap in the two lists, but using those would tie into a common tool we use to view sites on different devices.


My monitor, for example. Or do you only design for phones? I'm afraid I'll close your sites sight unseen if you do them that way.


My 2008 Dell Studio 15 laptop :)


I'll be sure to add that as I expand the listing of devices/resolutions.


Also, I thinking that it could be handy to maybe default to the resolution/aspect ratio of the device visiting the page. Would that be handy?


Yeah, I like this idea. It's kind of what I was expecting before I visited the page.


Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: