Introducing Dim – a new framework that brings React-like functional JSX-syntax with JS. Check it out here:

🔗 Project: https://github.com/positive-intentions/dim

🔗 Website: https://dim.positive-intentions.com/

My journey with web components started with Lit, and while I appreciated its native browser support (less tooling!), coming from ReactJS, the class components felt like a step backward. The functional approach in React significantly improved my developer experience and debugging flow.

So, I set out to build a thin, functional wrapper around Lit, and Dim is the result! It's a proof-of-concept right now, with "main" hooks similar to React, plus some custom ones like useStore for encryption-at-rest. (Note: state management for encryption-at-rest is still unstable and currently uses a hardcoded password while I explore passwordless options like WebAuthn/Passkeys).

You can dive deeper into the documentation and see how it works here:

📚 Dim Docs: https://positive-intentions.com/docs/category/dim

This project is still in its early stages and very unstable, so expect breaking changes. I've already received valuable feedback on some functions regarding security, and I'm actively investigating those. I'm genuinely open to all feedback as I continue to develop it!

How would one include a passphrase when using the web crypto API when working with asymmetric encryption. I was able to figure out how to do asymmetric encryption without a passphrase using the web crypto API and was able to figure out how to do asymmetric encryption using the crypto library in NodeJS.

Asymmetric encryption using Web Crypto API (No Passphrase)

import { webcrypto } from 'crypto';

const MY_TEXT = 'My Text';

(async function () {
	const { publicKey, privateKey } = await webcrypto.subtle.generateKey(
		{
			name: 'rsa-Oaep',
			modulusLength: 2048,
			publicExponent: new Uint8Array([1, 0, 1]),
			hash: 'sha-256',
		},
		true,
		['encrypt', 'decrypt']
	);

	const encryptedTextArrayBuffer = await webcrypto.subtle.encrypt(
		{
			name: 'rsa-Oaep',
		},
		publicKey,
		new TextEncoder().encode(MY_TEXT)
	);

	let encryptedTextUint8Array = new Uint8Array(encryptedTextArrayBuffer);
	const ENCRYPTED_TEXT = convertUint8ArrayToBase64String(encryptedTextUint8Array);

	console.log(ENCRYPTED_TEXT);

	encryptedTextUint8Array = convertBase64StringToUint8Array(ENCRYPTED_TEXT);

	const decryptedArrayBuffer = await webcrypto.subtle.decrypt(
		{
			name: 'rsa-Oaep',
		},
		privateKey,
		encryptedTextUint8Array.buffer
	);

	console.log(new TextDecoder().decode(decryptedArrayBuffer));
})();

function convertUint8ArrayToBase64String(uint8Array) {
	const CHARACTER_CODES = String.fromCharCode(...uint8Array);
	return btoa(CHARACTER_CODES);
}

function convertBase64StringToUint8Array(base64String) {
	const CHARACTER_CODES = atob(base64String);

	const uint8Array = new Uint8Array(CHARACTER_CODES.length);
	uint8Array.set(
		new Uint8Array(
			[...CHARACTER_CODES].map(function (currentCharacterCode) {
				return currentCharacterCode.charCodeAt(0);
			})
))}

I stumbled on the exact same issue described at the end of the "The same issue, but with web platform functions" section today, thought it might be worth sharing that article here.

✍️ Reusable API proxy in just a few lines of JavaScript

For my project Mentions United, which collects interactions from various platforms via API to display them on the own page, at some point I needed a way to hide the authentication tokens required for some APIs from being used by unauthorized parties. You simply don’t leave your security keys lying around in the code, especially not if it’s publicly visible on GitHub. ...

The title says it all. Let's talk about one of JavaScript's most underrated features: Object.freeze(). This powerhouse of immutability isn't just another method - it's your secret weapon for writing safer, more predictable code ✨.

I'll be honest, when I first discovered Object.freeze(), I mostly ignored it. "Just don't mutate your objects," I thought. But as my applications grew more complex, I started to see its true value. Now, it's an essential part of my toolkit.

hello. I recently asked here for help with Lemmy HTTP API and someone said "why don't you use lemmy-js-client?". i tried to add it and...

first i searched the internet about this library and it turns out that it is an npm library... (I have github pages) i searched different variations of the library and found a cdn version of it. i tried to add it. it was a hell of a torture.... i added it the way I add cdn libraries, nothing. i searched all over the internet, but found null. i even asked chatgpt! to no avail. the library (and everything I tried to get out of it) turned into undefined!

what am I supposed to do? this is cdn version what i tried to add
if u want here is source code

hello! im developing lemmy client (on html5). i tried to do login function but... when i try to fetch /v3/user backend with auth-token it give me error:

{
  "error": "no_id_given"
}

but why? what im doing wrong? if you want here is my source file on github ( function: getLoggined() )