As a web developer, having access to the right resources can make a big difference in your workflow, productivity, and learning curve. While there are plenty of paid tools and services available, there are also numerous free resources that can be incredibly valuable. In this article, we'll explore a list of free resources that every web developer should know about.
Code Editors and IDEs:
- Visual Studio Code (https://code.visualstudio.com/)
- Atom (https://atom.io/)
- Brackets (http://brackets.io/)
- Sublime Text (https://www.sublimetext.com/)
- Online Code Playgrounds and Editors:
- CodePen (https://codepen.io/)
- JSFiddle (https://jsfiddle.net/)
- CodeSandbox (https://codesandbox.io/)
- Replit (https://replit.com/)
CSS Resources:
- CSS Tricks (https://css-tricks.com/)
- CSS Battle (https://cssbattle.dev/)
- Animate.css (https://animate.style/)
- Tailwind CSS (https://tailwindcss.com/)
- JavaScript Resources:
- Mozilla Developer Network (MDN) (https://developer.mozilla.org/en-US/docs/Web/JavaScript)
- FreeCodeCamp (https://www.freecodecamp.org/)
- Eloquent JavaScript (https://eloquentjavascript.net/)
- You Don't Know JS (https://github.com/getify/You-Dont-Know-JS)
React Resources:
- React Documentation (https://reactjs.org/docs/getting-started.html)
- React Router (https://reactrouter.com/)
- React Redux (https://react-redux.js.org/)
- Create React App (https://create-react-app.dev/)
- Web Design Resources:
- Dribbble (https://dribbble.com/)
- Behance (https://www.behance.net/)
- Unsplash (https://unsplash.com/)
- Google Fonts (https://fonts.google.com/)
- Developer Communities and Forums:
- Stack Overflow (https://stackoverflow.com/)
- Reddit (https://www.reddit.com/r/webdev/)
- GitHub (https://github.com/)
- Discord (https://discord.com/)
- Learning Platforms and Tutorials:
- freeCodeCamp (https://www.freecodecamp.org/)
- The Odin Project (https://www.theodinproject.com/)
- MDN Web Docs (https://developer.mozilla.org/en-US/)
- Scrimba (https://scrimba.com/)
- Collaboration and Project Management Tools:
- Trello (https://trello.com/)
- Notion (https://www.notion.so/)
- GitHub Projects (https://github.com/features/projects)
- Asana (https://asana.com/)
- Testing and Debugging Tools:
- Chrome DevTools (https://developers.google.com/web/tools/chrome-devtools)
- Firefox Developer Tools (https://developer.mozilla.org/en-US/docs/Tools)
- Lighthouse (https://developers.google.com/web/tools/lighthouse)
- Can I Use (https://caniuse.com/)
These free resources cover a wide range of topics, from code editors and online playgrounds to learning platforms, developer communities, and testing tools. Leveraging these resources can help you improve your skills, stay up-to-date with the latest trends, collaborate with other developers, and enhance your web development workflow.
Remember, while these resources are free, they often have premium or paid versions with additional features and capabilities. However, the free offerings can still be immensely valuable, especially for beginners or those on a tight budget.
Top comments (6)
I would also point out other learning resources, blogs like builder.io blog, or daily.dev.
YT Creators like
WebDevSimplified
mattpocockuk - he also runs an amazing site totaltypescript
Daily.dev is so good, it's really become my go-to spot for dev news and community
Thank you for your valuable comment. Also I'll take care of these in the next blog for sure.
Good set of resources but missing Bootstrap as a resource.
Yeah, I forgot to add (Not using it for while that's why)
You can add one more library to your stack.
scriptkavi/hooks