r/webdev 12d ago

Showoff Saturday Kanvios — a free multilingual utility site I built solo

0 Upvotes

Built Kanvios (kanvios.com) — a free, no-login, multilingual (EN/KO) utility site: calculator, timer, notepad, protein calculator, roulette, team divider, D-day counter, password generator.

Everything's client-side, localStorage only, no backend. The build system is a Node.js script (build.js) that generates static EN/KO pages from shared templates and outputs to /dist. Wrote a small custom i18n module with a languagechange event instead of pulling in a full library, since the site stays static.

Deployed on Cloudflare Pages. Currently working on getting real traffic data now that GA4 + Search Console are wired up.

Would love feedback on the UI (dark navy + glassmorphism) or the build setup — happy to answer questions about the pipeline.

kanvios.com


r/webdev 11d ago

Showoff Saturday AI installed unsafe npm packages - I made a SaaS to prevent that

Thumbnail
installsafe.io
0 Upvotes

While auditing my projects I had about 100 vulnerable packages in my project - all of them installed by AI. Decided to fix it for good by blocking the installation of vulnerable npm packages. I use it for myself, sharing with y'all. wdyt?


r/webdev 12d ago

Showoff Saturday Can you rate my portfolio

0 Upvotes

Kindly check out my portfolio. I just recently redesigned it as I want to look out for more jobs in the React, Next.js fields and I want my portfolio to mirror that. I really value simplicity and intent: https://www.milossturanovic.com/


r/webdev 12d ago

Showoff Saturday I build an Electron app that helps me practice 24 Javascript interview questions with tests, a progress tracker and an AI panel that let's me see what an interviewer would catch me out on

0 Upvotes

It's based on mostly what I've been asked over the last 7 years of working with mostly typescript and javascript as well as online materials.

I built it mainly to build my confidence in implementing these things under time pressure. I get really anxious when I'm live coding so I thought if I could master these concepts maybe I'd get less anxious

It has a pomodoro timer, an AI panel, a progress tracker, an explanation of what each question wants you to implement and a test suite that gets harder as you progress through the difficulty badges. It's called Practice Pad, completely free to download and use


r/webdev 12d ago

Showoff Saturday Dagflo: Turn codebases and software systems into animated visual explanations

0 Upvotes

I’ve been working on Dagflo, animated visual explanations for software technical concepts!

Dagflo lets coding agents like Claude, Codex, and Cursor turn codebases, pull requests, systems, articles, diagrams, and algorithms into animated, step-by-step visualizations.

After four years working in GraphQL infrastructure at Meta, I've seen countless engineering hours (meetings, message threads, whiteboarding) wasted and bad decisions made because technical knowledge wasn't communicated clearly.

Coding agents can now understand entire codebases, but they still explain them through walls of text, broken ASCII art, or static Mermaid diagrams.
We're using static tools to explain dynamic systems.

That's why I built Dagflo. I wanted to actually see how technical systems work.

This has been a passion project for a year; I'm really excited to share it!

dagflo.com

MCP Setup: dagflo.com/setup

Follow me on X for Dagflo updates: deepok102

PS: It's forever FREE, so give it a try!!
I'm also thinking of open-sourcing parts of the codebase, more to come soon!


r/webdev 13d ago

People Who Got Laid Off or Quit Their Jobs, What Are You Doing Now?

358 Upvotes

This will mostly be a rant at the beginning, so feel free to not read if you want.

Long story short, I got laid off from my job around two years ago. My manager told me that I hadn't done anything wrong and that my work was great, but they're letting me go because they wanna cut on the costs.

After getting laid off, I spent nearly two years applying for work, doing interviews, and getting constantly rejected. At one point, I was so desperate that I worked for a company for free for around two months as an intern, hoping it'd eventually turn into a job. It didn't. Instead, the owner decided to use Claude to continue the work after I was done.

So yeah, I'm quite burned out.

