Fabian Hurtado Volkmann

Hey there,
I am Fabian

about me

Hi, Ich bin
Fabian

über mich

Fullstack
Web Developer

about my work

Fullstack
Web Entwickler

über meine Arbeit
Fabian Hurtado Volkmann

About Me

Welcome to my portfolio page! I am Fabian Hurtado Volkmann (*2004), an enthusiastic Fullstack Web Developer from Berlin.
During my time in school, I discovered my passion for programming and taught myself how to code using various online resources. I quickly learned HTML and CSS, and I started taking on my first clients' projects, which allowed me to earn a small income during my high school years.
After completing my high school education, I further improved my skills by attending the Fullstack Web Development Bootcamp at Ironhack School. Currently, I am studying "Business Administration - Digital Economy" at the Berliner Hochschule für Technik and I am looking for a student job as a Web Developer.

Über Mich

Willkommen auf meiner Portfolio-Seite! Ich bin Fabian Hurtado Volkmann (*2004) und ein begeisterter Fullstack Web Developer aus Berlin.
Schon während meiner Schulzeit entdeckte ich mein Interesse für das Programmieren und brachte mir selbst das Programmieren bei, indem ich verschiedenste Online-Ressourcen benutzte. HTML und CSS lernte ich sehr schnell und ich begann, erste Aufträge von Kunden anzunehmen, was mir einen kleinen Nebenverdienst während meines Abiturs ermöglichte.
Nach meinem Abitur habe ich meine Fähigkeiten vertieft, indem ich das Fullstack-Webentwickler-Bootcamp an der Ironhack School absolvierte. Derzeit studiere ich "BWL-Digitale Wirtschaft" an der Berliner Hochschule für Technik und suche nach einem Werkstudentenjob im Bereich der Webentwicklung.

Fabian Hurtado Volkmann

What I do as a
Fullstack Web Developer

Currently my primary skills are in the MERN stack, which includes MongoDB, Express.js, React.js, and Node.js. Through a lot of practical projects, I have deepened my passion for the front-end, particularly React.js and CSS, and also created creative solutions in the back-end. I am particularly proud of my project "Infinite Recall", a flashcard learning app for students that I developed.
But I am also motivated to try out new technologies and with a passion to acquire new skills everyday, I adapt quickly to new programming languages and frameworks that arise in this fast changing industry.

Meine Arbeit als
Fullstack Web Entwickler

Derzeit liegen meine Hauptfähigkeiten im MERN-Stack, der MongoDB, Express.js, React.js und Node.js umfasst. Durch zahlreiche Praxis-Projekte in der Webseiten-Entwicklung habe ich meine Leidenschaft für die Front-End-Entwicklung entdeckt, insbesondere für React.js und CSS. Gleichzeitig habe ich auch kreative Lösungen im Back-End-Bereich erstellt. Besonders stolz bin ich auf mein Projekt "Infinite Recall", eine Karteikarten-Lern-App für Schüler, die ich entwickelt habe.
Aber ich bin auch motiviert, neue Technologien auszuprobieren und habe eine Leidenschaft dafür, jeden Tag neue Fähigkeiten zu erlernen. Ich passe mich schnell neuen Programmiersprachen und Frameworks an, die in dieser sich schnell verändernden Branche entstehen.

Plan and Design Prototypes with AdobeXD

Planen und Designen von Prototypen in AdobeXD

Using Adobe XD, I bring your ideas to life, thoughtfully crafting the UI/UX, laying out the web page, selecting an appealing color palette and optimal fonts. Additionally, I design mobile versions to make the web app responsive.

Mit Adobe XD setze ich Ihre Ideen in die Realität um, indem ich gezielt das UI/UX gestalte, ein ansprechendes Layout anfertige, eine aussagekräftige Farbpalette auswähle und moderne Schriftarten integriere. Darüber hinaus entwerfe ich mobile Versionen, um die Web-App responsive zu machen und somit Nutzer auf allen Geräten zu erreichen.

Build a captivating Front-End with React.js and modern CSS

Ein ansprechendes Front-End mit React.js und modernem CSS erstellen

With React.js, I build captivating front-ends, creating react components and pages. My expertise includes implementing your Adobe design flawlessly, incorporating modern CSS, responsive web design, and innovative features like Flexbox, Grid-Layouts, custom properties, darkmode themes and many more.

Mit React.js baue ich ein fesselndes Front-End für Ihre Web-Applikation. Meine Expertise umfasst das nahtlose Umsetzen des Adobe Designs mit strategisch gewählten React-Components und modernen CSS-Techniken wie Flexbox, Grid-Layouts, CSS-Variablen, Darkmode Thema und vieles mehr.

Implement the Back-End Functionality with Express.js

Die Back-End-Funktionalität in Express.js implementieren

For the back-end of your application, I construct RESTful APIs using Express.js (framework for Node.js). Leveraging a MongoDB database, I expertly design essential Mongoose models and backend routes with Express.js, ensuring seamless functionality and optimal performance.

Für das Backend Ihrer Anwendung entwickle ich RESTful APIs unter Verwendung von Express.js (Framework für Node.js). Mit geschickt entworfenen Mongoose-Models und Backend-Routes sorge ich für optimale Leistung und Kommunikation mit der MongoDB-Datenbank.

Meine Coding Projekte

My Coding Projects

Infinite Recall

A Flashcard Learning App for Students

This MERN (MongoDB, Express.js, React.js, Node.js) application is the first complex app I have ever created all by myself. It was the final project of my Ironhack Web Development Bootcamp which I completed in May 2023.

I started with the user authentication (signup, login, logout) using jsonwebtoken. Authenticated users can create, edit, delete and learn with flashcard collections. You can also search for other student's flashcards and learn with them.

