SoundBox is an HTML5 synth music tracker/editor, suitable for creating music for small JavaScript demos (on the order of 4K / 8K).
SoundBox is a tool for composing music in your browser. Its design is basically that of a music tracker, which means that the music is organized in tracks and patterns. To run your own copy of SoundBox locally, you need to serve it via a web server (using the file:// protocol is not supported). All code is written in pure HTML/JavaScript/CSS, without any third party toolkits or frameworks. Takes a little time to render the sounds before playback begins. Can load and save songs locally as well as export to .wav files.
Demo: https://sb.bitsnbites.eu
A simple Game Boy Camera-style filter made in HTML5 and JavaScript.
Load the page, it'll ask you if it can use your computer's webcam (if it has one). Let it. It'll show every frame from your camera as if it were coming from a Gameboy Camera.
Tabler is fully responsive and compatible with all modern browsers. Thanks to its modern and user-friendly design you can create a fully functional interface that users will love! Choose the layouts and components you need and customize them to make your design consistent and eye-catching. Every component has been created with attention to detail to make your interface beautiful!
Uses the Liquid templating system.
A static HTML page that takes Markdown documents and turns them into a self-hosted wiki. Ideal for taking a copy of your personal flat file wiki with you if you'll be disconnected. Can be served with something as simple as python3 -mhttp.server on your machine.
It is recommended by the developers that you download the latest release from Github and copy the contents of the dist/ folder therein to wherever you have your markdown docs stored for installation.
Links on the web break all the time. There are really two problems:
- Link rot: Following a link yields a "404 Not Found" error message.
- Content drift: The content at the end of the link changes over time, possibly to the point where it loses all similarity with the originally linked content.
Robustifying your links addresses these problems. It increases the chances that links will lead to meaningful content, even long after they were put in place. The following three pieces of information robustify a link in a machine-actionable manner:
- The URI of the original resource.
- The URI of the snapshot.
- The date of linking.
REST API docs: https://robustlinks.mementoweb.org/api-docs/
jQuery and its cousins are great, and by all means use them if it makes it easier to develop your application.
If you're developing a library on the other hand, please take a moment to consider if you actually need jQuery as a dependency. Maybe you can include a few lines of utility code, and forgo the requirement. If you're only targeting more modern browsers, you might not need anything more than what the browser ships with.
At the very least, make sure you know what jQuery is doing for you, and what it's not. Some developers believe that jQuery is protecting us from a great demon of browser incompatibility when, in truth, post-IE8, browsers are pretty easy to deal with on their own.
JavaScript is great, and by all means use it, while also being aware that you can build so many functional UI components without the additional dependancy.
Maybe you can include a few lines of utility code, or a mixin, and forgo the requirement. If you're only targeting more modern browsers, you might not need anything more than what the browser ships with.
This site is fully copied from youmightnotneedjquery.com, an excellent resource for vanilla JavaScript created by @adamfschwartz and @zackbloom. But this time, we take a look at the power of modern native HTML and CSS as well as some of the syntactic sugar of Sass. Because, you might not need scripts for that task at all!
Maybe I can use this for links?
A simple, aesthetic tabletop dice rolling simulator featuring d4, d6, d8, d10, d12, d20 and d100! Use offline or host it yourself!
You can also use it online: https://bkis.github.io/dice-or-die/
You can also select a combination of dice to roll (such as 1d4 and 2d6 and 3d20) and the app will roll them and total them up for you.
Or use mine: https://amoebatron.virtadpt.net/
A small but highly customisable site template, ideal for a project documentation homepage.
Might be addable to my website's theme.
A nice, retro-looking dashboard for organizing your environments. Instant local search, keyboard shortcuts, themable, customizable. YAML config file. Icons can be customized as well. Theoretically small enough to carry around on your mobile device. Uses yarn to install dependencies and compile. Themes can be switched out in realtime.
Reminds me a bit of GEOS or Workbench.
Serve with any web server; the Docker container uses nginx, but use whatever.
A smart solution to the problem of passwords. Cloverleaf generates passwords on demand, using the name of the app you're making a password for and a master password to derive a passcode. Enter those two things and you don't need to store the passcode because you can re-generate it whenever you want.
Can be installed as a native app and used offline.
This is a list of small, free, or experimental tools that might be useful in building your game / website / interactive project. Although I’ve included ‘standards’, this list has a focus on artful tools and toys that are as fun to use as they are functional.
The goal of this list is to enable making entirely outside of closed production ecosystems or walled software gardens.
qXMPPconsole is a browser based XMPP console. It is writen with the purpose to aid in learning the XMPP protocol. So far it is tested only over websockets and connecting to localhost. Comments, issues, pull requests are welcome.
The application is a single static web page.
A lightweight CSS framework for personal sites.
Use this starter kit to create a viable, good looking, production-ready website whose entire size does not exceed 2 KB compressed when opened in a browser. Ideally, the total size of all assets (HTML, CSS, favicon, etc.) downloaded by the browser when opening the page will be under 2 KB. You need npm and gulp installed to assemble it, but once you have it everything you need will be in the dist/ subdirectory.
A data visualization framework written in CSS. Uses the semantic HTML5 tags to identify data to process, the data goes inside the HTML markup in the form of tables. No Javascript is needed to pull data out of APIs for processing (unless you want to roll that way, I guess). The core CSS file can be downloaded and put to use more or less immediately.
Semantic HTML elements are those that clearly describe their meaning in a human- and machine-readable way. Elements such as <header>, <footer> and <article> are all considered semantic because they accurately describe the purpose of the element and the type of content that is inside
Prism is a lightweight, extensible syntax highlighter, built with modern web standards in mind. vIt’s used in thousands of websites, including some of those you visit daily. Simple to use. Lightweight. Customizable downloads, just like Bootstrap. Surprisingly easy to use: Include the files in your HTML and it does the rest for your <code> blocks. Extremely fast.
A secure synchronous lightweight chatroom with zero logging and total transience. Realtime chat over Websockets. Tries to be as lightweight as possible. IPv6 enabled by default. Users are ready to go as fast as possible. Encryption enabled. Admin commands.