Zum Inhalt springen

Junior Web Developer · Portfolio 2026

Hallo, ich bin Ivan.

Ich baue Web-Oberflächen mit React, Next.js und TypeScript. Im September 2026 habe ich den Hochschullehrgang „Modern Web Development“ der FH Kärnten an der Coding School Wörthersee erfolgreich abgeschlossen – hier sind die Projekte, die dabei entstanden sind.

Rolle
Junior Web Developer
Ausbildung
Modern Web Development (FH Kärnten, 30 ECTS) – abgeschlossen 09/2026
Standort
Wolfsberg, Kärnten (AT)
Arbeitsweise
Remote weltweit oder vor Ort mit Relocation-Unterstützung
Schwerpunkt
React, Next.js, TypeScript
Sprachen
Deutsch, Englisch, Kroatisch
Status
Auf Jobsuche
Weiterbildung
Offen für neue Bereiche, z. B. Backend
01

Über mich

Ich bin Ivan, Junior Web Developer aus Wolfsberg in Kärnten. Vorher habe ich unter anderem als Industrie-Isolierer und Corona-Testhelfer gearbeitet – der Wechsel in die IT war eine bewusste Entscheidung. Aus diesen Jobs bringe ich Genauigkeit mit und bleibe auch unter Druck ruhig; das hilft mir beim Programmieren, vor allem bei der Fehlersuche.

Von März bis September 2026 habe ich an der Coding School & Academy Wörthersee den Hochschullehrgang „Modern Web Development“ der FH Kärnten absolviert und mit 30 ECTS abgeschlossen – von HTML, CSS und JavaScript bis zu React, Next.js und TypeScript. Barrierefreiheit war dabei von Anfang an Teil meiner Projekte. Als Nächstes möchte ich in einem echten Team Erfahrung sammeln – und auch über das Frontend hinaus dazulernen.

02

Projekte

Was ich seit März 2026 gebaut habe – oben die Projekte, die ich allein umgesetzt habe, darunter Teamprojekte und weitere Arbeiten.

  1. Screenshot von Kursverwaltung

    01Juli 2026React & Next.js

    Kursverwaltung

    Mini-Lernplattform

    Eine kleine Lernplattform zur Verwaltung von Kursen – ein Next.js-Frontend (App Router), das seine Daten über die API eines Strapi-Headless-CMS lädt.

    • Kurse anlegen, bearbeiten und löschen über die Strapi-API
    • Validierte Formulare mit React Hook Form + Zod
    • Datenabfragen & Caching mit TanStack Query
    • Next.js
    • TypeScript
    • Strapi
    • Tailwind CSS
    • Axios
    • React Hook Form

    Privates Repository · Code auf Anfrage

  2. 02

    Juli 2026React & Next.js

    Todo App

    Aufgabenverwaltung

    Eine Aufgabenverwaltung mit Next.js und TypeScript: Aufgaben anlegen, abhaken, direkt in der Liste umbenennen und löschen – gespeichert über die API eines Strapi-Headless-CMS.

    • Eigene Hooks für jede Operation (useTodos, useCreateTodo, useUpdateTodo, useDeleteTodo) mit TanStack Query
    • Neue Aufgaben werden mit Zod validiert
    • Inline-Bearbeitung und Erledigt-Status, responsives Layout mit shadcn/ui
    • Next.js
    • TypeScript
    • TanStack Query
    • Zod
    • Axios
    • Strapi
    • shadcn/ui

    Privates Repository · Code auf Anfrage

  3. Screenshot von Mehrstufiges Formular

    03Juni 2026React & Next.js

    Mehrstufiges Formular

    Geführter Formular-Ablauf

    Ein Anmeldeformular in zwei Schritten mit Fortschrittsanzeige. Jeder Schritt wird geprüft, bevor es weitergeht; abgeschickte Anmeldungen erscheinen in einer Liste.

    • Validierung pro Schritt mit React Hook Form + Zod – „Weiter“ erst, wenn alles stimmt
    • Klare Fehlermeldungen direkt am Feld (z. B. Telefonnummer, PLZ)
    • Liste aller Anmeldungen mit aufklappbarer Detailansicht und Löschen
    • Next.js
    • TypeScript
    • React Hook Form
    • Zod
    • Tailwind CSS

    Privates Repository · Code auf Anfrage

  4. Screenshot von Quiz App

    04Mai 2026JavaScript

    Quiz App

    Interaktives Quiz

    Ein interaktives Quiz mit Ergebnisübersicht am Ende und einem Verlauf vergangener Versuche.

    • Punktestand & Ergebnisübersicht
    • Quiz-Verlauf
    • Dynamisches DOM-Rendering
    • JavaScript
    • HTML
    • Tailwind CSS
    Live ansehen

    Privates Repository · Code auf Anfrage

  5. Screenshot von Rick and Morty Wiki

    05Mai 2026JavaScript

    Rick and Morty Wiki

    API-Explorer

    Ein Wiki auf Basis der öffentlichen Rick-and-Morty-API: Charaktere, Orte und Episoden durchsuchen und filtern.

    • Drei Bereiche (Charaktere, Orte, Episoden) aus einer API
    • Live-Filter über die Ergebnisse
    • Detailansicht lädt verknüpfte Daten parallel mit Promise.all
    • JavaScript
    • Tailwind CSS
    • REST API
    Live ansehen

    Privates Repository · Code auf Anfrage

  6. Screenshot von Disney Character Explorer

    06Mai 2026JavaScript

    Disney Character Explorer

    Pagination-Übung

    Disney-Charaktere aus einer öffentlichen API durchstöbern – mit Seitennavigation (Pagination).

    • API-Daten seitenweise
    • Seitennavigation
    • Ladezustände
    • JavaScript
    • Tailwind CSS
    • REST API
    Live ansehen

    Privates Repository · Code auf Anfrage