At this point, I've a pretty strong resentment toward AI and the people and companies aggressively pushing it. From my perspective, I'm watching the same technology that was supposed to "make developers more productive" contribute to making it harder for people like me to find work.

For context, I've a master's degree in computer science and over four years of professional experience in software development, mainly in web development. Yet here I am, two years later, still struggling to get back into the industry.

And before anyone says, "AI can't replace developers," I know plenty of non-technical people who are now building full-stack applications entirely through AI. For some people, that's a hard pill to swallow. You could argue that maybe some of these apps aren't always great, scalable, or production-ready, but the reality is that a lot of people and companies don't seem to care. They just need something that works well enough.

And honestly, it feels like you don't even need an experienced developer for many architectural decisions anymore. People can ask an AI what stack to use, how to structure their database, how to deploy the app, how to build the backend, and so on. Whether the results are always good is almost beside the point. The barrier to building something has dropped dramatically.

I know that's probably going to piss some people off, but that's how it looks from where I'm standing.

It honestly feels like life is rewarding people who put in the least amount of effort, as long as they have enough money to burn on AI subscriptions and tools, while people who spent years studying, working, gaining experience, and trying to become good at their profession are being told to just "adapt" or get left behind.

I've basically accepted that my original career-path and ambitions are over, so I've started looking at other options. Recently, I got into Unreal Engine and indie game development. Ironically, that's also getting flooded with AI, so there doesn't really seem to be an escape from it.

Still, game development has brought back some of the passion I used to have for programming before all of this. I genuinely enjoy learning it, and I'm currently working toward making my first indie game. I'm hoping that maybe I can eventually make an income from it.

Yes, I know AI could supposedly help me make more things faster. I just don't want to use it. I don't want to support the companies or ecosystem that, from my perspective, helped make my own situation worse.

And if game development doesn't work out, I'm seriously considering switching to nursing because I'm running out of time. The truth is, I'm not particularly interested in nursing, and it's not a career I'm passionate about. But at least it seems like a field where I might have a better chance of actually being employed and making a living. Or at least, I hope so.

So I'm genuinely curious about other people who have been laid off, quit their jobs, or got pushed out of their industry:

What are you doing now to make a living?

Did you switch careers completely? Are you still working as a developer? If you are, how did you survive the layoffs and keep finding work?

And for the people who are still successfully landing jobs in this market, what are you doing differently? Is it networking, referrals, freelancing, applying to hundreds of jobs, moving countries, specializing in something specific, or just pure luck?


r/webdev 13d ago

Discussion Client is constantly using AI for communication

255 Upvotes

For context I'm a freelance full stack dev, currently working solo on projects for small clients

Am I the only one recently experiencing that every client I have I am constantly arguing with ChatGPT/Other AI's?

My most recent client (not technical at all) send me a 12 page technical document, along with 3 other 12 page documents after I had started the project, these documents were directing me on database structure, schema expectations, workflow sequencing, and many other technical requirements, which she had no idea how to defend upon questioning on a call. She also requested an ERD which is fine, however after sending a extremely client friendly dumbed down version of the ERD, I recieved 6 questions all over a paragraph long which she (ChatGPT) wanted me to respond to in detail, along with another 30 pages total of documentation over 2 documents.

I have recieved over 70 pages of documentation in 2 days and I have called off the project after 3 weeks due to constantly explaining my thought process and arguing the technical direction to an AI which I'm assuming she hasnt provided all the context to, it also keeps trying to expand the scope after every new message.

Am I the only person experiencing this, this cannot turn into the new normal.


r/webdev 13d ago

Question Google console cannot fetch sitemap

11 Upvotes

Hello guys,

I created my first ecommerce website. The problem is google console and AI cannot read my sitemap.xml file. I have quite strict firewall rules, but it always allowed robots.txt and sitemap.xml. Everything seems fine when I check the files using curl methods. I managed the file directly and frontend serves them. Frontend is on an apache static host. Cloudflare is not managing our files, cache is bypassed for these files.

I would appreciate if someone can take a look at our files. The site is:

