Web developers need to learn a voluminous library of information to start crafting websites. Your first projects are usually simple, but not very good. Over time you practice more and begin to learn concepts surrounding good web design. With this foundation you can start implementing tools and webapps to expedite your performance.
Such resources may range from a dynamic website screenshot capture to cloud-hosted CSS/JS scripts, or even 3rd party API wrappers. I’d like to share just a few resources that may provide benefit to web developers or designers. Any digital project you need to accomplish might be quicker with these free online webapps.
Online Code IDEs
Quite possibly my favorite part about modern-day web development is the cloud. I can pick up smaller ideas online using tools such as CodePen. This allows me to map out the HTML/CSS structure of the page along with dynamic JavaScript effects.
Others might include jsFiddle as a very popular solution. This site runs a Git-style version management where you can fork projects to add more features. Online web development has changed how I(and many others) start tinkering on new ideas. Your operating system does not matter as long as you have Internet access.
At the point when you have something good, it’s very easy to move code over to a new HTML document. Other paid solutions allow developers to work within their own private server which isn’t open for the public. As this trend evolves I hope more web developers see the benefit of practicing scribble code online.
Open Source Projects
jQuery has brought about a revolution within the open source Internet. Any practiced web developer can build their own plugin and share it out with the world. Online platforms like cdnjs are perfect when you’re coding on a cloud IDE as I mentioned previously.
But even working on your own websites you may choose to include scripts hosted externally. These free plugins are now becoming apart of everyday web development. Not to mention the power of free CSS3 styles like Google Web Fonts. If you dig through online plugin galleries you might be surprised at how many ideas could improve your website.
If you’re a developer who haven’t spent much time practicing jQuery, I’d recommend at least 1-2 hours a week. You’ll be confused at first but this is normal. Even just looking over some code and trying to understand what it does can help you progress. Open source is a powerful movement that seems to be expanding as the years go by.
Content Generators
A final resource I’d like to mention would be online content generators. These might be graphical freebies or search engines, or perhaps tiled background galleries. Or possibly even Lorem Ipsum generators to fill in content gaps on your projects. There are many image generators for content placeholders as well.
Determine the finished goal of your project and think about what could be useful in the process. Maybe an online mockup or wireframing resource? Or what about the various UI component builders? Over the years I’ve found great color pickers and other tools which have unfortunately gone offline – but some do remain up to this day.
There are also content validators made specifically for websites and HTML/CSS/JS code. For example Optimus is an online microformats checker to see if your HTML5 code runs properly. SassMe is a SASS/CSS tool for visualizing color functions in action. There are so many tools out there it would be impossible to list them all.
My advice is to figure out what you could be lacking and hit Google with some keywords. I’ve often been very surprised to find there are web applications out there for exactly what I need.
Author: Jake Rocheleau
Jake is a creative designer, illustrator, and web developer. He frequently writes articles involving new-age design concepts and freelance management skills. You can find him in Google or follow his tweets @jakerocheleau
