Web Development

For personal projects, I've favored gandi.net for many years, but I'm trying to get a few candidates together for the organization I work for. Not a fan of GoDaddy, NetworkSolutions, or many of the all-in-one web host / registrar / app hosting / whateverelse sites.

Hoping there are a few modern alternatives out there that I haven't seen yet. We had all of our domains on Google Domains, but since they got bought by Squarespace, I'm surveying our options.

Bun 1.0 is finally here.

Bun is a fast, all-in-one toolkit for running, building, testing, and debugging JavaScript and TypeScript, from a single file to a full-stack application. Today, Bun is stable and production-ready.

Hacker news discussion has a developer of Bun answering questions.

From what I gather, I don't know that there's a new norm in this regard yet, besides recognizing that gifs are increasingly old & clunky (despite being fun & amusing), and so I don't know if mp4s or webms or something else might be better if wanting to keep a site lightweight while still having some animated elements.

Callouts play a dominant role in technical writing. What are folks doing with their markup semantics (a.k.a. admonitions) & why isn’t there a native option? Maybe we can propose one.

I'm looking for an web analytics tool.

I really only care about how many people visit the site, and where from. Any other data would be nice just not needed.

Are there any free, and or cheap tools?

Do you code on an iPad? Why or why not? If you do, what code editor do you use?

I don’t have a laptop I usually code on my desktop, but I work from home so I get tired of sitting in the same place for so long. I’ve been doing it on my iPad and it seems to be doable!

I tried a few free apps for ipadOS. Some were okay, some were not. I’m willing to pay but I don’t want to spend money randomly on apps I don’t like.

CodeSpaces on GitHub seems to be the best option so far, but it’s a pay as you go structure and not a singular cost.

I liked the UI of Runestone, but many critical features are locked behind a paywall.

Replit seemed decent too but it seems very cloud focused and I already use GitHub.

Koder* seems like it has the most free access features but UI wasn’t intuitive and I couldn’t figure out how to type in a file if I switched pages and came back to my original file.

I hear Textastic is pretty good but side it’s paid with no trial period, I didn’t try it yet. I wanted to get some feedback before I started paying for anything.

Let me know what you use. Share your tips with Lemmy!

I have some complex touch interactions and am looking for a lightweight touch/gesture library to help me handle them. Interactjs is great, but it’s a fairly large bundle. Other top ones are not maintained anymore it seems.

cross-posted from: https://lemy.lol/post/4569543

I need to

• encrypt JSON payload (not just sign)
• not share private key
• verify the payload is generated with the shared public key and RSA fitting all of these.

As I've only made auth with JWT so far, I'm not sure. If I use RSA, I guess I have to put the encrypted text in the body.

Do you think it can be used? Any other suggestions?

This Friday, 2023-08-25, a vendor is randomly choosing winners to receive a free ticket to a September conference hosted by London Web Standards.

Entry is by replying to this post on Mastodon.

I'm struggling with CSS Flexbox. Each time I think I'm about to get it in an aha momet, I'm actually two steps backwards. I'm taking The Odin Project course and I'm at the phase where I am building the landing page. I've worked on it for 16 straight hours and I'm almost finished. It just looks like shit on a small screen but in fairness, the curriculum did mention that. Otherwise, what I have looks like the goal. I did one or two extra easy touches.

Okay so one question: when is it better to use flex-direction: column and when is it better to use flex-direction row? I'm seriously confused.

cross-posted from: https://programming.dev/post/1923251

Some frontend developers know the BEM methodology as a naming convention for CSS and they create a disgusting #webcomponents. I've explain the essence of BEM and shown the benefits for your frontend projects.

Feel free to share it with a people who tells you "i use CSS-modules, so i no needs a BEM"

The web is fucked and there’s nothing we can do about it. Kev Quirk looks back fondly at Web 1.0.

Hey there!
As promised @[email protected] @[email protected] I'm posting now (new account btw), thanks for the encouragement! :)

I made a very simple web app as an exercise, since I'm pretty much new to JavaScript frameworks. I got the idea from a post that was ciphered with ROT-1 [1]

fjhiupofojof QBSJT OZD UPLZP UBJQFJ

