Profile

As a web developer I'm focusing on the frontend with a keen eye on the whole system including libraries, backend systems and external services. In my day job I mainly write JavaScript, TypeScript and SCSS with Vue, Nuxt and Nest.js, personally I love exploring new frameworks like Astro, and try tools myself like Docker, Vite, esbuild, Node.js and Deno.

I am highly motivated in expanding my horizons day by day for better maintainability, testing and user experience.

Experience

i22 Digitalagentur GmbH

Since July 2022:
Frontend Developer
March 2022 - June 2022:
Junior Frontend Developer
Tasks:
  • New and further development of a booking route for the basic and pro tariffs of an app.
  • Develop an API facade using Nest.js to easily expose services to public front- and back-end applications.
  • Development of e-commerce features in the frontend
Tools:
JavaScript SCSS Vue Vuex Jest Nuxt Git GitLab Jira

Chemmedia AG

Nov. 2020 - Feb. 2022
Working student - Frontend
Tasks:
  • Refactoring and adding features to a Vue app which is used for managing content of an e-commerce store. The app reads and writes data to PHP arrays which can be rendered on the server with HTML templates.
  • Working on the frontend of an e-commerce store with SCSS and JavaScript. Improving developer experience, managing update of tools to state-of-the-art and improving web performance.
Tools:
JavaScript SCSS Webpack Vue Vuex Bootstrap Docker Git Bitbucket Jira

Projects

School Seating Plan

Still in development

App for Teachers to Create a Seating Plan

Teachers can create a seating plan from scratch in a custom grid by placing tables and students via drag-n-drop. The app provides an auto-arragement feature, that rearranges students base on constraints the teacher may provide. There are three types of constraints:

  • Student needs to sit in first or last row.
  • Student must not sit next certain other student(s).
  • Arrange all male and female students alternatingly.
  • Teachers can share their seating plan via a URL or save the plan as PDF.
Online here:
Landing Page
Online here:
App
Code on:
GitHub/sitzplan (App)
Code on:
GitHub/sitzplan-landing (Landing Page)
Features:
Frontend
  • Users can create tables and students on a grid.
  • Users can customize the grid rows and columns between 9 and 12.
  • Users can move tables and students around via drag-n-drop.
  • Users can remove tables and students.
  • Users can enter constraints for each student in order to let the app auto-arrange the students.
  • Users can share their seating arrangement via the URL - e.g. sent in an email or messenger.
  • Users can save their seating arrangement as PDF document.
Built with:
React TypeScript Vite react-dnd jspdf

Stock Trend Strategy

In Development

Calculation of Buy Signals based on the Elder Force Index (EMA + MACD)

Deno Worker + FastAPI server + React Frontend
OHLC daily candles of S&P500 and NASDAQ100 stocks are downloaded daily from the Alpaca API. Based on the OHLC daily candles, buy signals are calculated and persisted in an SQLite database. The signals can be 'backtested' in the frontend with various parameters (Risk-Reward Ratio, Exit Criteria) to evaluate signal performance. Currently, the stock chart is displayed in the React frontend using the Google-Charts library.

Available online here:
App (stock-trends.christiankozalla.com)
Code on:
GitHub/stock-trend-strategy
Features:
  • Integration with Alpaca API
  • Cron Job for daily download of stock prices, persistence on the file system, signal calculation, and persistence in SQLite
  • GitHub Action for deployment on the server
  • SVG-Chart of stock prices (OHLC-candles), built with the Visx library
  • SVG-Chart of backtested signals
Built with:
React TypeScript Deno Python, FastAPI PostgreSQL SQLite GitHub Actions Caddy