# Free Resources for Developers and Designers

Well as a human, **I love free things** 😒. So, I have gathered some *free resources* that I've used over the years. And I want to share them with you all amazing people.

**To develop anything,** we first need a computer💻 and an internet🌎 connection. Then of course an operating system *(we all know linux is available totally for free).*

**Let's talk about the things that come after these:**

### Code editor:
1. [VS code](https://code.visualstudio.com)
2. [Sublime text editor](https://www.sublimetext.com/)
3. [Atom](https://atom.io/)

### Online code editors:
1. [Codepen](https://www.codepen.io)
2. [CodeSandbox](https://www.codesandbox.io)
3. [Stackblitz](https://www.stackblitz.com)
4. [Gitpod](http://gitpod.io/)
5. [Glitch](http://glitch.com/)
6. [Playcode.io](http://playcode.io/)

### Stock photos and videos:
1. [Pexels](https://www.pexels.com/)
2. [Unsplash](https://unsplash.com/)
3. [Pixabay](https://pixabay.com/)
4. [Mixkit](https://mixkit.co/)
5. [Coverr](https://coverr.co/)

### Vectors and illustrations:
1. [Freepik](https://www.freepik.com/)
2. [Undraw](https://undraw.co/illustrations)
3. [Vecteezy](https://www.vecteezy.com/)
4. [Openclipart](https://openclipart.org/)
5. [Vectorstock](https://www.vectorstock.com/)

### Fonts:
1. [Google fonts](https://fonts.google.com/)
2. [Fontspace](http://www.fontspace.com/)

### Icons:
1. [Font Awesome](https://fontawesome.com/)
2. [Material-ui icons](https://material-ui.com/components/material-icons/)
3. [Animated icons](https://icons8.com/animated-icons)
4. [Freepik](https://www.freepik.com/)

### Mockup tools:
1. [Figma](https://www.figma.com/)
2. [Zepllin](https://zeplin.io/)

### Design ideas:
1. [Awwwards](https://www.awwwards.com/)
2. [Dribbble](https://dribbble.com/)
3. [Webdesign Inspiration](https://www.webdesign-inspiration.com/)

### Browser extensions:
1. [Wappalyzer](https://www.wappalyzer.com/) - Look at website technology stack
2. [Colorzilla](https://www.colorzilla.com/) - Pick color from anysite and do color related stuffs
3. [CSS3 generator](https://css3generator.com/) - Allows you to generate CSS3 snippets
4. [Daily Dev](https://daily.dev/) - Developer news
5. [Gitpod](https://www.gitpod.io/) - Fork and edit any repo instantly

   
> Now its time to make our **website public**. But before that, we need:

### Compressor:
1. [Optimizilla](https://imagecompressor.com/)
2. [Tinypng](https://tinypng.com/)
3. [Code compressor](https://minifycode.com/)

### Hosting providers:
1. [Netlify](https://www.netlify.com/)
2. [Heroku](https://www.heroku.com/)
3. [Github pages](https://pages.github.com/)
4. [Vercel](https://vercel.com/)
5. [Surge](https://surge.sh/)
6. [Render](https://render.com/)
7. Cloudflare [pages](https://pages.cloudflare.com/) and [workers](https://workers.cloudflare.com/)
8. [Firebase hosting](https://firebase.com/hosting/)

I've covered free learning resources in this article: 

%[https://aashishpanthi.hashnode.dev/developers-resources-learn-for-free]

Thank you so much for sticking around. And here is a bonus for you: 
[More free dev resources](https://free-for.dev/#/?id=table-of-contents). 
And if you are a student then you can always apply for [Student developer pack](https://education.github.com/pack) by Github in collaborations with many other service providers.

[Here is more by Brad Travercy](https://gist.github.com/bradtraversy/61171a9b81586f5bc4c0ca1e2beb59ab) and [Path to free self-taught education in Computer Science](https://github.com/ossu/computer-science) by Open Source Society University.