Table of Contents

• 👩🏻‍💻 Code Editor
• 🛄 Coding Challenge Platforms
• 👻 Credit
• 🆎 Fonts
• 🛒 Free Domain Name
• 🎨 Free Illustration Design
• 🆓 Free Hosting
• 🛫 Freelancing Platforms
• 📷 Free Quality Photos
• 😎 Helpful Chrome Extensions
• 🔼 Icons
• 👨🏻‍🏫 Learning Platforms
• 🎙️ Podcasts
• 🏜️ Resources for CSS
• 🈴 Resources for JavaScript
• 🏢 Websites to find Remote Jobs
• 📚 Web-Dev Library
• ⛓️ YouTube Channels

Free Hosting:

• Amazon Web Services
• Byet Host
• Cloudflare Pages
• Deta
• Firebase
• Freehosting
• Github Pages
• Gitlab Pages
• Google Cloud
• Heroku
• Hostinger
• HyperPHP
• InfinityFree
• Netlify
• Render
• Surge
• Vercel
• Webhost
• W3 Spaces

Learning Platforms:

• http://freecodecamp.org/
• http://codecademy.com/
• http://javascript30.com/
• http://frontendmentor.io/
• http://testautomationu.applitools.com/
• http://coursera.org/
• http://khanacademy.org/
• http://sololearn.com/
• http://codedamn.com/
• https://frontendmasters.com/
• https://w3schools.com/
• https://htmldog.com/
• https://www.traversymedia.com/
• https://edx.org/
• https://wornoffkeys.com/
• https://webdevsimplified.com/
• https://theodinproject.com/
• https://fullstackopen.com/en/
• https://tutorial.djangogirls.org/
• https://www.educba.com/
• https://openclassrooms.com/
• https://www.programiz.com/
• https://javascript.info/
• https://www.geeksforgeeks.org/
• https://programminghub.io/
• https://www.tutorialspoint.com/
• https://www.javatpoint.com/
• https://www.guru99.com/
• https://fullstackui.com/
• https://www.tutorialsteacher.com/
• https://www.fireship.io/
• https://java5ript.com/
• https://pluralsight.com/

Youtube Channels:

• Traversy Media
• FreeCodeCamp
• The Net Ninja
• Google Chrome Developers
• The New Boston
• Derek Banas
• Academind
• LearnCode.academy
• codeSTACKR
• Web Dev Simplified
• Florin Pop
• Dev Ed
• Kevin Powell
• Fireship
• Filip
• Worn Off Keys
• Coder Coder
• James Q Quick
• DevTips
• Programming with Mosh
• JavaScript Mastery
• Catalin Pit
• Clever Programmer
• Sonny Sangha
• The Coding Train
• Codedamn
• Dapp University
• Adrian Twarog
• Hitesh Choudhary
• DesignCode
• DesignCourse
• The Coding Train
• Devon Crawford
• Aaron Jack
• Tech with Tim
• The Codeholic
• Eli the Computer Guy
• LevelUpTuts
• Apna College
• Coder Coder
• Bedimcode
• Edureka!
• Envato Tuts+
• Codemy.com

Podcasts:

• Syntax
• Fullstack radio
• The Changelog
• The Laracasts Snippet
• Front End Happy Hour
• JavaScript Jabber Archives
• Commit Your Code!
• Shop Talk
• Ladybug Podcast
• CodePen Radio
• JAMStack Radio
• Modern Web
• HTML All The Things
• The Vanilla JS Podcast
• Web Dev 101 - Front End, Back End, Full Stack
• Ladybug Podcast
• Compressedfm

Playgrounds:

• Codeanywhere
• Codepen
• CodeSandbox
• CodiLink
• DartPad
• Glitch
• Go Playground
• Google Colab
• JS Bin
• JSFiddle
• Kotlin Playground
• PlayCode
• Replit
• Rust Playground
• StackBlitz
• repit

Code Editors:

