DEV Community

Cover image for My favorite resources being a freelancer as a side hustle ๐Ÿ’Ž
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Posted on • Updated on

My favorite resources being a freelancer as a side hustle ๐Ÿ’Ž

I've read tons of resources collections.

So have you, I imagine.

This is why I am writing this, in the hopes it can actually help you with creating new quality stuff, quicker.

Because โ€˜betterโ€™ will always be a losing game for your brand.

You just need to be wiser while building, making more ๐Ÿ’ต , and spending less โณ on it as a consequence.

So no bullshit here ๐Ÿ’ฉ.

โœจ Let's go straight to the point โœจ

If you like any of this, react with ๐Ÿ’• and I will make more

๐Ÿ“ฆ Vercel

I can't recommend this enough. I also use Netlify, but changed to Vercel because the UI is slicker. It's free, you host your project in a few clicks, and it also gives you an SSL certificate, so you won't have the site not secured tag.

Vercel screenshot

or Tiiny.host if you're prototyping. No registration, just drag the folder and it gives you a link. Up for 3 days and then it's gone.

๐Ÿงช Hoverify

This is paid but worth it. Cheaper than other ones ($18) and amazing. I use the color picker and grid system all the time when building something or just scrolling through a website, to see how the divs are positioned.

Unflop screenshot

๐ŸŽ€ Csslayout.io

Never seen this one on other collections. Super good and fast code snippets for making layouts, navs, headers, etc. Shout-out to fellow Dev member phuocng who made this.

Css Layout screenshot

๐Ÿ”‘ NiceVeryNice

This site itself is a compilation of really good resources. What I use the most is their Components part, where I often go to when looking for reference. Need to build a hero? Go there and check hero examples. I use it with Hoverify.

Alt Text

๐Ÿงฒ Paatern.css

This is something I only superficially used but I like it. Background and background-image patterns to add complexity to your designs.

Paatern Screenshot

๐Ÿงท Tabler Icons

Of all the thousands of icon provider websites, this is my favorite. It's all SVG, color, size and thickness customizable.

Alt Text

๐Ÿ”‹ Tailwind CSS

Okay, this one is just because I love it. You probably already know it. Super easy building stuff with Tailwind. Its a utility-first, mobile-first CSS framework that's been ranking up on users recently. I share the hype.

Tailwind CSS screenshot

๐Ÿ”ฎ Design Systems Repo

A project repo that counts with a giant list of design systems, style guides, and pattern libraries. Sometimes I just scroll here to see if I want to try something out of my comfort zone.

Alt Text

๐ŸŽ Treact

This is GOLD. I built a fully responsive, beautiful React website with it, so I know its good. He also uses Tailwind.

Treact screenshot

๐Ÿš’ Tailblocks

By this point, you know I like Tailwind. I built a responsive personal portfolio in one hour with Tailblocks hosting it in Vercel. Very well structured and easy to use.

Alt Text

๐ŸŽฃ Open

Was a bit reluctant to put this one here, because it costs $49 and I never bought it. But I like the visuals and a friend of mine used it, so here it is.

Alt Text

โšพ๏ธ Web.dev

Always use this when finishing a website. It scores your SEO, accessibility, how fast it is, etc. Must check it out if you already didn't.

Web.dev screenshot

๐ŸŽจ Projector

I think this one is fairly new. I use this to create quick presentations for my clients. You don't have to, but it feels nice not to just send your client their website link.

Projector screenshot

๐Ÿงธ Public APIs

An amazing list of public APIs for using. This is huge and it's amazing how many different types of APIs there is to experiment with.

Public API screenshot

That's it, dear fellow members.

Please, if you liked any of this, react a bit with ๐Ÿ’• and I will make more.

Also, follow me on Twitter and let's hang out there ๐Ÿ“

Top comments (49)

Collapse
 
ckissi profile image
Csaba Kissi

Thank you, Leonardo, for mentioning my site (tablericons.com)

Collapse
 
leomjaques profile image
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Legend!

Collapse
 
madza profile image
Madza

Good job on it ๐Ÿ’ฏ๐Ÿ™‚

Collapse
 
ckissi profile image
Csaba Kissi

Thanks!

Collapse
 
henriquerulez profile image
Pedro Henrique

Hey Leonardo, thanks for sharing all those resources. I'm right now trying to enter on the Freelancer and my biggest pain is regarding deploying. Do you mind I reaching you out to ask a few questions? Living on the same city may help me quite a bit!

Thanks man!

Collapse
 
leomjaques profile image
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Hey my dude!! Of course not, letโ€™s chat. Dm me on twitter

Collapse
 
henriquerulez profile image
Pedro Henrique

Just followed you, hit me back so we can chat. Thanks man! @Henrique_Rulez

Collapse
 
astylidis profile image
Anargyros Stylidis

Should I use my personal Vercel account and host my client's websites there?
I am just starting with freelancing and I am trying to figure out how to do hosting.

I think Vercel is good because it also lets me buy domains and then continuously host through my github repo.

Collapse
 
raphaeldevs profile image
Raphael Corrรชa

up

Collapse
 
akdeberg profile image
Anik Khan

Dude that is awesome! Thanks especially for the API resource๐Ÿ˜ It's a killer. One resource page to rule them๐Ÿ˜Ž

Collapse
 
leomjaques profile image
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Its so cool when learning how to use it. You can actually pick something that interest you! Glad you like it :)

Collapse
 
akdeberg profile image
Anik Khan

That is so true man! ๐Ÿ˜€

Collapse
 
liloo2040 profile image
Elodie | DIY Developer

Thank you so much for these links and resources!

Collapse
 
leomjaques profile image
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

be sure to give them a try ๐Ÿ˜Š

Collapse
 
confusedcoder1 profile image
Shristi Singh

OMG this has me hooked!! Just so cool!!<3

Collapse
 
leomjaques profile image
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Glad you liked it!

Collapse
 
thomashighbaugh profile image
Thomas Leon Highbaugh

best list like this I have seen honestly. I actually learned some new things, have some new stuff to try out. Not click bait I have read 500x times, honestly thank you my dude.

Collapse
 
leomjaques profile image
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Nice, man! Feels good to read that. Hope you can build a lot of cool stuff in a more creative way with all of this :)

Collapse
 
wahidn profile image
WahidN

This is a great list! Thank you!

Collapse
 
leomjaques profile image
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Appreciate it! Be sure to hang out on twitter also โœจ

Collapse
 
ernestotrujillo profile image
Ernesto Trujillo

๐Ÿ™Œ๐Ÿผthanks a lot!

Collapse
 
murilomothsin profile image
Murilo Mothsin

Hey bro, nice to see your development in the coding world. I hope you keep sharing. Amazing work

Collapse
 
leomjaques profile image
leo ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Youโ€™re my inspiration โค๏ธ I hope we can work on something awesome later in the future ๐Ÿ”ฅ