← Terug naar blog

Developer Notes: sla technische content op als code-first Markdown

· Save Team
developercodedocumentationapitemplates

Je bent aan het debuggen om 2 uur ‘s nachts. Je vindt het Stack Overflow-antwoord. Je hebt het codeblok nodig, de uitleg, en verder niets. Niet de 47 “me too”-reacties. Niet de zijbalkadvertenties. Niet de carrousel met gerelateerde vragen.

Save’s Developer-template strept alles weg behalve wat een ontwikkelaar werkelijk nodig heeft: code, API-referenties en technische context.

Het leesprobleem van ontwikkelaars

Technische content online ligt begraven onder ruis:

  • Stack Overflow — antwoorden omringd door stemmen, reacties, advertenties
  • Documentatie — belangrijke code begraven in alinea’s uitleg
  • Blogtutorials — “Laat me eerst vertellen waarom ik van JavaScript hou…”
  • GitHub READMEs — het ene codevoorbeeld dat je nodig hebt, staat 400 regels verderop
  • API-referenties — handige tabel verstopt tussen muren van proza

Hoe de Developer-template werkt

Save’s Developer-template produceert een code-first formaat met vijf secties:

  1. TL;DR — de oplossing in één zin
  2. Overzicht — technische context zonder fluff
  3. Codevoorbeelden — elk codeblok exact behouden
  4. API-referentie — tabellen met methoden, parameters, retourtypen
  5. Opmerkingen — edge cases, valkuilen, versiespecifiek gedrag

Alle codeblokken blijven behouden met syntax-highlighting-markers. Technisch jargon blijft intact. Marketingtaal wordt verwijderd.

Voorbeelduitvoer

Van een Next.js-documentatiepagina over Server Actions:

## TL;DR

Server Actions zijn async functies die op de server draaien,
gedefinieerd met 'use server'-directive, direct aanroepbaar
vanuit Client Components.

## Overzicht

Server Actions elimineren de noodzaak voor API-routes in de meeste
mutatiescenario's. Ze integreren met Next.js caching- en
revalidatiesystemen. Alleen beschikbaar in App Router.

## Codevoorbeelden

### Basis Server Action

\`\`\`typescript
'use server'

export async function createPost(formData: FormData) {
  const title = formData.get('title') as string
  await db.posts.create({ data: { title } })
  revalidatePath('/posts')
}
\`\`\`

### Gebruik in een Client Component

\`\`\`typescript
'use client'

import { createPost } from './actions'

export function PostForm() {
  return (
    <form action={createPost}>
      <input name="title" />
      <button type="submit">Aanmaken</button>
    </form>
  )
}
\`\`\`

## API-referentie

| Functie | Parameters | Retourneert |
|---------|-----------|-------------|
| revalidatePath | path: string | void |
| revalidateTag | tag: string | void |
| redirect | url: string | never |
| cookies() | geen | ReadonlyRequestCookies |

## Opmerkingen

- Server Actions moeten async functies zijn
- De 'use server'-directive kan op functie- of bestandsniveau
- Max grootte request body: 1MB standaard
- Werkt met progressive enhancement (geen JS vereist)
- Kan niet worden gedefinieerd in Client Component-bestanden

Perfecte gebruiksscenario’s

Stack Overflow-antwoorden opslaan

Krijg het geaccepteerde antwoord met codeblokken, zonder de UI-rommel. Perfect voor het bouwen van een persoonlijke code-referentiebibliotheek.

Documentatie-snapshots

Sla docs-pagina’s op voordat ze veranderen. Versioned API’s, deprecated features, migratiegidsen — houd een lokale kopie.

Tutorial-extractie

Sla programmeertutorials op gestript tot de essentiële stappen en code. Geen auteursachtergrondverhaal, geen SEO-opvulling.

API-referentiecollectie

Bouw een persoonlijk API-cheatsheet door referentiepagina’s op te slaan in developer-formaat. De tabeluitvoer is direct bruikbaar.

Context voor code-reviews

Sla relevante documentatie op bij het reviewen van onbekende code. Deel developer-geformatteerde referenties in PR-opmerkingen.

Hoe op te zetten

  1. Installeer Save uit de Chrome Web Store (gratis)
  2. Open Instellingen en selecteer “Developer 💻”
  3. Bezoek elke technische pagina — docs, Stack Overflow, tutorials
  4. Klik op Save — direct code-first Markdown
  5. Bewaar in je vault — Obsidian, VS Code-notities, GitHub wiki

Gebouwd voor ontwikkelaars, door ontwikkelaars

Stop met codeblokken handmatig kopiëren. Stop met documentatie herformatteren. Stop met door tutorial-fluff te waden om dat ene commando te vinden.

Save’s Developer-template geeft je code-first Markdown van elke technische pagina. Schoon, gestructureerd, klaar voor gebruik.

Probeer Save gratis in de Chrome Web Store