46elks Workshop 2026

Bygg webbsidor med AI

Välj ett LLM-kodverktyg, få en egen server, peka din domän — och bygg något. Allt du behöver finns här.

Välj ditt verktyg

Alla dessa kan hjälpa dig bygga en hel webbsida från en prompt.

~$

Claude Code

Anthropics CLI-verktyg. Kör i terminalen, läser och skriver filer direkt, kör kommandon. Perfekt för server-arbete.

npm install -g @anthropic-ai/claude-code
Rekommenderat

OpenAI Codex CLI

OpenAIs terminal-agent. Liknar Claude Code men använder GPT-modeller. Bra alternativ om du gillar OpenAI.

npm install -g @openai/codex
Terminal
{ }

Cursor / Windsurf

AI-drivna kodeditors med inbyggd chat, autocomplete och agent-läge. Bra om du vill ha en grafisk editor.

cursor.com / windsurf.com
Editor
Tips: Om du aldrig använt ett LLM-kodverktyg innan — börja med Claude Code. Det fungerar direkt i terminalen och kan SSH:a in till din server. Kör claude i terminalen efter installation.

Hämta din server

Du får en egen Ubuntu-server med nginx, Node.js, Python och certbot förinstallerat. Verifiera med SMS så sätter vi upp den automatiskt.

Kör cat ~/.ssh/id_ed25519.pub eller cat ~/.ssh/id_rsa.pub för att hitta den. Ingen nyckel? Kör ssh-keygen -t ed25519

Din server inkluderar:

2 vCPU + 4 GB RAM
40 GB SSD
Ubuntu 24.04 LTS
nginx webbserver
Node.js 22 LTS
Python 3 + pip
certbot för SSL
ufw brandvägg

Anslut via SSH

När du har din servers IP-adress, anslut såhär:

1

Öppna terminalen och SSH:a in

ssh root@DIN_IP_ADRESS

Acceptera fingerprint med yes första gången.

2

Kontrollera att allt fungerar

# Kolla nginx
curl localhost

# Kolla Node.js
node --version

# Kolla Python
python3 --version
3

Starta ditt LLM-verktyg på servern

# Claude Code (om du redan installerat)
claude

# Eller installera det
npm install -g @anthropic-ai/claude-code
claude

Nu kan ditt LLM-verktyg direkt redigera filer på servern!

Peka din domän

Har du en domän? Peka den mot din server och fixa SSL.

1

Skapa en A-post i din DNS

Typ:    A
Namn:   @ (eller subdomän)
Värde:  DIN_IP_ADRESS
TTL:    300

Gör detta hos din domänleverantör (Loopia, GoDaddy, Cloudflare, etc.)

2

Skapa nginx-config på servern

# Skapa config
sudo nano /etc/nginx/sites-available/mindomän.se

# Innehåll:
server {
    listen 80;
    server_name mindomän.se www.mindomän.se;
    root /var/www/mindomän;
    index index.html;
}

# Aktivera
sudo ln -s /etc/nginx/sites-available/mindomän.se \
           /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx
3

Fixa SSL med certbot

sudo certbot --nginx -d mindomän.se -d www.mindomän.se

Klart! Din sida har nu HTTPS.

Ingen domän? Du kan ändå bygga och testa — din sida finns på http://DIN_IP_ADRESS direkt. Köp en domän senare och peka den.

Exempelprompts

Klistra in dessa i ditt LLM-verktyg för att komma igång snabbt.

Personlig portfolio

Skapa en personlig portfolio-webbsida i /var/www/html/. Använd HTML, CSS och lite JavaScript. Mörkt tema med en hero-sektion, "Om mig", projekt-grid med kort, och kontaktformulär. Gör den responsiv för mobil. Använd moderna CSS-features som grid, custom properties och smooth scroll.
Klicka för att kopiera

Landing page för en produkt

Skapa en landing page för en fiktiv SaaS-produkt i /var/www/html/. Inkludera navbar, hero med CTA-knappar, features-grid med ikoner, pricing-tabell med 3 planer, testimonials-sektion och footer. Gör den professionell och modern med smooth animations on scroll.
Klicka för att kopiera

Node.js backend + frontend

Skapa en enkel Node.js-app med Express i /opt/myapp/. Den ska ha ett REST API med endpoints för att skapa, lista och radera "anteckningar" (spara i en JSON-fil). Skapa också en snygg frontend i public/ som använder fetch() mot API:t. Sätt upp det bakom nginx som reverse proxy på port 3000. Använd PM2 för att hålla appen igång.
Klicka för att kopiera

46elks SMS-integration

