Web Resources
Published: 2021-06-29 22:54:51




# List of Web Development Resources
*Actually this post was made like a reminder but if it helps, enjoy*


🌎 Plataform learnings
--

  

- [Codecademy](https://codecademy.com/learn)
- [JavascriptInfo](https://javascript.info)
- [MDN Web Docs](https://developer.mozilla.org/en-US/)
- [Codecademy](https://codecademy.com/learn)

Free Hosting Websites 
-----

### - Front End 
- [Netlify](https://netlify.com)
- [Github](https://pages.github.com)
- [Vercel](https://vercel.com/)
- [Oracle Apex](https://apex.oracle.com/es/)


### - Back End
- [Heroku](https://heroku.com)
- [Netlify](https://netlify.com)
- [Google Cloud](https://cloud.google.com/)
- [Oracle Apex](https://apex.oracle.com/es/)

###Database 
- [Mongo Atlas](https://www.mongodb.com/cloud/atlas)
- [Firebase](https://firebase.google.com/)
- [FaunaDb](https://fauna.com/)
- [Oracle OCI](https://www.oracle.com/ar/cloud/)



### - Others
- [AwardSpace](https://t.co/NRCaJJpUNa?amp=1)  
- [ByetHost](https://t.co/tbEurHFsj8?amp=1)  


Freelancing Sites 
--

- [Fiverr](https://fiverr.com)
- [Upwork](https://upwork.com)
- [Freelancer](https://freelancer.in)
- [Guru](https://guru.com)
- [People per Hour](https://peopleperhour.com)
- [Flexible](https://flexiple.com/?&url=136)

🧩 Chrome Extensions
---
- [Dimensions](https://chrome.google.com/webstore/detail/dimensions/baocaagndhipibgklemoalmkljaimfdj): this tool measures the dimensions from your mouse pointer up/down and left/right until it hits a border.
-  [CheckMyLinks](https://chrome.google.com/webstore/detail/check-my-links/ojkcdipcgfaekbeaelaapakgnjflfglf): a link checker that crawls through your webpage and looks for broken links.
- [LoremIpsumGenerator](https://chrome.google.com/webstore/detail/lorem-ipsum-generator-def/mcdcbjjoakogbcopinefncmkcamnfkdb):  provides an elegant and quick way to create default text or generate Lorem Ipsum
- [WindowsResizer](https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh/): Resize the browser window to emulate various screen resolutions.
- [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi): Adds React debugging tools to the Chrome Developer Tools

----
# Design Tools 
### 🎨Color Palletes
- [ColorHunt](https://colorhunt.co)
- [ColorSpace](mycolor.space)
-  [Colors](https://coolors.co)
- [Adobe Color](https://color.adobe.com/create/color-wheel)
- [Canva Color](https://www.canva.com/colors/color-palettes/)

### 📷 Pictures 
- [Unplash](https://unsplash.com/)
- [StockSnap](https://stocksnap.io/)
- [Pexels](https://www.pexels.com/es-es/)
- [FreeImages](https://www.freeimages.com/es)
- [Pixabay](https://pixabay.com/)

### 🖌 Illustrations

- [unDraw](https://undraw.co)
- [iconScout](https://iconscout.com/)
- [manyPixel](https://www.manypixels.co/gallery)
- [absurdDesign](https://absurd.design/)
- [Ilustrations](https://illlustrations.co/)
- [Icons8](https://icons8.com/illustrations)

### CSS ONLINE RESOURCES 😋
- [PixelArt to CSS](https://www.pixelartcss.com/): inlcudes animation, awesome tool!
- [ClipArt](https://bennettfeely.com/clippy/): Turns different shapes into css code

###  🖼 For backgrounds 
 - [Paaatterns](https://products.ls.graphics/paaatterns/)
 - [Cool backgrounds. io](https://coolbackgrounds.io/)
 - [Hero Patterns](https://www.heropatterns.com/)
 - [SVG backgrounds](https://www.svgbackgrounds.com/)  
 - [Trianglify](https://trianglify.io/)
 - [BGjar](https://bgjar.com/)  
  - [The Pattern Library](http://thepatternlibrary.com/)  
  - [Patternico](https://patternico.com/)  
 - [BG Pattern](https://bgpattern.com/)  
 - [BG Generator](https://bggenerator.com/)


... will keep updating this post as I progress in my dev-ux  journey...