• Apache Netbeans
• Atom
• Brackets
• Bluefish
• Codespaces
• Emacs
• Espresso
• JetBrains WebStorm
• Notepad++
• Sublime Text
• Vim
• Visual Studio Code [VS Code]
• Komodo editor

Coding Challenge Platforms:

• http://codewars.com
• http://topcoder.com
• http://codingame.com
• http://hackerrank.com
• http://projecteuler.net
• http://coderbyte.com
• http://codechef.com
• http://exercism.io
• http://leetcode.com
• http://spoj.com
• https://codeforces.com
• https://open.kattis.com
• https://www.hackerearth.com
• https://practice.geeksforgeeks.org/

Freelancing platforms:

• http://toptal.com
• http://upwork.com
• http://freelancer.com
• http://peopleperhour.com
• http://simplyhired.com
• http://envato.com
• http://guru.com
• http://fiverr.com
• http://hireable.com
• http://6nomads.com
• https://www.indeed.com
• https://www.monster.com
• https://talent.hubstaff.com
• https://www.truelancer.com

List of websites to find remote jobs:

• http://flexjobs.com
• http://remote.co/remote-jobs
• http://justremote.co
• http://weworkremotely.com
• http://remoteok.io
• http://jobspresso.co
• http://europeremotely.com
• http://wfh.io
• https://hired.com/
• https://bergamot.io/
• https://arc.dev/
• https://www.virtualvocations.com/
• https://pangian.com/job-travel-remote/
• https://remotive.io/
• https://www.skipthedrive.com/
• https://angel.co/jobs
• https://yellowjobs.org

Free Quality Photos:

• http://unsplash.com
• http://pixabay.com
• http://pexels.com
• https://stocksnap.io
• https://freephotos.cc
• https://kaboompics.com
• https://www.istockphoto.com/

Free Illustration Design:

• http://undraw.co/illustrations
• http://drawkit.io
• http://icons8.com/ouch
• http://iradesign.io
• http://interfacer.xyz
• http://blush.design
• https://iconscout.com/illustration-pack/indian-doodle
• https://openpeeps.com
• https://app.streamlinehq.com/illustrations/milano
• https://growwwkit.com/illustrations/phonies/
• https://storyset.com/
• https://www.pixeltrue.com/
• https://www.manypixels.co/
• https://www.humaaans.com/
• https://isometric.online/

3D Illustrations:

• http://isometriclove.com
• http://handz.design
• http://free3dicon.com
• https://www.behance.net/rafalutinski
• https://bamdesign.gumroad.com/l/bamillu
• https://www.behance.net/gallery/110088245/Free-3D-Slam-Illustrations
• https://3dicons.co
• https://www.behance.net/gallery/111365565/THIS-IS-CHLOE
• https://10clouds.com/valentine-illustrations
• https://amritpaldesign.com/toy-faces
• https://kukla-kit.wannathis.one/
• https://minima.market/faticons-medicine
• https://homies3d.com/
• https://loops.wannathis.one/
• https://www.artify.co/3d-lettering
• https://humans.wannathis.one/
• https://threedee.design/
• https://superscene.pro/
• https://www.shapefest.com/

Web Dev Library

• A smooth 3D tilt javascript library.
• Create Beautiful Fullscreen Scrolling Websites.
• a lightweight JavaScript animation library.
• Data visualization library of many developers

Icons

• http://fontawesome.com
• http://flaticon.com
• http://icons8.com
• http://material.io/resources/icons
• http://iconmonstr.com
• https://akaricons.com/
• https://thenounproject.com/
• https://www.iconfinder.com/
• https://remixicon.com/
• https://heroicons.com/
• https://friconix.com/
• https://iconscout.com/
• https://freeicons.io/
• https://findicons.com/
• https://feathericons.com
• https://icons.getbootstrap.com
• https://iconic.app/
• https://ionic.io/ionicons/v4
• https://www.fontisto.com/icons

Fonts:

