kosperera / vanilla-js-snippets

Library of commonly used boilerplate code for all things vanilla JS

Vanilla JavaScript { snippets }

I'm a huge nerd 🤓 of vanilla javascript (JS). This repository serves as a library of helper functions and boilerplate code written with native javascript and browser APIs instead of major frameworks and libraries.

Read the journal notes to learn more..

On this repo

• boilerplate-* are code templates to get started with various patterns and practices.
• helper-* are nano-libraries written for various needs and wants which I typically either copy & paste as and when needed.
• examples/try-* are partials mixed and matched in order to demonstrate a bit more complexed implementations.

Getting Started

For minimum requirements, you will need the followings:

• VS Code with Remote - Container extension.
• Docker Desktop
• A web browser, like Brave as for javascript playground

Run from Source

With VS Code:

• Run command: Open with Live Server, or
• Click Go Live on the status bar

Spin up your favorite browser to visit localhost:5505/examples/

Read the journal notes to learn more..

Feedback

If you were wondering, ask questions and problems on GitHub. It is as easy as creating a new discussion. If not, here are the ways you can provide feedback.

• Submit bugs and request code snippets
• Upvote popular code snippets
• Review source code and documentation

Learning Resources

Nowadays, vanilla javascript already cover most of it anyways. And, polyfills are there whenever some random feature doesn't support on the browser.

• You Don't Need Lodash and Underscore shows what vanilla javascript methods and techniques to use instead.
• Financial Times polyfill repository is good for polyfill code snippets.
• Writing vanilla JS snippets and examples #30 for a curated list of online resources referred on these snippets.

Contributing

If you were wondering, I'd be happy to have more code snippets here. Have a suggestion or a bug fix? Just open a pull request or an issue. Include the code snippet with a clear file name and the simplest HTML possible.

License

Licensed under MIT