From Idea to Resolution

Tl;DR

Thoughts after one year of vibe coding.

+++ EayP v3

Intro

I stopped copy pasting from Gemini web UI and start using codex CLI, gemini cli and so on around one year ago.

Later I tried windsurf, cursor and finally antigravity.

Lately, Im paying claude PRO and im quite happy with the decision.

#irm https://claude.ai/install.ps1 | iex
claude install #it recently migrated from npm

You arent using this yet to create technical breakdowns and architectural design records?

The key is to think of prompting as a flow:

Goal -> Context -> Instruction -> Contrains -> Output Format

As we say here, its all about the AI mindset.

given the pbip exported files and the data-lineage.md, can you put together a data-sources.md with all the the sources listed one by one, their paths and what data do they contain based on the context you have? some use case would also be great as per the dashboard context 

The productivity change and learnings has been massive.

Who could have guessed: the more repetitions you do

the more architecture you understand

and the more predictable things become

This is when I started moving from streamlit, to pure web apps.

Key Concepts for solving problems

1. Repetitions

flowchart LR
    %% Styles
    classDef state fill:#E3F2FD,stroke:#1565C0,stroke-width:2px,color:#0D47A1;
    classDef start fill:#43A047,stroke:#1B5E20,stroke-width:2px,color:white;

    %% Nodes
    Start((Start)):::start --> More
    More(Doing MORE):::state
    Better(Doing BETTER):::state
    Newer(Doing NEWER):::state

    %% Internal Feedback Loops (The Grind)
    More -- "Scale Up" --> More
    Better -- "Refine" --> Better
    Newer -- "Test" --> Newer

    %% The Progression Journey
    More -- "Capacity Hit" --> Better
    Better -- "Optimized" --> Newer
    
    %% The Upward Spiral
    Newer -- "New Baseline" --> More

Because with repetitions you go from a so so vibed coded web/app to others that can really impress.

2. Where are you bringing value?

Net Profit and the value equation

$$ P \times V \times GM \times OM \times IF \times T $$

Make P*V go up!

graph LR
    %% 1. The Split
    Start[Define] -->|Why| B[BRD]
    Start -->|What| C[FRD]
    Start -->|How| D[PRD]

    %% 2. The Join
    B & C & D --> E(Clarify)

    %% 3. The Linear Flow
    E --> F[Development Plan]
    F --> G[Finished PoC]

    %% Styling
    style G fill:#f96,stroke:#333,stroke-width:4px
    style Start fill:#bbf
    style F fill:#e1f5fe

Remember about defining OoS, avoid scope creep!

B2C is extremely sensitive to the ,security/guarantees’ part

3. Value stream mapping VSM x Pareto

Because 80% of what you do is non-sense for your client

Just ship de 20% that matters, for the 20% of clients that value it the most