• http://fonts.google.com
• http://fontspace.com
• http://1001fonts.com
• http://fontsquirrel.com
• https://nerdfonts.com/
• https://fonts.adobe.com
• https://urbanfonts.com
• https://dafont.com

Resources for CSS

1. Color Hunt https://colorhunt.co

2. Coolors https://coolors.co

3. HTML color codes https://htmlcolorcodes.com

4. UI Gradients https://uigradients.com/#Bupe

5. Gradient generator https://cssgradient.io

6. Encycolorpedia https://encycolorpedia.com

7. WebFx https://webfx.com/web-design/color-picker/

8. Radial Gradient https://css-gradient.com

9. COLORS https://clrs.cc

10. Flat UI colors 2 https://flatuicolors.com/

11. Colormind http://colormind.io/

12. Cssbuttons.io https://cssbuttons.io/

CODE SNIPPETS

13. Web tools https://webcode.tools/css-generator

14. Little snippets https://littlesnippets.net

15. Enjoy CSS https://enjoycss.com

16. CSS Tricks https://css-tricks.com/snippets/css/

17. CSS Deck https://cssdeck.com

18. W3 How to https://w3schools.com/howto/

19. Snipplr https://snipplr.com

20. Stack overflow https://stackoverflow.com/questions/tagged/css

21. Codepen https://codepen.io/collection/DYpwPE

22. Code my UI https://codemyui.com/

23. React Cheatsheet https://devhints.io/react

DOCUMENTATION AND NOTES

24. W3 Schools https://w3schools.com/css/

25. MDN https://developer.mozilla.org/en-US/docs/Web/CSS

26. DevDocs https://devdocs.io/css/

27. Geeks for geeks https://geeksforgeeks.org/css-tutorials/

28. Tutorials point https://tutorialspoint.com/css/index.html

29. CSS Reference https://cssreference.io/

CSS GENERATORS

30. CSS button creator https://cssbuttoncreator.com

31. Blob Maker https://blobmaker.app

32. Waves maker https://getwaves.io

33. Enjoy CSS https://enjoycss.com

34. Neumorphic UI https://neumorphism.io/#e0e0e0

35. Glassmorphism Generator https://glassmorphism.com

36. Keyframes https://keyframes.app

37. Animista https://animista.net

38. Fancy border https://9elements.github.io/fancy-border-radius/

39. CSS Generators tool https://cssgenerator.org/

40. CSS 3 maker https://css3maker.com

41. CSS clip path maker https://bennettfeely.com/clippy/

42. CSS shapes generator https://coveloping.com/tools/css-shapes-generator

43. Pattern generator http://patternify.com

44. Background image generator http://bg.siteorigin.com

45. Box-Shadow Generator https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Backgrounds_and_Borders/Box-shadow_generator

46. Color Contrast Checker https://colourcontrast.cc/

47. Color Palette AI Generator http://khroma.co/

48. Shape Divider Generator https://www.shapedivider.app/

DESIGN INSPIRATION

49. CSS design awards https://cssdesignawards.com

50. Awwwards https://awwwards.com/websites/css3/

51. CSS nectar https://cssnectar.com

52. Design modo https://designmodo.com/css-website-designs/

53. CSS winner https://csswinner.com

54. Dark mode Inspiration https://www.darkmodedesign.com/

55. Lookup Design https://lookup.design/

56. Design Checklist https://www.checklist.design/

YOUTUBE TUTORIALS

57. Free code camp https://youtube.com/watch?v=1Rs2ND1ryYc

58. Traversy media https://youtube.com/watch?v=yfoY53QXEnI

59. Coding artist https://youtube.com/channel/UC15exV5s79D_aYGADudlwpQ

60. Edureka https://youtube.com/watch?v=3_9znKVNe5g

61. Red Stapler https://www.youtube.com/channel/UCRthRrv06q1iOl86-tTKJhg

GITHUB REPO