⣿⣿⣿⣿⣿⣿⣿⣿⡿⠿⠛⠛⠛⠋⠉⠈⠉⠉⠉⠉⠛⠻⢿⣿⣿⣿⣿⣿⣿⣿
⣿⣿⣿⣿⣿⡿⠋⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠛⢿⣿⣿⣿⣿
⣿⣿⣿⣿⡏⣀⠀⠀⠀⠀⠀⠀⠀⣀⣤⣤⣤⣄⡀⠀⠀⠀⠀⠀⠀⠀⠙⢿⣿⣿
⣿⣿⣿⢏⣴⣿⣷⠀⠀⠀⠀⠀⢾⣿⣿⣿⣿⣿⣿⡆⠀⠀⠀⠀⠀⠀⠀⠈⣿⣿
⣿⣿⣟⣾⣿⡟⠁⠀⠀⠀⠀⠀⢀⣾⣿⣿⣿⣿⣿⣷⢢⠀⠀⠀⠀⠀⠀⠀⢸⣿
⣿⣿⣿⣿⣟⠀⡴⠄⠀⠀⠀⠀⠀⠀⠙⠻⣿⣿⣿⣿⣷⣄⠀⠀⠀⠀⠀⠀⠀⣿
⣿⣿⣿⠟⠻⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠶⢴⣿⣿⣿⣿⣿⣧⠀⠀⠀⠀⠀⠀⣿
⣿⣁⡀⠀⠀⢰⢠⣦⠀⠀⠀⠀⠀⠀⠀⠀⢀⣼⣿⣿⣿⣿⣿⡄⠀⣴⣶⣿⡄⣿
⣿⡋⠀⠀⠀⠎⢸⣿⡆⠀⠀⠀⠀⠀⠀⣴⣿⣿⣿⣿⣿⣿⣿⠗⢘⣿⣟⠛⠿⣼
⣿⣿⠋⢀⡌⢰⣿⡿⢿⡀⠀⠀⠀⠀⠀⠙⠿⣿⣿⣿⣿⣿⡇⠀⢸⣿⣿⣧⢀⣼
⣿⣿⣷⢻⠄⠘⠛⠋⠛⠃⠀⠀⠀⠀⠀⢿⣧⠈⠉⠙⠛⠋⠀⠀⠀⣿⣿⣿⣿⣿
⣿⣿⣧⠀⠈⢸⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠟⠀⠀⠀⠀⢀⢃⠀⠀⢸⣿⣿⣿⣿
⣿⣿⡿⠀⠴⢗⣠⣤⣴⡶⠶⠖⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⡸⠀⣿⣿⣿⣿
⣿⣿⣿⡀⢠⣾⣿⠏⠀⠠⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠛⠉⠀⣿⣿⣿⣿
⣿⣿⣿⣧⠈⢹⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣰⣿⣿⣿⣿
⣿⣿⣿⣿⡄⠈⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣴⣾⣿⣿⣿⣿⣿
⣿⣿⣿⣿⣧⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣾⣿⣿⣿⣿⣿⣿⣿⣿⣿
⣿⣿⣿⣿⣷⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣴⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿
⣿⣿⣿⣿⣿⣦⣄⣀⣀⣀⣀⠀⠀⠀⠀⠘⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿
⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣷⡄⠀⠀⠀⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿
⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣧⠀⠀⠀⠙⣿⣿⡟⢻⣿⣿⣿⣿⣿⣿⣿⣿⣿
⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⠇⠀⠁⠀⠀⠹⣿⠃⠀⣿⣿⣿⣿⣿⣿⣿⣿⣿
⣿⣿⣿⣿⣿⣿⣿⣿⡿⠛⣿⣿⠀⠀⠀⠀⠀⠀⠀⠀⢐⣿⣿⣿⣿⣿⣿⣿⣿⣿
⣿⣿⣿⣿⠿⠛⠉⠉⠁⠀⢻⣿⡇⠀⠀⠀⠀⠀⠀⢀⠈⣿⣿⡿⠉⠛⠛⠛⠉⠉
⣿⡿⠋⠁⠀⠀⢀⣀⣠⡴⣸⣿⣇⡄⠀⠀⠀⠀⢀⡿⠄⠙⠛⠀⣀⣠⣤⣤⠄⠀

About SolidJS, I'm really liking how signals work, at first it seemed a little strange to use them, but they're actually pretty comfortable and you can do neat things with them, I finished the first prototype in less than a day in fact, the real hard thing was CSS instead lol. I had digged myself into a hole of weird rules so I ended up rewriting most of the CSS in the end and that took a fair bit more time, then came the logo design... oof T . T

Let me know if you find anything, uhh, peculiar ;)

Here's the code: https://codeberg.org/quazar-omega/unslide

[1] Facebook post, sorry couldn't find a privacy respecting frontend for Facebook :/

What I want to do:
Deploy brochure site(s) with minimal (or no) cost.

Stack:
Nuxt, Sanity, Cloudflare Pages.

Problem:
$0.00 challenge (maybe I just don't want to pay)

Requirements:

• Trim trailing slash on all routes
• Server-side form sanitation/validation (optional)

Solution 1: Nitro server...
No problem with route middleware, I just don't know this will translate to function/worker usage. Can someone even DoS my site and exhaust 100k allowance? Is it 1 per request? Will crazy convoluted validation logic effect credit used?

Solution 2: Static generation...
I don't know how to use _redirect to trim trailing slash on all routes. The docs do not show any example using wildcard (splat) follow by slash.

Senpai of the Edge, please enlighten me.

Is it ok to post personal projects regardless of size?
What I mean is, if we can post, does it have to be something actually good and useful, or can it be little toy projects as well?

SOLVED: by @[email protected] using columns property

TL;DR: I want to achieve this behavior for the menu layout, but all I can get is this; note the different menu options order.

Two days ago I asked for help for implementing the current behavior without hardcoding the menu height for each resolution step, and there were two suggestions to try display: grid. It looked promising and after reading some documentation I was able to get something very close to what I'm looking for.

The only difference being that I want the chapters to be sorted vertically (as in the current version), but what I got sorts the chapters horizontally.

Here it is (what I think is) the relevant code:

#menu ul {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-flow: row dense;
}

Sorry, I don't have the display: grid version online.

I did a quick search for display grid multiple columns vertical sort and saw this StackOverflow post: CSS Grid vertical columns with infinite rows which, if I understand correctly, says it's not possible. But I'm pretty sure I'm not understanding it correctly.

Any help will be welcome, thanks!

EDIT: I also tried grid-audto-flow: column (as suggested here) but it just renders a single row. Probably because I'm missing something...

#menu ul {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-flow: column;
}

EDIT-2: I was told that for grid-audto-flow: column to work I need to specify the numbers of columns. If I understand correctly, then that doesn't really help. The original issue is that I need to edit the CSS file every time a new chapter is added. Which would be the same if I have to hardcode the number of rows.

I mean, it's a bit cleaner to hardcode the number of rows than the height in pixels, but I was looking for a solution that doesn't require magic numbers in the CSS.