Codepen is a mashup between a browser-based IDE and social media to create a social development environment. This site is best used as a sandbox to develop and test small snippets of code for later integration into larger projects. You can also save snippets for use in later projects, publish them as part of your portfolio, and use it to house and distribute your own contributions to open-source code.
Repl.it is a browser-based IDE which is very similar to Codepen. Though it lacks the social aspects of Codepen, I feel it has a UI which is easier to navigate. I frequently use it to test color schemes, click handlers, and other small snippets of code in an isolated environment outside of my projects.
See also: Codepen
GitHub is the best-known and most widely used source to host remote repositories for your code. While GitHub does support app deployment via GitHub Pages, significant downtime for free customers makes this an undesirable resource. Add a second remote origin to your project for Heroku or link Netlify to your repo for deployment, depending on your tech stack.
Netlify is my go-to source for simple webhosting. It's easy to use and configure for a simple website which will not experience enough traffic to justify paid hosting with AWS. Its only drawback is that it does not support apps with an active back-end, so any projects you build using Node.js or Django need to be hosted elsewhere.
See also: Heroku
Heroku is a cloud-hosting platforms with free and paid tiers where you can host web apps. It should be noted that it has frequent downtime for free users which among other reasons makes Netlify generally superior alternative. However, it has support for apps with a Node.js or Django back-end which Netlify does not. For apps that require such and don't warrant paid hosting with AWS, Heroku is the best choice.
See also: Netlify
Building an app with text content requires placeholder text for HTML/CSS development. Sure, you could use the same old boring lorem ipsum your grandparents used. But why not use some spicier sausage-themed Bacon Ipsum instead‽ Bacon Ipsum is the only placeholder text content I ever use.
Flaticon is an outstanding source of SVG image files which are free to use in any capacity with proper attribution. Nearly all the iconography on this website is from Flaticon. The site is my first (and usually only) stop when I need to find an icon to use in a project.
There are plenty of times that I need to do some basic image processing (such as cropping or resizing an image) but don't need the features of a program like Adobe Illustrator or Inkscape. Lunapic is a free web-based image processing app which is quite well-featured. Nearly all manual image processing I do for my projects is done with Lunapic.
Markdown is an intentionally easy-to-learn language, but you still need to learn it. This guide, published by GitHub, is a guide to markdown syntax which is both easy-to-read and comprehensive. You do not need any other resources to learn markdown for its standard applications.
Every project involves spinning up a development server to preview your work before committing or deploying it, but markdown for README files and such usually aren't targeted. Markdown Live Preview is a tool that allows you copy & paste markdown data to see how it compiles. You never have to wonder how your README.md file will look on GitHub if you view it with Markdown Live Preview first.
No matter what technology you need to use for your web development product, MDN usually has the definitive documentation for how to use it correctly. Though not an educational tool per se, MDN is an excellent resource when you need to see the proper syntax to use a type of function, notation, or method. Many MDN docs are directly referenced in other sections of my resource links.
W3Schools is a resource very similar to MDN Web Docs. On the plus side, it's usually written in a way that's more accessible to the neophyte programmer. On the minus side, it's not well-curated and has a fair amount of information reflecting old and deprecated practice. It's a good reference tool but one that should be used cautiously.
See also: MDN Web Docs