62. Awesome CSS https://github.com/awesome-css-group/awesome-css

63. 30 seconds of CSS https://github.com/30-seconds/30-seconds-of-css

64. CSS Protips https://github.com/AllThingsSmitty/css-protips

65. Awesome flexbox https://github.com/afonsopacifer/awesome-flexbox

66. Understanding flexbox https://github.com/ohansemmanuel/Understanding-Flexbox

CHROME EXTENSIONS

67. CSS Peeper https://chrome.google.com/webstore/detail/css-peeper/mbnbehikldjhnfehhnaidhjhoofhpehk?hl=en

68. Pesticide https://chrome.google.com/webstore/detail/pesticide-for-chrome-with/eipbgplchlidkojmppclhkechkhmlefi?hl=en

69. Stylebot https://chrome.google.com/webstore/detail/stylebot/oiaejidbmkiecgbjeifoejpgmdaleoha?hl=en

70. Perfect Pixel https://chrome.google.com/webstore/detail/perfectpixel-by-welldonec/dkaagdgjmgdmbnecmcefdhjekcoceebi?hl=en

71. Colorpick eyedropper https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg?hl=en

Resources for JavaScript

1. MDN https://developer.mozilla.org/en-US/docs/Web/JavaScript

2. W3 Schools https://w3schools.com/js/

3. DevDocs https://devdocs.io/javascript/

4. JavaScript Info https://javascript.info

5. JavaScript Garden https://bonsaiden.github.io/JavaScript-Garden/?ref=java5cript.com

6. Code Academy https://codecademy.com/learn/introduction-to-javascript

7. Udemy https://udemy.com/course/the-complete-javascript-course/

8. Coursera https://coursera.org/learn/javascript

9. Plural Sight https://pluralsight.com/courses/quick-start-javascript-1-1870

10. Scrimba https://scrimba.com/topic/javascript

11. Geeks For Geeks https://geeksforgeeks.org/javascript-tutorial/

12. Java Point https://javatpoint.com/javascript-tutorial

13. Tutorial Points https://tutorialspoint.com/javascript/index.htm

14. The Odin Project https://theodinproject.com/courses/javascript

15. Learn JS https://www.learn-js.org/

16. JavaScript Wikipedia https://en.wikibooks.org/wiki/JavaScript/Introduction

17. JavaScript 30 https://javascript30.com

18. JavaScript for Cats http://jsforcats.com

19. Java5cript https://java5cript.com

20. Scotch io https://scotch.io/tag/javascript

21. JavaScript Mastery https://youtube.com/watch?v=g7T23Xzys-A

22. Clever Programmer https://youtube.com/watch?v=Qqx_wzMmFeA

23. Edureka https://youtube.com/watch?v=o1IaduQICO0

24. Coursera https://youtube.com/watch?v=o1IaduQICO0

25. Freecodecamp https://www.youtube.com/watch?v=PkZNo7MFNFg&ab_channel=freeCodeCamp.org

26. Web Dev Simplified https://youtube.com/watch?v=YeFzkC2awTM&list=PLZlA0Gpn_vH9k5ju1yq9qCDqvtuTVgTr6

27. Traversy Media https://youtube.com/watch?v=hdI2bqOjy3c&list=PLillGF-RfqbbnEGy3ROiLWk7JMCuSyQtX

28. Edureka https://youtube.com/watch?v=IljVmcDDrOg

29. Hitesh Choudhary https://youtube.com/watch?v=2md4HQNRqJA&list=PLRAV69dS1uWSxUIk5o3vQY2-_VKsOpXLD

30. Simon Høiberg https://www.youtube.com/watch?v=yU0Gh9T7sq8&ab_channel=SimonH%C3%B8iberg

31. Eloquent JS https://eloquentjavascript.net

32. JS Design pattern https://addyosmani.com/resources/essentialjsdesignpatterns/book/

33. The JavaScript Beginner's Handbook https://flaviocopes.com/page/javascript-handbook/