Weitere Projekte

Teamprojekte aus der Ausbildung und zwei weitere API-Projekte.

  • Juli – Aug. 2026

    Let's Stay HydratedGetränkeverwaltung · Challenge 3

    Teamprojekt

    Getränkeverwaltung für Organisationen mit rollenbasierter Zugriffskontrolle, Bestandskontrolle und einfachem Zahlungssystem. Das Next.js-Frontend spricht direkt mit der REST-API von Supabase (PostgREST + GoTrue) – ohne SDK.

    • Next.js
    • TypeScript
    • Supabase
    • TanStack Query
    • Zod
    • shadcn/ui
    • Motion
  • Mai 2026

    SmashPro KursbuchungTeamprojekt · Challenge 2

    Teamprojekt

    Eine Plattform zur Verwaltung und Buchung von Kursen. Nutzer buchen Kurse, Administratoren verwalten sie in einem eigenen Dashboard. Im Team umgesetzt, mit klar aufgeteilten Zuständigkeiten.

    • JavaScript
    • HTML
    • Tailwind CSS
  • Mai 2026

    Wetter-AppLive-Wetter-Dashboard

    Wetter-App mit Login- und Registrierungsansicht sowie einer Übersicht aktiver Städte – Live-Daten aus einer Wetter-API.

    • JavaScript
    • Tailwind CSS
    • REST API
  • Mai 2026

    DogWikiHunderassen-Lexikon

    Ein Hunderassen-Wiki: Gruppe auswählen und die passenden Rassen entdecken.

    • JavaScript
    • Tailwind CSS
    • REST API
    Live ansehen
03

Skills

Sprachen
TypeScript · JavaScript · HTML · CSS
Frameworks
React · Next.js (App Router) · Tailwind CSS · shadcn/ui
Daten & State
TanStack Query · Axios · React Hook Form · Zod
APIs
REST-APIs · Supabase REST-API · Strapi (Headless CMS)
Werkzeuge
Git & GitLab · Vitest · ESLint · npm
04

Werdegang

  1. März – Apr. 2026

    Grundlagen

    Git-Basics, semantisches HTML, CSS und Tailwind. Erste Landingpages, ein Warenkorb und ein barrierefreies Portfolio.

  2. Mai 2026

    JavaScript & APIs

    DOM, async/await und öffentliche APIs: Rick-and-Morty-Wiki, Disney-Explorer mit Pagination, DogWiki, Quiz- und Wetter-App.

  3. Juni 2026

    React & Next.js

    Denken in Komponenten, typisierte Formulare mit React Hook Form und Zod, mehrstufige Abläufe.

  4. Juli – Aug. 2026

    Next.js-Apps mit echten APIs

    Next.js-Frontends, die Daten aus Strapi und der Supabase-REST-API laden, Datenabfragen mit TanStack Query und Ansichten je nach Benutzerrolle.

  5. Sep. 2026

    Abschluss

    Hochschullehrgang „Modern Web Development“ der FH Kärnten (30 ECTS) an der Coding School & Academy Wörthersee erfolgreich abgeschlossen.

05

Kontakt

Ich suche meine erste Stelle als Junior Developer – remote von überall oder vor Ort, wenn ein Umzug mit Relocation-Unterstützung möglich ist.

Frontend ist mein Einstieg, aber nicht meine Grenze: Ich lerne gerne weiter und bin offen dafür, mich in Richtung Backend oder andere Bereiche weiterzuentwickeln.

GitLab