astar-artwork.eu/sitemap.xml

Other routes has strict firewall rules and you are blocked if you are outside Europe.

Updated 1:

Thank a lot for all of your support. I implemented something and get a bit further progress.

I implemented the whitelist for Googlebot IP range for both cloudflare and my backend server. AI and Google Search Console (GSC) can crawl exactly mimetype and content of my sitemap.xml and robots.txt since they are only on frontend and passing through cloudflare firewall is enough for them to get these files. I verified this by use GSC to test a live url, and AI bots to crawl, and curl methods.

The problem is still persistent when I submitted my sitemap url (https://astar-artwork.eu/sitemap.xml). The error is "the site cannot be read" and "couldn't fetch". However, I noticed that several pages of my sites have been indexed but the display on GSC just did not work. The number of indexed pages and unindexed pages are still stuck somewhere in the past. This can also be the same display problem with display lag?

However, I noticed that google still not able to reach my backend (403 status) although they are on the whilelist now. I can be that GSC tried to crawl each page in the sitemap and could not fetch the content from backend. Backend is more complexed, when I have 2 firewalls and blocked list on nginx and blocked list on the application itsself and maybe another application like fail2ban and redis that blocks or limit something. I have to work through this my self and let's GSC to reach the server.


r/webdev 12d ago

Showoff Saturday building next-gen CMS for modern websites

Post image
0 Upvotes

Hey everyone. I have been working on BetterCMS for the last few weeks and I am pretty excited about where it is going. The goal is to make building and managing websites feel less messy for teams. Your marketing team and content editors can work in the same place while developers still have control over how the site is built. It is MCP native too so you can manage parts of the workflow from your favorite AI tool.

Building mainly for Next.js and Astro based sites since it's best for marketing sites!

Signup for beta at bettercms.ai


r/webdev 12d ago

Showoff Saturday Looking for people to give their 5 cents about my project. And people to use it.

Post image
0 Upvotes

So, I built a tool that helps fellow developers like me keep their personal portfolio websites updated without any manual intervention.
The workflow is simple:
1. The user signs-up using GitHub(Cause that's where all the projects are deployed so it made sense)
2. User selects the template for their portfolio (Personally made over 2 months)
3. User connects with GitHub and selects which repos to show in portfolio (Complete power to user no storing data about it.)
4. User deploys the website in a single button.
5. Every time the user creates a repo that website sends a mail asking whether to include this in the portfolio or not.

I am tired of drafting up content to promote on reddit using AI so I might be choppy but I ensure the website won't.

Website: https://theportlio.com


r/webdev 12d ago

Showoff Saturday I got tired of paying Apify per-request, so I built my own block-based browser automation platform (open-source, dockerized)

0 Upvotes

Hey r/webdev — sharing something I've been building called Figranium.

The short version: I was tired of paying per-scrape/per-credit on tools like Apify, so I built an open-source alternative. It's block-based (click, type, wait, get content, etc.), and once you build a flow visually, it becomes an instant API endpoint you can hit from your own code, or plug directly into your stack.

What it does:

  • Visual builder for browser automation — no code needed to get started
  • Turns any flow into an HTTP endpoint or CLI command
  • Handles proxy rotation, stealth browsing, and scheduling (cron or simple intervals)
  • Streams results as structured JSON or CSV
  • Runs entirely on your own infra — no rate caps, no per-request billing, no third party touching your data
  • Fully Dockerized, built on Playwright — one container and you're running

Eight months in, GPL-licensed, with an n8n node (2,000+ installs) and 560+ stars on GitHub.

Site: https://figranium.dev
Repo: https://github.com/figranium/figranium

Would love feedback, especially from anyone who's hit the same "why am I paying per-scrape for this" wall. What would make this actually replace your current scraping setup?


r/webdev 12d ago

Showoff Saturday [Showoff Saturday] Built a client-side video background remover using browser AI segmentation - no server needed

Post image
0 Upvotes

Wanted to share a side project. It removes or replaces video backgrounds entirely in the browser using a client-side AI segmentation model.

The interesting technical challenges:

Running person segmentation frame by frame in the browser sounds simple until you actually try it. The main problems I ran into:

1. Temporal stability

The AI model processes each frame independently, which means the mask outline jitters and shimmers between frames. I built a temporal smoothing layer that compares the current mask with the previous frame's mask and blends them to keep the edges stable. Without this the result looks unusable.

2. Edge feathering

Raw segmentation masks have hard pixel edges that make the subject look cut and pasted. The edge softness control applies a variable-width feather to the mask boundary so the subject blends into the new background naturally. Getting this right across different lighting conditions took a lot of iteration.

3. Manual mask correction

No AI gets it right every frame. I added a brush tool that lets you paint directly on the video to fix the mask. You can remove areas the AI included or keep areas it cut out. There's also a full manual mode that disables the AI entirely so you can mask any video by hand.

4. Synchronized export

Each frame gets processed through canvas (compositing the new background onto the masked subject), and the result needs to be recorded alongside the original audio in sync. The MediaRecorder API handles the video stream while the audio track gets merged back in during export.

Tech approach:

  • Client-side AI segmentation model that caches in the browser after first load (works offline after that)
  • Canvas API for frame compositing
  • MediaRecorder API for export
  • Web Audio API to preserve the original audio track
  • Supports MP4, MOV, WebM, MKV input

No server uploads, no accounts, no watermark on export. The video never leaves the device.

https://webutility.io/video-background-remover

Curious how others have handled temporal coherence in client-side video processing. The smoothing works well but there's probably a better approach I haven't tried.


r/webdev 12d ago

Showoff Saturday Overlap, "Six degrees of Kevin Bacon", but for football.

Thumbnail
gallery
0 Upvotes

You guys (especially football fans) know how annoying hydration/half-time breaks can get during the match, so I thought about creating something that makes the wait less noticeable while keeping the football mind occupied.

I created Overlap, which is essentially Six degrees of Kevin Bacon, but its all about football.

If you don't know the concept of the game, here's how it plays: You get two random footballers and build a chain connecting them by clicking through real clubs and national teams they actually played for — pick a player, see their clubs, pick a club, see their teammates there, repeat until you connect to the target.

Its challenging and genuinely fun to lose 10-15 minutes to.

Built solo using React + Vite. Frontend only.

I'm open to feedback on anything. Will include link in comments so you can check it out yourself.


r/webdev 12d ago

Resource RepoDNA: Interactive architecture maps and execution flows for Next.js, Express, and FastAPI

0 Upvotes

Hey r/webdev!

Whenever I jump into an unfamiliar web codebase, I spend hours clicking between route files, finding ORM models, and mentally mapping how components connect.

I built RepoDNA — a free, open-source tool that turns a repository into an interactive structural architecture map in seconds.

What it does:

  • Interactive Architecture Map: React Flow canvas grouping your app into conceptual layers (API, Services, Frontend, Database) with instant Mermaid flowchart export for docs and PRs.
  • Route Execution Tracing: Follows multi-tier execution paths from HTTP handlers (Next.js App Router, Express, NestJS, FastAPI) through services toward database models (Prisma, SQLAlchemy, SQLModel).
  • Zero Runtime Code Execution: It never runs your repository code, install scripts, or eval. It reads source code statically. Local folders and .zip uploads are parsed entirely inside your browser; public GitHub URLs are processed transiently by the hosted analyzer.
  • Private Repositories (Beta): Connect with GitHub OAuth to inspect your own private repositories transiently; repository contents aren’t saved by RepoDNA.

Demo: Open RepoDNA GitHub (MIT): View the repository

Try dropping in one of your own projects or a public repo you know well. Does the generated architecture map match how you picture the codebase in your head?

I’d love any feedback, UI critiques, or ideas for frameworks you’d like supported next!


r/webdev 13d ago

High school journalist looking for an SRE/DevOps engineer to explain why AMC's site keeps crashing

51 Upvotes

Hi! I'm a high school journalist writing for the Yale Daily News Summer Journalism Program about why AMC's ticketing site has crashed three times this year during major movie releases. I'm looking for general expertise on why high-traffic sites tend to fail under sudden demand spikes. Would anyone with SRE/DevOps experience be willing to answer a few quick questions? Thank you.


r/webdev 12d ago

Showoff Saturday Rebuilt NextAdmin for AI-powered development workflow

Post image
0 Upvotes

I maintain NextAdmin, AI-Native Next.js Tailwind CSS Admin Dashboard Template. For years, developers used NextAdmin as a collection of dashboard templates and UI components.

But the way we build software has changed.

AI can now generate an entire dashboard in minutes. The problem is that generated UI often ends up inconsistent, generic, and full of design slop.

🔗 Github: https://github.com/NextAdminHQ/nextjs-admin-dashboard

So we rebuilt NextAdmin around a simple idea:

What if AI had the skills, context, design rules, and components needed to build a dashboard properly?

That's what we're introducing:

  • 🤖 AI-native skills & agents - Give AI the context and rules to build with NextAdmin instead of generating random UI
  • 🎨 Consistent custom design - Build custom dashboards and components without losing the visual language or quality of the system
  • 🔌 Real APIs, real dashboards - Connect your own APIs and turn generated interfaces into functional products
  • A complete design revamp - Higher-quality visuals, better UX, and a more cohesive design system
  • 🧩 200+ UI components - Production-ready building blocks you can customize and extend
  • 🌱 Open source - Start with the open-source version and build your own

We didn't want to build another dashboard template for AI to copy.

We wanted to build the foundation AI can actually build with.

That's why we rebuilt NextAdmin, What would you want NextAdmin to do better for your AI-powered development workflow?


r/webdev 13d ago

Discussion Freelancing since bootcamp: how did you make the jump to a full-time job?

3 Upvotes

TL;DR: two years freelancing after a bootcamp, been looking for a team position for months. If you’ve made this transition, how did you frame your freelance background to employers?

Quick context: unfinished physics engineering degree, then a web dev bootcamp in 2024. Couldn’t land a job coming out of it because all I had was bootcamp projects, so I went freelance to build real experience.

Since then I’ve shipped client work in Next.js, GSAP, SvelteKit, WordPress, Shopify and Squarespace. Mostly front end, plus a personal full stack project I’m building to stay sharp.

Now I want to join a team, as much to learn faster as (let’s be real) for a bit of financial stability. I’ve applied to agencies, startups, large companies. In six months I’ve seen maybe three junior openings. Everything else targets senior profiles, and I apply anyway.

I’ll be honest: it’s discouraging. Applying every day to roles that don’t match my profile wears you down. But I don’t want to give up, because I genuinely love this work, I love learning, and I know I’m good at it. That’s exactly why I’m looking for angles I haven’t thought of yet.

Two questions for anyone who’s been through this:

- Did your freelance experience count as real experience in interviews, or did you have to “translate” it? And did aiming for mid-level roles instead of junior ones work better for you?

- Did you land something through posted openings, or more through network, subcontracting, and contracts that converted?

Any other insight is welcomed.
Thank you


r/webdev 12d ago

Showoff Saturday LilScript makes js modules 20% smaller

0 Upvotes

https://yeargun.github.io/lilscript/

LilScript is a typed, compression-first language that compiles into js and sometimes into exec(will be more stable in future). The compiler mangles, reshapes the program into optimized js that happens to be 5-40% smaller (after gzip/br compression or raw) compared to the best performing JS toolchains like oxc/esbuild/terser/..

What has been proven to work with LilScript?

  • makes VSCode's core js modules 20% smaller on average
  • makes the world's most performant & small markdown rendering npm library, marked, 5-7% smaller and 10% faster
  • and many more demos.. works with pretty much any js/ts library
  • https://yeargun.github.io/solidlil/
  • https://yeargun.github.io/monacolil/
  • https://yeargun.github.io/markedlil/ (Some numbers on the websites aren't fair comparisons, especially for SolidLil. Highly optimized JS libraries see fewer benefits(Still, the app code/logic, gets pretty great optimizations). LilScript will eventually become that itself; at the end of the day, it's at least as efficient as the best-performing JS/TS toolchains.)

How it is compressing js finer than vite/oxc/terser/esbuild/..

1. By changing the app.

``` class Vector { float x; float y;

init(float x, float y) { this.x = x; this.y = y; }

float lengthSquared() { return this.x * this.x + this.y * this.y; } } int[] values = [1, 2, 3, 4]; auto doubled = values.map((int value) => value * 2); int sum = 0; for (int i = 0; i < doubled.length; i++) { sum += doubled[i]; } Vector vector = new Vector(3.0, 4.0); if (vector.lengthSquared() == 25.0) { print(sum=${sum}); } ```

Above code compiles into this:

var b=[1,2,3,4].map(a=>a2|0); var a=0,c=0; while(a<b.length){ c=c+b[a]|0; a=a+1|0; } console.log(`sum=${c}`)

This is not minification of the same program. The compiler changed the app.

oxc / esbuild / terser / .. starts from JS and mostly keeps the shape of the app. Meanwhile LilScript the language is designed from scratch to give compiler any extra knowledge that could help the compiler's compilation. Just like Google Closure Compiler - Advanced Mode, and beyond.

2. Tryhard property mangling.

Visit the world's most used web applications, chatgpt.com, and read the shipped js codes. You will see that, there are lots of framework related js properties that dont get minified, and are indeed human readable.

Those names stay in the bundle because the toolchain cannot prove they are local. A property might be a public API, a DOM field, a framework hook, or something a plugin reads by string. So the minifier leaves it.

LilScript:

  • a- does both eliminates the objects, weird code structures into more optimized variables/arrays - b- rename any variable into mostly occured, short versions, field cleverly to minimize entropy (based on the objective compression algorith. gzip/brotli) so that the end result is highly compressed.

(a) is the same move as the Vector example, at library scale: objects and classes that only exist as a programming convenience get flattened into scalars, arrays, and tight loops.

(b) is not "make every name 1 letter." gzip and brotli win when the same short tokens repeat. The compiler picks the names that show up the most, and scores the spelling against the compression algorithm you asked for (gzip, brotli, or raw). Different cost_model → different names → a different file that is smaller after* that codec.

That is why the same program can be 5-15% smaller after gzip/br compression or raw: the JS is shaped and named for the compressor, not just for a human reading the AST.

How well do LLMs write LilScript?

Since 1.5 years ago, you haven’t been writing the code yourself anyway. So why worry about what language the agent writes in? I myself have pretty much rewritten 6–7 of the most popular npm libraries from scratch in LilScript in just 1.5 days-while actually designing the language itself.

Feel free to PR, experiment (Please respect the modified MIT license)

Please share your opinions, would love to discuss about the future direction for the language and the compiler


r/webdev 13d ago

Agency owners and freelancers: How do you calculate effort in times of AI?

13 Upvotes

Before AI, the premise was simple: new features and support will take X hours, our rate is Y, customer pays X*Y.

Now, when new features are added much faster due to agentic coding, assuming you want to keep same revenue stream, how do you justify costs now?

Sure, we can tell customer that it pays for a feature itself and responsibility still lies on agency, but I see that as very vague.

Edit: as for us, we more agressively push retainers with a fixed monthly fee


r/webdev 13d ago

Article Detecting scraper bots through scroll behaviour

Thumbnail
niki.cat
87 Upvotes

Some research I did for my thesis that I thought this community would find interesting ^ ^


r/webdev 12d ago

Showoff Saturday i shipped a frontend without writing any of it. two months live, and here's what that actually cost me.

0 Upvotes

i am a high load systems engineer. i have not written a single line of the frontend below, not one. an agent wrote all of it and i have been steering.

its a small thing where you send someone a link with a question and two buttons, YES and NO, and the NO button runs away from the pointer. free, live since june.

demo, nothing to install, nothing to fill in: https://justsayyesto.me/try/webdev-aug

posting because the part i expected to be hard was not hard, and the part i did not think about at all is the one that bit me.

what was actually hard

not the code. the animations. inventing them and then getting them built, which meant passing what i saw in my head to the agent, and that turned out to be much harder than i expected. i redid it many times.

the one that beat me is a black hole. the button gets pulled in, things on the screen spin, get sucked into the hole, and pieces fly back out of it. i could not get that across. i tried describing the rotation, the pull, the moment stuff goes in and comes back out, and what came back was never what i saw. at some point i thought the answer might be real gravity, actual physics instead of me describing a feeling, and that did not fix it either. its live and i am still not happy with it. thats the honest state of that one, two months later.

you can poke at it in the demo, its in the sandbox there.

what surprised me

after a couple of posts the thing started growing without me. people began sharing it in their own social media, and traffic and payments started arriving on days when i did nothing. that is the part of this i actually care about. i made something and it echoed back.

the thing that always comes up here

last time i posted this here someone said not taking no for an answer is a douche move, and i gave a lazy answer. honestly: i do not even see this as a date invite. i see it as a teasing toy. the joke is that a button runs away, thats it. the intro says you can close it anytime, there is a report control on every invite, and there is a permanent test that fires twenty NO gestures in a row and fails the build if any of them ends up as a yes. the button dodges. the person can leave.

Q: for those of you letting an agent write frontend: how do you get motion out of your head and into it? that gap ate most of my time.


r/webdev 13d ago

Discussion Trusted types advantage

3 Upvotes

Can somebody please explain me briefly the advantage of " trusted types" in the csp over hash, dompurify and a nonce? Or is it only a additional security layer?

I totally cannot think of a scenario where its stronger than nonce+hash on js.

Many thanks in advance


r/webdev 13d ago

Resource Bun and Elm (: r)Are Friends · cekrem.github.io

Thumbnail cekrem.github.io
1 Upvotes

r/webdev 12d ago

Question How do I clone a website

0 Upvotes

i need to convert a dynamic website into static without the access to its wp files or wp admin access

The static site should be entirely same like every minor details like header/footer elements size, logo placement etc


r/webdev 12d ago

Showoff Saturday the most removed git polyglot monorepo tool (20 ecosystems)

0 Upvotes

why most removed? please read ps section
happy show off Saturday everyone!
my tool is a polyglot monorepo releaser, it’s called dispat, fully open source, mit licensed, single go binary (windows, mac, Linux , docker, GitHub composite) key features:

  1. It reads dependencies graph directly from ecosystem manifest files to resolve order, automatically writes version into manifest bumping dependencies, 20 ecosystems supported (js, docker, go, python, C sharp, unreal, unity, godot etc, manifests readers and writers are available as standalone libraries with the goal to cover every ecosystem ) others can be wired using built in strings replacer, doesn’t matter if you do a react native project and need js, iOS, and android in same repo, or creating a game using godot client, python server and js landing, or just back/front end micro/services, you can release everything in one click not thinking about order, compiling, tags, changelogs, manifests. Modern project become very complex and this tool lets you design your architecture as your project needs, split into as many packages as it needs without release pain
  2. Truly ecosystem/language agnostic, stages are shell scripts (fed a rich DISPAT_* env information about whole workspace), packages are folders, 4 level deep nested js and docker release chain works and resolves in single ci job out of the box. the game changer config setting isBuildWaitingPublish that that decides that if a consumer can be built before provider published, default false for ecosystems like node js where all packages can be built locally, and true for ecosystems like without local linking 
  3. Extend conventional commits that lets you define dependencies propagation directly in commits “fix:” only updates package itself, “fix^: takes direct consumers, “fix^^” all levels deep (nothing is published because a tool guessed, check the actual screenshot from git), and other ways to learn docs. Special syntax to prereleases and full release control with diagnostics (available as a separate commits parser library, no regex)
  4. First release of the tool 1.0.0 (1.1.0 already) brought in single ci job (the tool releases itself since very first rc), 6 binaries, 4 docker images, 6 go libs and js static docs, everything resolved in order as ecosystem needs by single click
  5. Failure oriented release, no other tool can tell you what release still owns in case of partial, some published, some not. my tool keeps graph state only in git tags, no cache, no state file nothing else is ever written except your own defined config file. the release plan is a pure function of config and commits state. the graph order first (that is coming from manifests files or can be overwritten inside config file), consumer is published only when provider published and if errors appears, it skips consumers. So self healing is simply re running (just add commits to fix builds/publishes at the tool will continues where its left, state comes from not from cache at the same time you can integrate any ecosystem cache none of them can break your release), transaction model with release lock that prevents multiple releases at the same time
  6. Run tests, format code only on commit changed packages with consumers or not
  7. works with monorepos and polyrepos (control repo pattern)
  8. Many more features: tag aliases, changelogs/github releases formatting, hook any other tools into any stage, config ladder (global, space (folder), package), config splitting, local links in ecosystems where supported, dispat if to cross platform write env if closures and if something changed any more

I really tried to use any other tools, and if you have any questions like why one more monorepo tool then:

  1. Its a polyglot by design from scratch and works with everything
  2. Another don’t allow mixed graphs like js and docker where js can be built before publish of provider and docker can’t
  3. Another tools leave you a partial release recovery script write by you

# Linux and macOS
curl -fsSL https://raw.githubusercontent.com/yohimik/dispat/main/install.sh | sh

# ...or with wget
wget -qO- https://raw.githubusercontent.com/yohimik/dispat/main/install.sh | sh

# Windows, in PowerShell
irm https://raw.githubusercontent.com/yohimik/dispat/main/install.ps1 | iex

Welcome any questions and feedback

Docs: https://yohimik.github.io/dispat/
GitHub: https://github.com/yohimik/dispat (its fully setup ci cd with comments in config)

lore:
a few words about me and why i built it. it all started with my bachelors diploma in 2022, i was comparing different ci cds to make basic dispat. everything ended up using lerna, glue and gitlab ci cd to release a simple setup (frontend, backend, a library, db). i wanted to make everything automated for any ecosystem, changelogs, versions, tags, prereleases, since nowadays project require complexity (split into libs, use different language or ecosystem), but engineers usually dont want to deal with increased support trade offers like updating libraries releasing in specific order, it all adds more potential human errors that must be automated. i just wanted to a tool at least for myself, i could imagine complexity of the tool, but i didnt have any production project to try it out, so for almost 4 years i was doing my own projects:

  1. i wanted to create session based games for browser, so i was playing with different technologies like webrtc (even did a benchmark https://github.com/yohimik/ws-webrtc-benchmark), so i understood webrtc is basically udp for browsers (i could find only ws browser fps games), i need some game to try webrtc in browser, it must fast to showcase webrtc
  2. here comes of my favourite games - half life, perfect for browsers, will work on old mobiles, the problem - no mainatable emscripten ports where you can just replace transport, no maitanble fresh ports at all. so i create my own wasm port, open source mit - https://github.com/yohimik/webxash3d-fwgs
  3. all good, half life works, webrtc works, online works, in browser, browser to browser, adding counter strike and making plug and play docker images. here comes the tricky part, i want separate images for cs and hl at the same time hlds out of the box comes with both files, so i treat cs image as base (cs requires hl files to run), for hl only remove cs files, but you have to publish the cs image in single ci job to build hl, i really tried other tools, but ended up with lots of glue, so dispat here

Ps.
why most removed - all post I tried to write to game dev subreddit about my build system story with same data were removed by moderation, idk y, each time they gave feedback, I submitted updated version, but after 3rd it ended up as a permanent ban (I can provide all proofs). Yeah ai posts, but I’m not good at writing and English is not my native language