There are different learn modes that optimize your learning experience. You can also analyse your past learn sessions using the statistics page, where all your progress is tracked with a detailed summary and hints where you can improve.

I am very proud of my CSS Design and all the little animations and effects that improve the user-experience.

Eine Karteikarten-Lern-App für Schüler

Diese MERN-Anwendung (MongoDB, Express.js, React.js, Node.js) ist die erste komplexe App, die ich programmiert habe. Es war das Abschlussprojekt meines Ironhack Web Development Bootcamps, das ich im Mai 2023 absolviert habe.

Ich begann mit der Benutzerauthentifizierung (Registrierung, Login, Logout) unter Verwendung von jsonwebtoken. Authentifizierte Benutzer können Karteikartensammlungen erstellen, bearbeiten, löschen und mit ihnen lernen. Sie können auch nach den Karteikarten anderer Schüler suchen und mit diesen lernen.

Es gibt verschiedene Lernmodi, die den Lernerfolg optimieren. Sie können auch Ihre vergangenen Lernsitzungen analysieren, indem Sie die Statistikseite besuchen, auf der Ihr Fortschritt mit einer detaillierten Zusammenfassung erfasst wird und Sie Hinweise erhalten, wo Sie sich verbessern können.

Ich bin sehr stolz auf mein CSS-Design sowie auf die kleinen Animationen und Effekte, die die User-Experience verbessern.

React Todo App

A Todo-App with User Authentication

This is a todo-app with user authentication and modern CSS Design. It is a MERN application (MongoDB, ExpressJS, ReactJS, NodeJs) that uses jsonwebtoken to authenticate the users (for login and signup). The users todos are stored in a Mongo database to be in sync across all devices.

The users can filter their todos with their completion status (all, active, completed). There is also a Darkmode-Switch which changes the theme from light to dark. The preffered color theme get's stored in LocalStorage so that it is the same on the next visit.

React Todo App

Eine Todo-App mit Login-System

Dies ist eine Todo-App mit Benutzerauthentifizierung und modernem CSS-Design. Es handelt sich um eine MERN-Anwendung (MongoDB, Express.js, React.js, Node.js), die jsonwebtoken verwendet, um die Benutzer (für Anmeldung und Registrierung) zu authentifizieren. Die Todos der Benutzer werden in einer Mongo-Datenbank gespeichert, um auf allen Geräten synchronisiert zu sein.

Die Benutzer können ihre Todos nach ihrem Fertigstellungsstatus filtern (alle, aktiv, erledigt). Es gibt auch einen Darkmode-Switch, der das Thema von hell auf dunkel ändert. Das bevorzugte Farbthema wird im LocalStorage gespeichert, damit es bei einem erneuten Besuch erhalten bleibt.

Zombie Game

A 2D Zombie Highscore Game in JavaScript p5

This is a simple game developed using p5.js during my Coding Bootcamp in March 2023. The purpose of coding this game was to apply newly acquired JavaScript fundamentals and object-oriented programming in a beginner-friendly, practical project.

The player's objective is to survive as long as possible in a zombie-infested world. There are different difficulty levels that control the speed and spawn-frequency of the zombies. If a zombie reaches you, you lose a heart. When you have no hearts left, the game is over.

Zombie Spiel

Ein 2D Zombie Highscore Spiel in JavaScript p5

Dies ist ein simples Browser Spiel, das ich während meines Coding Bootcamps im März 2023 mit JavaScript p5 entwickelt habe. Es ist mein erstes richtiges Anfänger-Projekt, bei dem ich neu erworbene JavaScript-Fähigkeiten und insbesondere objektorientierte Programmierung in einem Praxis-Projekt anzuwenden lernte.

Das Ziel des Spielers ist es, so lange wie möglich in einer von Zombies verseuchten Welt zu überleben. Es gibt verschiedene Schwierigkeitsstufen, die die Geschwindigkeit und Spawn-Häufigkeit der Zombies kontrollieren. Wenn ein Zombie den Spieler erreicht, wird ein Leben abgezogen. Wenn man keine Leben mehr hat, ist das Spiel vorbei.

My Coding Projects

Meine Coding Projekte

Skillset

Front-End

  • HTML, CSS
  • Flexbox, Grid-Layouts
  • Responsive Webdesign
  • JavaScript
  • React.js

Back-End

  • Express.js
  • MongoDB
  • Mongoose
  • PHP
  • SQL

Other

Andere

  • Blender 3D Modelling
  • Unity Engine
  • C#
  • Git, Github
  • Davinci Resolve

Languages

Sprachen

  • German Deutsch
  • English Englisch
  • Spanish Spanisch

Desired Position and Strengths

I aspire to seize an opportunity as a working student to practically improve my acquired skills in web development. My strengths lie in the front-end (particularly React.js and CSS), yet I also value the necessity of a seamless integration of back-end elements to develop holistic and impressive applications. Currently, I am learning Next.js and TypeScript, and I would be thrilled to apply these technologies in a real work environment.

Wunschposition und Stärken

Ich strebe nach einer Gelegenheit als Werkstudent meine erlernten Fähigkeiten in der Webentwicklung praxisnah zu vertiefen. Meine Stärken liegen im Front-End (insbesondere React.js und CSS), jedoch schätze ich gleichzeitig die Notwendigkeit einer reibungslosen Integration von Back-End-Elementen, um ganzheitliche und beeindruckende Anwendungen zu entwickeln. Aktuell setze ich mich intensiv mit Next.js und TypeScript auseinander und würde mich freuen diese Technologien ebenfalls im realen Arbeitsumfeld anzuwenden.