Skapa en Python FastAPI-app i /opt/smsapp/ som kan skicka och ta emot SMS via 46elks API. Inkludera: ett webformulär för att skicka SMS, en webhook-endpoint för inkommande SMS, och en lista över alla meddelanden. Spara i SQLite. Kör med uvicorn bakom nginx. 46elks API-docs: https://46elks.com/docs
Klicka för att kopiera

LLM-läsbara instruktioner

Kopiera detta och klistra in som kontext till ditt LLM-verktyg. Det ger AI:n full förståelse för din server.

# Server Context — AI-slöjd Workshop

Du hjälper en utvecklare bygga webbsidor på deras Ubuntu 24.04-server.

## Serverdetaljer
- OS: Ubuntu 24.04 LTS
- Webbserver: nginx (förinstallerad, kör)
- Node.js: v22 LTS (förinstallerad)
- Python: 3.12+ (förinstallerad)
- Brandvägg: ufw (port 22, 80, 443 öppna)
- SSL: certbot + python3-certbot-nginx installerat
- Pakethanterare: apt, npm, pip

## Filplatser
- Webbrot: /var/www/html/
- Nginx-sites: /etc/nginx/sites-available/ och /etc/nginx/sites-enabled/
- Default config: /etc/nginx/sites-available/default

## Vanliga uppgifter

### Deploya en statisk webbsida
Placera filer i /var/www/html/ — de serveras automatiskt av nginx.
Eller skapa en ny site under /var/www/mittnamn/ med egen nginx-config.

### Sätta upp en domän med SSL
1. Peka domänens A-post till serverns IP
2. Skapa nginx config: /etc/nginx/sites-available/mindomän.se
3. Symlink: ln -s /etc/nginx/sites-available/mindomän.se /etc/nginx/sites-enabled/
4. Test: nginx -t
5. Reload: systemctl reload nginx
6. SSL: certbot --nginx -d mindomän.se

### Köra en Node.js-app
1. Skapa app i /opt/myapp/
2. Installera PM2: npm install -g pm2
3. Starta: pm2 start app.js --name myapp
4. Persist: pm2 save && pm2 startup
5. Skapa nginx reverse proxy till localhost:PORT

### Köra en Python FastAPI-app
1. Skapa venv: python3 -m venv /opt/myapp/venv
2. Installera: /opt/myapp/venv/bin/pip install fastapi uvicorn
3. Kör med uvicorn bakom nginx reverse proxy

## Nginx Reverse Proxy-mall
```
server {
    listen 80;
    server_name mindomän.se;
    location / {
        proxy_pass http://127.0.0.1:PORT;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}
```

## Bra att veta
- Allt körs som root (workshop-miljö)
- nginx konfigfiler: skapa i sites-available, symlink till sites-enabled
- Testa alltid med: nginx -t innan reload
- PM2 för Node-appar, systemd eller uvicorn direkt för Python
- Git är installerat — du kan klona repos direkt

FAQ

Min SSH-nyckel fungerar inte — vad gör jag?

Kontrollera att du kopierade hela nyckeln (inklusive ssh-ed25519 eller ssh-rsa i början). Kör cat ~/.ssh/id_ed25519.pub och kopiera allt. Om du inte har en nyckel: kör ssh-keygen -t ed25519 och tryck Enter på alla frågor.

Hur får jag en domän?

Köp en på t.ex. Loopia, Namecheap eller Cloudflare. En .se-domän kostar ca 100 kr/år. Du kan också använda en gratis subdomän-tjänst som FreeDNS (freedns.afraid.org).

Kan jag köra en backend (inte bara statiska filer)?

Absolut! Din server har Node.js och Python. Bygg en Express-app, FastAPI-app, eller vad du vill. Kör den på en port (t.ex. 3000) och sätt upp nginx som reverse proxy. Se exemplen ovan.

Hur länge finns servern?

Servern är din så länge workshopen pågår. Vi meddelar i förväg om den ska stängas ner. Kostnaden är ca €3.49/månad.

Jag fick inget SMS — vad hände?

Kontrollera att du angav rätt nummer med landskod (+46...). Vänta 30 sekunder — ibland tar SMS lite tid. Om det fortfarande inte funkar, fråga workshopledaren.

Kan jag använda mitt eget LLM-verktyg?

Ja! Vi rekommenderar Claude Code men du kan använda Codex, Cursor, Windsurf, GitHub Copilot, eller till och med bara ChatGPT/Claude i webbläsaren och copy-paste kod. Använd det du är bekväm med.

Vad är Claude Code?

Claude Code är Anthropics CLI-verktyg som kör direkt i terminalen. Det kan läsa filer, skriva kod, köra kommandon och bygga hela projekt åt dig. Installera med npm install -g @anthropic-ai/claude-code och kör claude.