flowchart LR
    %% --- Styles ---
    classDef free fill:#E8F5E9,stroke:#2E7D32,stroke-width:2px,color:#1B5E20;
    classDef low fill:#FFF9C4,stroke:#FBC02D,stroke-width:2px,color:#F57F17;
    classDef mid fill:#FFE0B2,stroke:#F57C00,stroke-width:2px,color:#E65100;
    classDef high fill:#FFCDD2,stroke:#C62828,stroke-width:2px,color:#B71C1C;

    %% --- Nodes ---
    L1("Free Content
(Blog/YT $0)"):::free
    L2("DIY
(Templates / Platform) $"):::low
    L3("Done With You
(Consulting) $$"):::mid
    L4("Done For You
(Services) $$$"):::high

    %% --- Connections ---
    L1 --> L2
    L2 --> L3
    L3 --> L4

Yea, avoid the 80% of clients that will give you the most headaches while paying the least.

4. Value is subjective: for you, your time is not a commodity, your client money is.

This implies that given a product, client A is as good as client B.

For a fee: you can create a loop to iterate across N clients via ads.

5. Risk avoidance is huge in us.

Particularly for B2C » B2B (business tend to calculate ROIs and try to assign % somehow…)

when was the last time that you account for your human capital (vital energy as a function of your time alive) getting depleted each day?

Is estability seeking killing our real nature?

what are our real needs?

how would we behave if they’d be satisfied?

See how this great prompt for UI blueprint applied also to threebodies here and…around the power law :)

Because there are several ways to vibe code, but some prompts + BRDs are gold

git clone https://github.com/JAlcocerT/poc
#cd aegis-freedom  #savings+monetary system = partial/total freedom
#this is not the rstocks / retirement facts, but somehow similar :)

Thats how simple it is https://aegis-freedom.pages.dev/

are we numb?

are we so asleep to be avoiding so hard to put few k$ into ads?

ops, these questions are out of the scope for this post :)

6. Risk sensitivity and persistance seem to be good indicators of success

persistance: going into the same direction consistently, no matter what

7. The product tattoo: diminishing returns and pareto.

Conclusions

If you are one and have excuses to create: find another ones.

Specially while ai monthly subs are giving so much inference for the current price.

Come on, Codex is even as desktop for windows.

Now the blockers are in the acceptance of new ideas flowing to main/prod branch.

How can we trust the AI to write the code and pretend that we will be the ones reviewing?

As illustrated brilliantly by this article and: https://background-agents.com/

The site UI/X and how it makes you go through the story is amazing!

Questions like the ones you can have solved:

Consulting Services

Consulting - Service for the Ones with Questions

DIY via ebooks

Distilled knowledge for the ones who want to create step by step

What I have shipped

Ive shipped and learn many what to do and several NOT to do.

They all plugged into these 2 lovely equations:

$$ P \times V \times GM \times OM \times IF \times T $$

The value equation

What needs to happen or which % do people assign to some obvious offers? or why do they go for clear non-go ones?

Dont explain it from rationallity or you’ll be lost. Consider psyc!

From where you can create a tier of services with some sort of sense: yea, the value ladder!

git clone /slubnechwile
#3bodies OSS
#slider crank OSS / mbsd
#git clone /VideoEditionRemotion
#git clone /poc #with prompts and ctas :)
#git clone /jalcocertech-services #all in one repo :)
#https://webaudit.jalcocertech.com/
#entreagujaypunto eaypv3

Some videos…specially after the mech and remotion tinker sessions:

Among all of them, I think that instead of doing mass produced via matplotlib or a remotion one script sizes all…

its better to take the effort tokens and ask claude code for specific comments of what we are visualizing: like this example with gold

Let it be CC + nanobanana

Or CC with google stitch 2.0:

Life is short.

So is your audience attention.

Dont waste it with the wrong website:

flowchart LR
    %% --- Styles ---
    classDef free fill:#E8F5E9,stroke:#2E7D32,stroke-width:2px,color:#1B5E20;
    classDef low fill:#FFF9C4,stroke:#FBC02D,stroke-width:2px,color:#FBC02D;
    classDef mid fill:#FFE0B2,stroke:#F57C00,stroke-width:2px,color:#F57C00;
    classDef high fill:#FFCDD2,stroke:#C62828,stroke-width:2px,color:#C62828;
    classDef bridge fill:#E3F2FD,stroke:#1565C0,stroke-width:3px,color:#0D47A1;

    %% --- Nodes ---
    L0("Free Content
($0)"):::free
    L1("AuditMagnet 🛡️
(Free Web Audit )"):::free
    L11(" Blog/Youtube"):::free
    L12(" ebooks"):::free
    L2("DIY
(Optimization Guides) $"):::low
    L3("Done With You
(Consulting) $$"):::mid
    L4("Done For You
(Full Service) $$$"):::high
    L44("GenBI
Shopify PoC"):::bridge
    L45("Real Estate
Funnel Bot"):::bridge


    %% --- Connections ---
    L0 --> L1
    L0 --> L2
    L0 --> L11
    L0 --> L12
    L2 --> L3
    L3 --> L4
    L44 -->|Enhancing| L4
    L45 -->|Enhancing| L4

Anyways, make sure to go through the business ideas checklist and as cheap as code is now, make sure you ask questions before you start prompting.

For me, lately its all about this greenfield prompt or this other tech stack.

Combined with the best BRD / PRD / FRD / Project Charter / CRQ practices ever…

You can build your PoC in an afternoon and the MVP in a week with some sense

When interested on creating with potential financial incentives, focus on prospecting, then define a proper WHY and WHAT.

If you just care about creating for the sake of it / tinkering, you are good to go with the why and what to get a working how.

In that case, just enjoy dont expect money to flow.

Around those concepts, Ive been playing with:

whois leadarchitect.org| grep -i -E "(creation|created|registered)"
#nslookup leadarchitect.org
dig slubnechwile.com
dig entreagujaypunto.com

Some of which I will let go if they dont kick off before the domain renewal.

The good thing about ’not caring’ about people churning, is that you can white-label solutions with the expertise you have adquired building those underpriced solutions:

#https://realestate.jalcocertech.com
#https://genbi.jalcocertech.com
#https://webaudit.jalcocertech.com/
#mbsd...
# f1...

#programmatic uptime kuma monitoring of my services

Most likely objections are not about pricing, but perceived value.

Make sure to understand that selling is 20% about the thing and 80% about people and psyco

It just the right time to admit that wrong client selection has consequences and despite paying with my own pocket B2C tend to see costs (instead of potential ROI when a problem is solved for B2B) and chances of churning are high.

You should now the drill by now: attract, convert, deliver.

If you got here from a technical background: dont overcomplicate

You’ll probably know how to deliver

And most likely dont know how to attract and convert.

Thats why some people have 10k ig followers - 2k in a telegram group - and 200 into a smaller tg group ready to buy them a vibe/life mentory which gross delivery is 1k+ $/h (only for 30 lucky selected ppl who can pay 500$ each for 10h, ofc)

Pretty interesting value proposition, ah?

It works, our opinion doesnt really matter.

Curioous about how does my value ladder looks like as of today?

flowchart LR
    %% --- Styles ---
    classDef free fill:#E8F5E9,stroke:#2E7D32,stroke-width:2px,color:#1B5E20;
    classDef low fill:#FFF9C4,stroke:#FBC02D,stroke-width:2px,color:#FBC02D;
    classDef mid fill:#FFE0B2,stroke:#F57C00,stroke-width:2px,color:#F57C00;
    classDef high fill:#FFCDD2,stroke:#C62828,stroke-width:2px,color:#C62828;

    %% --- Nodes ---
    L0("Free Content
($0)"):::free
    L1("AuditMagnet 🛡️
(Free Web Audit )"):::free
    L11(" Blog/Youtube"):::free
    L12(" ebooks"):::free
    L2("DIY
(Optimization Guides) $"):::low
    L3("Done With You
(Consulting) $$"):::mid
    L4("Done For You
(Full Service) $$$"):::high

    %% --- Connections ---
    L0 --> L1
    L0 --> L2
    L0 --> L11
    L0 --> L12
    L2 --> L3
    L3 --> L4

Interesting Articles

• https://knowledge.insead.edu/strategy/who-killed-nokia-nokia-did
  • Old post about N95 vs iphone: https://forocoches.com/foro/showthread.php?t=995246
• https://newsletter.pragmaticengineer.com/p/ai-tooling-2026

This all relates with speed and stability of the upcoming software.

Whats left for us?

Coding is gone.

Mech engineering is gone.

Enabling others via showing / teaching / on boarding ?

Simple with markdown and notebookLLM.

Marketing?

All those customer life cycle value, ROIs, hypothesis formation of:

• How each factor affects peformance (conversions)? What contributes more to the win? what are the relatibe contributions? paid ads? promotions? webinars?

• Data exploration: base line & seasonality/holidays, external factors like salary week,competitor activities or internal activieis like channel distribution, product changes…

All that need to know important variables for the business. Gone.

I mean…you can do them assisted by AI.

FAQ

My favourite prompts

I tried to migrate eayp from HUGO v1 to v2a/b here.

The World Still Belongs To The Builders.

As im proving with the eayp v3 at this section.

Wanted to collect the best UI prompts I got to see: bc there are some things that all landing pages should have, like proper ATF.

Bc creating with AI in your SDLC workflow is about the right procedural knowledge from now:

I need Landing Page based with a cool and modern UI.

Create also a makefile with the following commands:

* `make help` - Show available commands
* `make install` - Prepare the dependencies for local development
* `make dev` - Run development server

Create the `z-development-plan.md` with independent and testable phases that can be completed sequentially.

When it is completed, create a `z-walkthrough.md` with the steps to deploy the application and what each part of the tech stack does on a high level to bring the features to life.

The full copy od the landing, has to be goberned by a single `site.md` file.

Consider adding a Terms of Service / **terms and conditions and privacy policy** to the website, which will be governed by two separated markdown files.

Add also a faq section, that instead of been controlled via a json, lets have it controlled as per the frontmatter and content of separated markdown files inside the folder `faq`. 

#sudo apt install gh
gh auth login
#gh repo create make-xyz --private --source=. --remote=origin --push
    
git init && git add . && git commit -m "Initial commit: simple landing website" && gh repo create make-xyz --private --source=. --remote=origin --push
###du -sh .
#docker stop $(docker ps -a -q) #stop all
#docker system df

# Cinematic Landing Page Builder

## Role

Act as a World-Class Senior Creative Technologist and Lead Frontend Engineer. You build high-fidelity, cinematic "1:1 Pixel Perfect" landing pages. 

Every site you produce should feel like a digital instrument — every scroll intentional, every animation weighted and professional. Eradicate all generic AI patterns.

## Agent Flow — MUST FOLLOW

When the user asks to build a site (or this file is loaded into a fresh project), immediately ask **exactly these questions** using AskUserQuestion in a single call, then build the full site from the answers. Do not ask follow-ups. Do not over-discuss. Build.

### Questions (all in one AskUserQuestion call)

1. **"What's the brand name and one-line purpose?"** — Free text. Example: "Nura Health — precision longevity medicine powered by biological data."
2. **"Pick an aesthetic direction"** — Single-select from the presets below. Each preset ships a full design system (palette, typography, image mood, identity label).
3. **"What are your 3 key value propositions?"** — Free text. Brief phrases. These become the Features section cards.
4. **"What should visitors do?"** — Free text. The primary CTA. Example: "Join the waitlist", "Book a consultation", "Start free trial".

---

## Aesthetic Presets

Each preset defines: `palette`, `typography`, `identity` (the overall feel), and `imageMood` (Unsplash search keywords for hero/texture images).

### Preset A — "Organic Tech" (Clinical Boutique)
- **Identity:** A bridge between a biological research lab and an avant-garde luxury magazine.
- **Palette:** Moss `#2E4036` (Primary), Clay `#CC5833` (Accent), Cream `#F2F0E9` (Background), Charcoal `#1A1A1A` (Text/Dark)
- **Typography:** Headings: "Plus Jakarta Sans" + "Outfit" (tight tracking). Drama: "Cormorant Garamond" Italic. Data: `"IBM Plex Mono"`.
- **Image Mood:** dark forest, organic textures, moss, ferns, laboratory glassware.
- **Hero line pattern:** "[Concept noun] is the" (Bold Sans) / "[Power word]." (Massive Serif Italic)

### Preset B — "Midnight Luxe" (Dark Editorial)
- **Identity:** A private members' club meets a high-end watchmaker's atelier.
- **Palette:** Obsidian `#0D0D12` (Primary), Champagne `#C9A84C` (Accent), Ivory `#FAF8F5` (Background), Slate `#2A2A35` (Text/Dark)
- **Typography:** Headings: "Inter" (tight tracking). Drama: "Playfair Display" Italic. Data: `"JetBrains Mono"`.
- **Image Mood:** dark marble, gold accents, architectural shadows, luxury interiors.
- **Hero line pattern:** "[Aspirational noun] meets" (Bold Sans) / "[Precision word]." (Massive Serif Italic)

### Preset C — "Brutalist Signal" (Raw Precision)
- **Identity:** A control room for the future — no decoration, pure information density.
- **Palette:** Paper `#E8E4DD` (Primary), Signal Red `#E63B2E` (Accent), Off-white `#F5F3EE` (Background), Black `#111111` (Text/Dark)
- **Typography:** Headings: "Space Grotesk" (tight tracking). Drama: "DM Serif Display" Italic. Data: `"Space Mono"`.
- **Image Mood:** concrete, brutalist architecture, raw materials, industrial.
- **Hero line pattern:** "[Direct verb] the" (Bold Sans) / "[System noun]." (Massive Serif Italic)

### Preset D — "Vapor Clinic" (Neon Biotech)
- **Identity:** A genome sequencing lab inside a Tokyo nightclub.
- **Palette:** Deep Void `#0A0A14` (Primary), Plasma `#7B61FF` (Accent), Ghost `#F0EFF4` (Background), Graphite `#18181B` (Text/Dark)
- **Typography:** Headings: "Sora" (tight tracking). Drama: "Instrument Serif" Italic. Data: `"Fira Code"`.
- **Image Mood:** bioluminescence, dark water, neon reflections, microscopy.
- **Hero line pattern:** "[Tech noun] beyond" (Bold Sans) / "[Boundary word]." (Massive Serif Italic)

---

## Fixed Design System (NEVER CHANGE)

These rules apply to ALL presets. They are what make the output premium.

### Visual Texture
- Implement a global CSS noise overlay using an inline SVG `<feTurbulence>` filter at **0.05 opacity** to eliminate flat digital gradients.
- Use a `rounded-[2rem]` to `rounded-[3rem]` radius system for all containers. No sharp corners anywhere.

### Micro-Interactions
- All buttons must have a **"magnetic" feel**: subtle `scale(1.03)` on hover with `cubic-bezier(0.25, 0.46, 0.45, 0.94)`.
- Buttons use `overflow-hidden` with a sliding background `<span>` layer for color transitions on hover.
- Links and interactive elements get a `translateY(-1px)` lift on hover.

### Animation Lifecycle
- Use `gsap.context()` within `useEffect` for ALL animations. Return `ctx.revert()` in the cleanup function.
- Default easing: `power3.out` for entrances, `power2.inOut` for morphs.
- Stagger value: `0.08` for text, `0.15` for cards/containers.

---

## Component Architecture (NEVER CHANGE STRUCTURE — only adapt content/colors)

### A. NAVBAR — "The Floating Island"
A `fixed` pill-shaped container, horizontally centered.
- **Morphing Logic:** Transparent with light text at hero top. Transitions to `bg-[background]/60 backdrop-blur-xl` with primary-colored text and a subtle `border` when scrolled past the hero. Use `IntersectionObserver` or ScrollTrigger.
- Contains: Logo (brand name as text), 3-4 nav links, CTA button (accent color).

### B. HERO SECTION — "The Opening Shot"
- `100dvh` height. Full-bleed background image (sourced from Unsplash matching preset's `imageMood`) with a heavy **primary-to-black gradient overlay** (`bg-gradient-to-t`).
- **Layout:** Content pushed to the **bottom-left third** using flex + padding.
- **Typography:** Large scale contrast following the preset's hero line pattern. First part in bold sans heading font. Second part in massive serif italic drama font (3-5x size difference).
- **Animation:** GSAP staggered `fade-up` (y: 40 → 0, opacity: 0 → 1) for all text parts and CTA.
- CTA button below the headline, using the accent color.

### C. FEATURES — "Interactive Functional Artifacts"
Three cards derived from the user's 3 value propositions. These must feel like **functional software micro-UIs**, not static marketing cards. Each card gets one of these interaction patterns:

**Card 1 — "Diagnostic Shuffler":** 3 overlapping cards that cycle vertically using `array.unshift(array.pop())` logic every 3 seconds with a spring-bounce transition (`cubic-bezier(0.34, 1.56, 0.64, 1)`). Labels derived from user's first value prop (generate 3 sub-labels).

**Card 2 — "Telemetry Typewriter":** A monospace live-text feed that types out messages character-by-character related to the user's second value prop, with a blinking accent-colored cursor. Include a "Live Feed" label with a pulsing dot.

**Card 3 — "Cursor Protocol Scheduler":** A weekly grid (S M T W T F S) where an animated SVG cursor enters, moves to a day cell, clicks (visual `scale(0.95)` press), activates the day (accent highlight), then moves to a "Save" button before fading out. Labels from user's third value prop.

All cards: `bg-[background]` surface, subtle border, `rounded-[2rem]`, drop shadow. Each card has a heading (sans bold) and a brief descriptor.

### D. PHILOSOPHY — "The Manifesto"
- Full-width section with the **dark color** as background.
- A parallaxing organic texture image (Unsplash, `imageMood` keywords) at low opacity behind the text.
- **Typography:** Two contrasting statements. Pattern:
  - "Most [industry] focuses on: [common approach]." — neutral, smaller.
  - "We focus on: [differentiated approach]." — massive, drama serif italic, accent-colored keyword.
- **Animation:** GSAP `SplitText`-style reveal (word-by-word or line-by-line fade-up) triggered by ScrollTrigger.

### E. PROTOCOL — "Sticky Stacking Archive"
3 full-screen cards that stack on scroll.
- **Stacking Interaction:** Using GSAP ScrollTrigger with `pin: true`. As a new card scrolls into view, the card underneath scales to `0.9`, blurs to `20px`, and fades to `0.5`.
- **Each card gets a unique canvas/SVG animation:**
  1. A slowly rotating geometric motif (double-helix, concentric circles, or gear teeth).
  2. A scanning horizontal laser-line moving across a grid of dots/cells.
  3. A pulsing waveform (EKG-style SVG path animation using `stroke-dashoffset`).
- Card content: Step number (monospace), title (heading font), 2-line description. Derive from user's brand purpose.

### F. MEMBERSHIP / PRICING
- Three-tier pricing grid. Card names: "Essential", "Performance", "Enterprise" (adjust to fit brand).
- **Middle card pops:** Primary-colored background with an accent CTA button. Slightly larger scale or `ring` border.
- If pricing doesn't apply, convert this into a "Get Started" section with a single large CTA.

### G. FOOTER
- Deep dark-colored background, `rounded-t-[4rem]`.
- Grid layout: Brand name + tagline, navigation columns, legal links.
- **"System Operational" status indicator** with a pulsing green dot and monospace label.

---

## Technical Requirements (NEVER CHANGE)

- **Stack:** React 19, Tailwind CSS v3.4.17, GSAP 3 (with ScrollTrigger plugin), Lucide React for icons.
- **Fonts:** Load via Google Fonts `<link>` tags in `index.html` based on the selected preset.
- **Images:** Use real Unsplash URLs. Select images matching the preset's `imageMood`. Never use placeholder URLs.
- **File structure:** Single `App.jsx` with components defined in the same file (or split into `components/` if >600 lines). Single `index.css` for Tailwind directives + noise overlay + custom utilities.
- **No placeholders.** Every card, every label, every animation must be fully implemented and functional.
- **Responsive:** Mobile-first. Stack cards vertically on mobile. Reduce hero font sizes. Collapse navbar into a minimal version.

---

## Build Sequence

After receiving answers to the 4 questions:

1. Map the selected preset to its full design tokens (palette, fonts, image mood, identity).
2. Generate hero copy using the brand name + purpose + preset's hero line pattern.
3. Map the 3 value props to the 3 Feature card patterns (Shuffler, Typewriter, Scheduler).
4. Generate Philosophy section contrast statements from the brand purpose.
5. Generate Protocol steps from the brand's process/methodology.
6. Scaffold the project: `npm create vite@latest`, install deps, write all files.
7. Ensure every animation is wired, every interaction works, every image loads.

**Execution Directive:** "Do not build a website; build a digital instrument. Every scroll should feel intentional, every animation should feel weighted and professional. Eradicate all generic AI patterns."

The web audits …were fine

but the edits and uploads…not there.

So for the v3…

I just played around the forked oss foldergram project:

git clone /foldergram

Whats Open DevOps?

Ive heard this year about DORA.

Which maps with Lean (via VSM) and DevOps: https://www.atlassian.com/devops/frameworks/dora-metrics

DORA is a metrics framework (not a rigid toolset)—a set of four standard KPIs from Google’s DevOps Research and Assessment team to benchmark software delivery.

DORA = how good are companies at shipping software?

There are two key clusters of data inside DORA: Velocity and Stability.

The DORA framework is focused on keeping them in context with each other, as a whole, rather than as independent variables, making the data more challenging to misinterpret or abuse.

Within velocity are two core metrics:

• Deployment Frequency (DF): Number of successful deployments to production, how rapidly is your team releasing to users?
• Lead Time for Changes (LTC): *How long does it take from commit to the code running in production?

This is important, as it reflects how quickly your team can respond to user requirements.

Stability is composed of two core metrics:

• Change Failure Rate (Change Success Rate): How often are your deployments causing a failure?
• Median Time to Restore Service (MTTR): How long does it take the team to properly recover from a failure once it is identified?

However, MTTR is replaced by Failed Deployment Recovery Time from the 2023 DORA report.

This metric measures the finish time of a deployment to the resolution of the incident caused by the deployment.

• https://devlake.apache.org/assets/images/dora-intro-e3847646d8dbe47220e6c8347ab14f7b.png

DevLake: Incubating Apache project for SDLC metrics (e.g., DORA), data ingestion/visualization from dev tools; uses Go, Grafana; no relation to big data storage.

Delta Lake: Open-format (Databricks-led, Apache-compatible via Spark) for ACID transactions, time travel in data lakes; unrelated to engineering metrics.

Argo and Jenkins?

If you care enough about DORA, speed stability, doing more for your clients…

For sure you have heard about CI/CD, particularly jenkins and argo :)

Think of it this way: Jenkins is the builder, and Argo CD is the delivery driver who makes sure the house stays exactly as the blueprint intended.

What is Argo CD?

Argo CD is a declarative, GitOps continuous delivery (CD) tool specifically built for Kubernetes.

The core idea is simple: You define what your application environment should look like (the “Desired State”) in a Git repository. Argo CD monitors that repository and compares it to what is actually running in your Kubernetes cluster (the “Live State”).

• Syncing: If you change your code in Git, Argo CD automatically updates Kubernetes to match.
• Self-Healing: If someone accidentally deletes a component in Kubernetes, Argo CD notices the “drift” and automatically recreates it to match Git.

Does it relate to Jenkins?

Yes, but they aren’t competitors; they are usually teammates.

While Jenkins is a “do-it-all” automation engine, it wasn’t originally built for the cloud-native, containerized world of Kubernetes. Here is how they relate:

1. The Hand-off (The CI/CD Pipeline)

In a typical workflow, Jenkins handles the Continuous Integration (CI) and Argo CD handles the Continuous Delivery (CD).

• Jenkins: Takes your source code, runs tests, and builds a Docker image. It then pushes that image to a registry and updates a YAML file in your Git repo.
• Argo CD: Sees that the YAML file has changed and pulls that new Docker image into your Kubernetes cluster.

2. Push vs. Pull

• Jenkins (Push Model): Jenkins usually “reaches out” and tells Kubernetes to run a command. This requires Jenkins to have high-level security credentials for your cluster.
• Argo CD (Pull Model): Argo CD sits inside your cluster. It watches Git and “pulls” changes in. This is generally considered more secure and stable for Kubernetes environments.

The Bottom Line: Use Jenkins to turn your code into an image, and use Argo CD to put that image into production.

Both can be helpful for HFAD which relate with DORA metrics!!

A great article: You rolled out coding agents. Engineers are faster. PRs flood in.

Yet, cycle time doesn’t budge.

DORA metrics stored at DevLake are flat.

The backlog grows.

• https://background-agents.com/
• https://www.latent.space/p/reviews-dead

And an awsome web UI/X that now you can simply clone with google stitch

• https://blog.google/innovation-and-ai/technology/developers-tools/full-stack-vibe-coding-google-ai-studio/
• https://blog.google/innovation-and-ai/models-and-research/google-labs/stitch-ai-ui-design/
• https://stitch.withgoogle.com/ - Figman but better
• https://github.com/pbakaus/impeccable - The design language that makes your AI harness better at design.
• https://aistudio.google.com/app/apps?source=

Just in case you dont want to vibe code in the old fashion way from last month.

I guess…Web devs be like:

Well, at least those that dont work for the public sector and bill 250k for a website

Isnt it this already CONTEXT ENGINEERING?

EayP v3

This setup was not enough:

Lately I got to know:

git clone https://github.com/JAlcocerT/foldergram

Some people still have my free time to get this kind of things running:

Yep, im cooking some upgrades: https://ebooks.jalcocertech.com/books/servers/

git clone https://github.com/JAlcocerT/Home-Lab
lazydocker
docker system df
#docker stop $(docker ps -a -q) #stop all
#docker system prune -a

It plays very well together with filebrowser:

#move the local photos to your server
#spin the stack

How hard would be to make finally a one time editable, cool, photo gallery that superseeds eayp HUGO v1 and both v2 failed trials at the end of last year?

Well…its just a few CLI’s away :)