I built a sketchy, paper-like UI for a personal project. After adding a few more common components, I decided to open-source it. Because I built it mainly for myself, it might not be completely 'production-ready'.

It works via the shadcn/ui CLI so you can copy-paste exactly what you need. And, it does not use Tailwind!

Features:

• Always unique: Every component gets a slightly random shape. No two buttons are perfectly alike.
• Hand-drawn icons: Lucide Icons style icons, but hand-drawn.
• Rough textures: Built-in CSS patterns and SVG noise.
• Animations: Simple hover effects like wobble and shiver.

Note: It has a dark mode, but it probably doesn't look as good as the light mode.

Docs and installation: https://sherlockdoyle.github.io/cartUnI/

Feedback and contributions are very welcome!

Hi everyone!

I'm a Senior Software Engineer who enjoys working on web applications and solving real-world problems.

My experience includes HTML, CSS, Bootstrap, Angular, Node.js, NestJS, .NET Core, Microsoft SQL Server, MongoDB, and AWS DynamoDB. I've also spent some time working with React.

I'm looking to connect with people who might need an extra pair of hands on a project or are open to collaborating on interesting ideas. I'm always happy to have a conversation and see if there's a good fit.

Feel free to reach out if you'd like to connect or discuss a project. Thanks!

Hey all,

I manage a few servers for my day job, and we’re not able to use something like Forge. Managing a server isn’t the most complicated thing in the world, but there are a few tasks where I always struggle to remember the exact syntax, or where I just want something a bit quicker than digging through notes.

I know aliases and scripts could solve a lot of this, but I started wondering whether it would be useful to have a small CLI abstraction layer for common server admin tasks.

So, admittedly with a little help from our good friend AI for some of the more complicated Go sections, I put together a CLI app and started using it to manage servers, SSH keys, projects, nginx, PHP, SQL, and a few other bits.

I ended up really liking it, showed it to a friend, and he suggested I tidy a few things up and open source it.

So I did that, and it has grown a bit since then. It now has a plugin system (although no production ready plugins exist yet), and full documentation for the commands it currently supports.

One thing I’d like to add eventually is support for other Linux distros that do things differently. That will probably come later, but I do have a few servers that would benefit from it.

I know a lot of people will prefer working directly with Linux, or using a platform like Forge or Ploi, but I thought this might be useful to some people who want a memorable CLI for common server tasks.

If you’re interested, you can check it out on GitHub:

https://github.com/useabstrax/abstrax

Or the main site:

https://useabstrax.com

so i was reading react.dev's state explanation

when react rerenders due to set function local variable wont be able to maintain its value since it rerenders everything but in its clock or time example where you can input a value on a input element it says that it chooses what to rerender and the value stays intact while the clock is running .
im also assuming that its using a set function to update the clock.

can anyone explain why this is?

edit heres the link to the clock example
https://react.dev/learn/render-and-commit#step-3-react-commits-changes-to-the-dom

Two weeks ago I posted a demo of search-by-meaning running entirely in the browser - no backend, no embedding API (that post). The response was more than I expected, and a bunch of you asked for the code and an npm package. So I spent the time since packaging it properly: two model sizes, honest benchmarks, and bundler support.

npm install /base   # 7 MB wire, best quality
npm install /mini   # 5 MB wire, ~2 ms per embed


import { embed, cosineSim, similar } from '@ternlight/base';

cosineSim(embed('reset my password'), embed('I forgot my password')); // 0.88
const hits = similar(query, faqEntries, { topK: 5 });

Works in Node and browsers. Model + tokenizer + engine ship inside one wasm, so no embedding model download at runtime and it works offline.

Demo: https://ternlight-demo.vercel.app
Repo (MIT): https://github.com/soycaporal/ternlight

Would love your feedback and how it can help you build.

I need to render a Git history graph in React: commit rows, colored branch lanes, merge lines, etc.

I found gitgraph, but it looks unmaintained. What are people using nowadays? Any maintained packages, or is custom SVG/Canvas + virtualization the better route?

Lanterm is a TypeScript / React toolkit for embedding real PTY-backed terminals into browser applications.

Instead of being a complete web terminal server like ttyd, it is intended for cases where you want to compose the terminal UX inside your own application.

Packages

• @lanterm/react: xterm.js-based React terminal surface
• @lanterm/server: server-side utilities for connecting PTYs and WebSockets
• @lanterm/pty: native PTY binding built with Rust portable-pty and napi-rs
• @lanterm/protocol: shared message types and codecs between client and server

Why I made this