34. Learn JavaScript with Ease https://pdfdrive.com/javascript-javascript-for-beginners-learn-javascript-programming-with-ease-in-half-the-time-everything-about-the-language-coding-programming-and-web-pages-you-need-to-know-e158299863.html

35. Human JavaScript https://read.humanjavascript.com

36. Modern JavaScript tutorials https://github.com/javascript-tutorial/en.javascript.info

37. Awesome JS Learning https://github.com/micromata/awesome-javascript-learning

38. JS by example https://github.com/bmkmanoj/js-by-examples

39. 33 JS concepts https://github.com/leonardomso/33-js-concepts

40. 30 seconds of code https://github.com/30-seconds/30-seconds-of-code

41. 10 JS projects in 10 hours https://youtube.com/watch?v=dtKciwk_si4

42. 15 JS projects https://youtube.com/watch?v=3PHXvlpOkf4

43. Build 7 games using JS https://youtube.com/watch?v=lhNdUVh3qCc

44. 50 projects in 50 days https://udemy.com/course/50-projects-50-days/

45. JavaScript Projects for Beginners https://jsbeginners.com/javascript-projects-for-beginners/

46. 30 days of JavaScript https://github.com/Asabeneh/30-Days-Of-JavaScript

47. JavaScript The Good Parts https://andersonguelphjs.github.io/OReilly_JavaScript_The_Good_Parts_May_2008.pdf

48. JavaScript Promises https://www.udacity.com/course/javascript-promises--ud898

49. ES6 - JavaScript Improved https://www.udacity.com/course/es6-javascript-improved--ud356

50. Clean Code for Typescript https://labs42io.github.io/clean-code-typescript/

51. Clean Code for Javascript https://github.com/ryanmcdermott/clean-code-javascript

52. Mastering JS https://masteringjs.io/

53. New Resources are coming soon

Helpful Chrome Extensions

1. Responsive Web Design Tester https://chrome.google.com/webstore/detail/responsive-web-design-tes/enhcpefphhaiikpobimgcakinhabgiib/related?utm_source=chrome-ntp-icon
2. Full Page Screen Capture https://chrome.google.com/webstore/detail/gofullpage-full-page-scre/fdpohaocaechififmbbbbbknoalclacl?utm_source=chrome-ntp-icon
3. Light House https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?utm_source=chrome-ntp-icon
4. Css Peeper https://chrome.google.com/webstore/detail/css-peeper/mbnbehikldjhnfehhnaidhjhoofhpehk?utm_source=chrome-ntp-icon
5. ColorPick Eyedropper https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg?utm_source=chrome-ntp-icon
6. What Font https://chrome.google.com/webstore/detail/what-font-find-font/djgfpbegnihdgbngpmhjnlchgglngcdn?utm_source=chrome-ntp-icon
7. Fonts Ninja https://chrome.google.com/webstore/detail/fonts-ninja/eljapbgkmlngdpckoiiibecpemleclhh
8. Window Resizer https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh/
9. BrowserStack https://chrome.google.com/webstore/detail/browserstack/nkihdmlheodkdfojglpcjjmioefjahjb
10. Lorem Ipsum Generator https://chrome.google.com/webstore/detail/lorem-ipsum-generator-def/mcdcbjjoakogbcopinefncmkcamnfkdb
11. Wappalyzer https://chrome.google.com/webstore/detail/wappalyzer/gppongmhjkpfnbhagpmjfkannfbllamg?hl=en
12. What Font https://chrome.google.com/webstore/detail/what-font-find-font/djgfpbegnihdgbngpmhjnlchgglngcdn?utm_source=chrome-ntp-icon

Free Domain

• https://www.freenom.com/en/index.html?lang=en

Coding Challenges:

1. #100DaysOfCode https://www.100daysofcode.com/
2. #JavaScript30 https://javascript30.com/
3. #100DaysCSS https://100dayscss.com/

Fueler: Home for Generalists