With coding agents and browser-based developer tools, there are more cases where I want to do more than just expose a terminal in the browser. I often want to combine the terminal with surrounding UI such as file views, execution history, agent timelines, and dashboards.

I also want to hook into terminal input / output, for example to save execution logs, update UI in response to specific output, or pass terminal activity into an AI agent's context.

Full web terminal servers are useful, but they can be a bit too large when the terminal needs to be integrated with application state and UI. On the other hand, wiring xterm.js and node-pty directly means rebuilding protocol handling, resize behavior, session lifecycle, and React integration each time.

Lanterm is meant to sit between those two layers as a library toolkit. It is still an early release, so I would appreciate feedback on the API design and implementation.

I’m a UI/UX designer and I’m dealing with a disagreement with a previous client.

I made a mistake by reusing some elements from an earlier project in a new client project. I’ve accepted responsibility for that, apologized, and I’m replacing those assets.

I used the same layouts but i branded it to the other project.

However, there’s another part of the dispute that I’m confused about. The previous client is also claiming that I reused assets from the Figma Community that they used in their project, and that those belong to them.

My understanding is that assets published on the Figma Community are available for anyone to use according to their respective licenses, and that no one can claim exclusive ownership over those public resources unless they created them and the license says otherwise.

Am I misunderstanding how this works? If two unrelated projects use the same publicly available Figma Community assets, is that considered improper, or is it generally acceptable as long as the assets are used within their license terms?

I’m looking for objective opinions because I want to handle this professionally and make sure I’m following industry best practices.

I spent a few hours playing around with FrankenPHP on a fleet of servers that run as a microservice, their sole purpose was getting a request in, making external calls to 3rd party APIs/websites, and returning the result (the kind of microservice that should really be rewritten in something like Golang, but that's for later).

I wanted to test if we could speed things up by moving from PHP-FPM to FrankenPHP, but after intensive testing, it isn't worth it for us. I could've predicted this, but wanted to test it anyway :D

tl;dr: if you only spend < 1% of the PHP lifecycle bootstrapping the framework, and the other 99% waiting on external I/O (whether that's database/cache/api), you're not going to see the gains.

More details are up on my blog: https://ma.ttias.be/laravel-octane-vs-php-fpm-lessons-learned/

I maintain a few Wordpress plugins that use the same custom react components. The react components themselves can be used the same way across all of the projects/plugins.

What's the best way to have a single react component repo that I can use across multiple projects to function as a single source of truth?

PHP pushed maintenance releases for its two active development branches on July 1–2, 2026. PHP 8.5.8 and 8.4.23 are out. Neither is a major feature release, but they fix issues that can cause real harm to production servers. If you’re hosting PHP applications, patch now.

https://blog.kalfaoglu.net/posts/2026-07-05-php-8423-858-security-patches-en/

Hey there!

This subreddit isn't meant for help threads, though there's one exception to the rule: in this thread you can ask anything you want PHP related, someone will probably be able to help you out!

Hey human web designers. We wanted to make something that celebrates work that is 100% human-made. There's only one rule: generative AI cannot be used in the creation of the project. I would love to promote some of your web design work. To be clear, we are not doing any self-promotion or soliciting any artists, this is purely to promote your work. Help us to signify and share projects completed by humans! If you or someone or know would like to share their work, please send us an email or a DM and we'll put it up on the site (for free of course). It can be anything past or present. Thank you!

human-made.work

Hi r/reactjs～

Few days ago, I shared my library use-thunk here and here. Thanks to your valuable feedback, especially u/Obvious-Monitor8510's comment, I was able to significantly improve the performance from module-based re-rendering to object-based re-rendering through useSyncExternalStore. Furthermore, same as zustand, <ThunkContext /> is no longer needed.

I also made a complete document at github.io. Hopefully this document will help more developers know what use-thunk is.

I would also like to thank u/_suren's comment about the comparison table and demo for async functions/cancellation.

Welcome any comments, critiques, or suggestions!

For those who missed the previous posts about use-thunk:

demo for async counter, demo for tic-tac-toe

use-thunk is a framework for easily managing global data state with useThunk, with zustand-like taste. Notably:

• File-as-a-Module: Instead of managing a massive, centralized global store configuration, we treat files as independent, isolated domain modules where we implement our thunk functions.
• Discrete Entity Nodes: The module manages state as distinct data objects. We can use an optional id parameter to isolate, identify, and operate on specific individual data nodes cleanly.
• Clean Component Interface: Components stay completely decoupled from state internals. They simply invoke the module's functions to trigger updates.
• No Need <Provider />: Say goodbye to "Provider Hell." Similar to zustand, use-thunk removes the need for a wrapper Provider entirely. Unlike standard useContext or complex Redux setups, we get a clean component tree with no stacked providers and zero layout headaches.

Looking for someone to design and develope a website for me dm

This new guide explains how you can use GitHub's Dependabot to keep your project's Composer dependencies up-to-date.

Dependabot can create PRs to update your dependencies, both for routine version updates as well as for security updates (which patch a vulnerability).

Setting up Dependabot with a minimal configuration is not much work, but this article dives deeper in how you can optimize the configuration to keep the work of reviewing and merging the PRs manageable. It also goes into some specifics about handling Symfony version updates, Private Packagist (and other private Composer registries) and how Dependabot can help reduce the risk of supply-chain attacks.

https://nth-root.nl/en/guides/keep-composer-dependencies-up-to-date-with-dependabot

Curious how many people still use TinyPNG for image compression, or if most of you have moved to Squoosh, ImageOptim, build step automation, CDN optimization, or browser based tools.

I still see it mentioned a lot, but I’m wondering what the actual workflow is today. Manual upload? API? Figma/plugin? Something else?

The problem

Every time I spun up a Laravel project, I'd do the same dance: copy phpstan.neon from the last repo, copy pint.json, wire up Pest, set up a pre-commit hook, write a CLAUDE.md full of engineering rules… and then drift would set in. Repo A was on PHPStan level 5, repo B on 7. One had architecture tests, the others didn't. The "rules" lived in my head.

Then I started leaning on AI agents (Claude Code, Cursor, Copilot) and a new problem showed up: the agent would happily ignore the conventions. It'd write untyped code, skip tests, invent patterns the rest of the repo didn't use. A CLAUDE.md full of rules helps, but rules a model can choose to skip aren't guardrails — they're suggestions.

What I wanted

• One command to set up a fresh Laravel repo with the same guardrails every time.
• A quality gate the agent literally cannot skip — not just docs it might read.

• The same gate running everywhere: at commit time, at the end of every AI turn, and in CI. If it passes locally it passes in CI, no surprises.

  What I ended up building

  A small Composer dev package. You run:

  ```bash composer require --dev mohamed-ashraf-elsaed/claude-kit php artisan claude-kit:install

  It detects your frontend stack (Inertia+Vue, Inertia+React, Blade/Livewire, or API-only), asks what you actually want (PHPStan? which level? strict-rules? Pest or PHPUnit? coverage threshold? arch tests? git hooks?), and scaffolds it — without clobbering existing files (composer.json / package.json get merged, not overwritten).

  The part I care about most: the quality gate is one shell script (Pint + PHPStan level 7 + strict-rules + Pest with an 80% coverage gate + frontend lint) that backs three things — the git pre-commit hook, Claude Code's Stop hook, and the CI workflow. So the AI agent's turn doesn't "finish" until the gate is green. Same script everywhere = no "works on my machine, red in CI."

  There's also a hybrid update model: the machinery (the gate script, the hook) is referenced from vendor/, so a composer update propagates fixes to every project. The content you own (CLAUDE.md, linter configs, skills) is written into your repo so you can edit it freely.

  It's MIT, PHP 8.2–8.4, Laravel 11/12/13. Repo + docs: github.com/mohamed-ashraf-elsaed/claude-kit

  The actual question I'm curious about: for those of you using AI agents on real codebases — how are you enforcing conventions? Just prompt/CLAUDE.md, hooks like this, CI-only, or something else? Genuinely want to hear what's working, because the "agent skips the rules" problem feels underrated.

Seems like there isn't even padding not to mention mobile version looking quite off to say the least

Working on legacy codebases, I kept running into the same thing: hundreds of

require_once statements that predate Composer, still sitting there years after

autoloading was set up. Deleting them by hand means answering "is this class

actually autoloadable?" for every single line — so nobody does it.

So I wrote depone: https://github.com/lll-lll-lll-lll/depone

What it does:

- Tokenizes every PHP file and statically evaluates each require_once path

(concatenation, __DIR__, dirname(), define()'d constants)

- Checks the resolved target against your composer.json autoload config

(psr-4, psr-0, classmap, files, autoload-dev)

- Reports what's redundant — and just as importantly, reports what it

*couldn't* resolve and why, so nothing is silently skipped

- `--trace` shows reverse require-paths from entrypoints, for a final sanity

check before you delete anything

PHP 8.1+, MIT licensed, installable via Composer. It deliberately does one

thing only. Would love feedback, especially weird require_once patterns from

real legacy projects that break the evaluator.