DEV Community: Christian Engel

Advanced LLM Prompting Techniques: A Guide for Software Engineers

Christian Engel — Fri, 27 Sep 2024 20:32:24 +0000

Hello Dev.to community,
I've recently published an article that may be of interest to software engineers working with large language models (LLMs) like GPT-4 and Claude 3.5. The guide covers advanced prompting techniques that can enhance the effectiveness of LLMs in various development scenarios.

Topics Covered:

Chain-of-Thought (CoT) Prompting
Few-Shot and Zero-Shot Techniques
Self-Consistency Prompting
Role-Playing Prompts
Contextual Prompting
Tree of Thought (ToT)
ReAct Framework

The article provides practical examples and compares the effectiveness of these techniques when applied to ChatGPT and Claude. It aims to help developers:

Improve problem-solving capabilities in AI-assisted coding
Optimize LLM performance for specific development tasks
Implement more sophisticated reasoning in AI-powered applications

If you're interested in exploring how these techniques can be applied in software development, you can find the full article here: Advanced Prompting Techniques for Modern Large Language Models

I'd be interested to hear about your experiences with LLMs in software development. Have you used any of these techniques in your projects? What challenges have you encountered when working with AI language models?

PLANSEARCH: Improving reasoning for LLMs

Christian Engel — Tue, 24 Sep 2024 15:37:15 +0000

Hey devs! 👋 I've just published a blog post analyzing PLANSEARCH, a groundbreaking approach to AI problem-solving in coding. Here's why you should care:

Breaks down problem-solving into stages: observe, combine insights, develop solutions, implement
Significantly improves code generation task performance
Boosts solve rates from 40% to 70%+ on coding benchmarks
Potential to enhance developer productivity on complex tasks

In my full post, I dive into:

How PLANSEARCH works
Comparisons with other AI approaches
Potential applications in software development
The future of AI-assisted coding

Curious? Check out the full article at https://parastudios.de/paper-review-plansearch/ . Let's discuss - have you used AI-assisted coding tools?

🛑 Stop Coding Already! 🛑

Christian Engel — Mon, 23 Sep 2024 20:50:12 +0000

As developers, we often can't wait to start coding when inspiration strikes. But what if I told you that not coding might be the key to better projects?

Here's why you should stop coding (for a bit):

Your mind is faster than your keyboard. Mental modeling can save you from weeks of frustration.
"Mental coding" happens anywhere. Shower thoughts could be your next breakthrough.
Tools like Obsidian turn ideas into plans. Organize your thoughts before you organize your code.
AI can be your devil's advocate. Use LLMs to challenge your assumptions.
Think MVP, then iterate. Plan small, start small, grow smart.

Next time inspiration hits, close that IDE. Plan first, code second.

What's your take? Do you plan extensively, or do you prefer to dive right in? Share your approach below!

Read the full article here: https://parastudios.de/stop-coding-already/

🚀 Enhancing OAuth Security & User Experience 🔒

Christian Engel — Mon, 23 Sep 2024 07:10:34 +0000

In my recent blog post, I explore how to integrate OAuth into a web app (SvelteKit, in my example), ensuring both top-notch security and a seamless user experience. I cover:

🛡️ Utilizing the OAuth state parameter
🔑 Strengthening CSRF protection with httpOnly cookies
🔄 Handling login vs. registration flows effectively

If you're looking to optimize OAuth in your web app, check out the full guide!

👉 Read the full post here

Hello world, this is RoboStreamer

Christian Engel — Wed, 25 May 2022 10:42:48 +0000

Hey DEV community!
I wanted to share a project I am working on in my free time and tell a bit about how it's structured and which frameworks and/or languages I picked to develop it.

The project is called RoboStreamer and allows users to upload pre-recorded video files to have them streamed via RMTP to their Steam Store pages. So its basically a marketing tool for (indie) game developers and publishers.

Everything in this project is done by myself - the planning, development, design and marketing. I am happy to answer any questions you have!

About me

My name is Chris - I am living in germany and currently working as Head of Datadriven Content Portals for t-online.de - one of, if not the biggest german news site with more than 47 million monthly active users.

My team is responsible for concept/planning, development and delivery of the web portals which deliver live stock market and sports data.

I am an active web developer for nearly 20 years now and worked on lots of medium and big projects, try to be helpful for other devs and in the open source community and even founded a startup once.

In my free time, I work on different pet projects and one of them is RoboStreamer.

Why I started working on RoboStreamer

Out of personal interest, I have a closer eye on the indie point-and-click adventure bubble. In my childhood, I loved playing games like Monkey Island, Day of the Tentacle, Kings' Quest and others.

Screenshots of the games 'Curse of Monkey Island', 'Day of the Tentacle', 'Kings Quest VII' and 'Indiana Jones and the Fate of Atlantis'

During a recent Adventure Game Steam Event, I noticed some developers were hosting pre-recorded Steam Broadcasts. I researched a bit about how this is done and noticed that its surprisingly much work to do so. You not only have to produce your video but you need to leave your computer running and follow strict configuration parameters in order to make your video appear as a live stream on your Steam Store Page.

And there are lots of developers doing this because - totally understandable - they have games to develop.

I noticed that - when you know how to do it, it's relatively simple to let an instance of ffmpeg handle the streaming part. For initial tests, I had a webserver running, installed ffmpeg there and configured the streaming settings by hand. I did so in order to support an indie game developer friend of mine.

This worked surprisingly well, and I thought by myself: if I add a simple UI around it, I may be able to help a lot of indie devs out there!

How RoboStreamer works

This is my first personal project I built in a decentralized manner where even parts of the main system are separated processes being able to run on separate servers. For the sake of development speed, I settled with Strapi as my main data storage solution. It gives me an API and user authentication without much hassle. And from Strapi, its relatively straightforward piping events to my other services.

A diagram showcasing the different parts of the RoboStreamer system

There is the upload service which accepts large video files cut into small pieces. It's responsible for merging the pieces back together and moves them to a storage solution hosted with Hetzner.
I will add video conversion there as well to make it even easier to create Steam Broadcasts from pre-recorded videos.

Another service is the coordination process which will spread streaming jobs to multiple running streamer processes. The
coordination process is like a load balancer for the streaming requests - it will give jobs to streamer instances with free capacity or even boot up new streamer instances, when needed.

All of those services are written in Typescript and run via Node.js.

Finally, there is the frontend process powering the RoboStreamer website and the control center. The whole frontend is created with Svelte using Elder.js which makes it easy to create fast and SEO friendly web projects.

Partial screenshot of the RoboStreamer controlcenter

Thanks for reading!

If you are interested in using RoboStreamer for your Steam Store Page, give me a shout on Twitter or register for the newsletter on the homepage.

If you'd like to discuss techy things - you are very welcome to have a chat with me as well!

Greetings, Chris

Limit access of Strapi users to their own entries

Christian Engel — Sun, 15 May 2022 19:40:56 +0000

This was actually one of the first problems I encountered when I began using Strapi version 4 as a backend boilerplate for my streaming service for steam broadcasts side project.

What I wanted was that when a user requested a list of or a certain entity, the backend should only respond with entities which belong to the user. By default, Strapi would send all entities from everyone.

Lets say you create a TODO app with a /tasks endpoint. Each user should be able to create tasks by doing POST requests but if they do a GET request to /tasks they should not see everyones tasks. Also PUT requests should only work when the given task belongs to the user.

So how do we achieve this?

tl;dr

Use a service call in the create() method to set the owner field with system privileges.
Force a filter to the id of the current user in all other methods.

Extend the Strapi controller

Lets stay with the tasks example for this article. The moment you create that data type through the Strapi Content-Type Builder, Strapi will create a dummy controller in /src/api/task/controllers/task.js.

The content will look like this:



'use strict';

/**
 *  task controller
 */

const { createCoreController } = require('@strapi/strapi').factories;

module.exports = createCoreController('api::task.task');

In order to get the behavior we want to achieve, we need to roll our own find(), findOne(), update() and delete() methods to limit the access. The create() route needs to be defined as well, since - as far as I know - Strapi is unable to link the current user to an entry automatically.

So lets begin with saving the creator of a task in its own field. I added a new field in the Strapi Content-Type Builder which is a relation to the users table. Yes, Strapi will keep track of the user which was the creator of an entry but this is not editable. If you as an administrator create a task for a user in the admin interface, your name will be set as the creator and you can't do anything to change that. So we create a "real field" on the entry.

The `create()` method

Now lets update the task controller so upon creation the owner field will be set to the id of the user which issued the request.



'use strict';

/**
 *  task controller
 */

const { createCoreController } = require('@strapi/strapi').factories;

module.exports = createCoreController('api::task.task', {

    async create(ctx) {
        const user = ctx.state.user;

        const task = await super.create(ctx);

        const updated = await strapi.entityService.update("api::task.task", task.data.id, {
            data: {
                owner: user.id
            }
        });

        return result;
    },

});

With this code in place - whenever a user creates a new task via http POST, the controller will read the user object from the request state (a bit like a session), create a task and then immediately update it by setting the owner field to the user id.

Why the two step process?

The immediate thought I would have when reading the above code would be: why not sneaking the owner id into the payload that is passed to super.create() and avoiding the separete call to update()?

Well, the reason is that this will only work when the issuing user has access to modify the users table. If not, there is no way Strapi will let you set that value. So by calling super.create(ctx) first, we make sure the task entry is created in the name of the user.

Our next call to strapi.entityService.update() is done with system privileges, tough. The action is not related to a user so no permissions will be checked. The owner field will be set with super admin privileges (so be extra careful when doing this).

Heads up!

The automatic owner assignment will not work when you create tasks inside the admin interface. Controller methods are only being called when requests are made through the public REST or GraphQL api.

The `find()` method

When the tasks application issues a GET request to /tasks, Strapi will return a list of all existing tasks, of all users. To prevent that, we need to forcefully add a filter to the query.



async find(ctx){
    const user = ctx.state.user;

    ctx.query.filters = {
        ...(ctx.query.filters || {}),
        owner: user.id
    };

    return super.find(ctx);
}

Again, we get the current user object from the request state. Then we update the filters property of the query object for the request. We copy over all filters which have been passed by the user, then we set the owner field to the current users id. This way, the filter is always set serverside, even if the user would pass in a forged owner parameter from the outside. It would not be possible to request tasks of a different user.

The other methods

Since wrapping the other methods in the same filter is basically copy/paste, I will put them all together, here:



async findOne(ctx){
    const user = ctx.state.user;

    ctx.query.filters = {
        ...(ctx.query.filters || {}),
        owner: user.id
    };

    return super.findOne(ctx);
},
async update(ctx){
    const user = ctx.state.user;

    ctx.query.filters = {
        ...(ctx.query.filters || {}),
        owner: user.id
    };

    return super.update(ctx);
},
async delete(ctx){
    const user = ctx.state.user;

    ctx.query.filters = {
        ...(ctx.query.filters || {}),
        owner: user.id
    };

    return super.delete(ctx);
}

You may want to DRY your code a bit, but I actually copy/pasted the parts for real to be able to make other customizations more quickly.

This post was published on my personal blog, first.

You should follow me on dev.to for more tips like this. Click the follow button in the sidebar! 🚀

Strapi quirks you should know about

Christian Engel — Sat, 30 Apr 2022 21:07:47 +0000

When I first came across Strapi, I had some misconceptions about it which are not immediately clear when reading about the framework in their docs.

I learned about some concepts and approaches only when actively using Strapi and wished to have known them before.

This is not a rant but just a heads up for other devs who consider building a project with strapi. I hope I can save them some hours of looking around in the docs and pulling out some hair. If it sounds ranty in some places, its because I experienced lots of frustration sometimes, so bear with me.

Here we go:

The admin UI skips all business logic implemented into the API

This assumption threw me off the most because it leads to a chain of conclusions of what should be possible.

For me, Strapi looked like a framework that lets you define a CRUD API, handles user authentication and offers an admin UI to interact with that API without having to build a dedicated UI first.

Thats only halfway true. Yes, Strapi allows to define a data model and creates API endpoints for that model. It also allows to pour business logic into the mix by offering the ability to create new or modify existing endpoints (routes), controllers, services and more.

You begin to scratch your head when all of those modifications are completely ignored by the admin UI. The reason is: Strapi creates two APIs. One I call the "frontend API" which is being consumed by your application and one "admin API" which is used exclusively by the admin UI.

There should be a big, red warning right on the getting started page: "Strapi Admin does in no way interact with the Strapi API"_

The problem is: when you add business logic like calling external services for additional data or validation, notify external systems or automatically adding rows into other collections, you are lost with the admin UI. You can manipulate the database contents but its not at all aware of the logic you added to the frontend API.

You can hack yourself into the admin API but there is nearly no documentation about it. I ended up reading lots of Strapi source code on github to learn about how the admin API works.

There are users and then there are users

Another design decision in Strapi was to have two kinds of users. One can access the frontend API only and others can access only the admin API. I assumed first that any user could have extra privileges given to access the admin UI. This is not the case.

Bonus points to make things worse: e-mail adresses need to be unique among both kinds of users. If there ist a user with the mail test@example.com for the frontend API, you cannot create another for the admin UI.

Ralations to the users table are complicated

No pun intended.

I like to give my collections an owner field with a relation to the users table of the users and permissions plugin. This way I can easily connect objects (posts, comments, tasks, whatever) to their owners. That connection might be altered through business logic as well.

However, in order to set or read the relation, the requesting user needs to have full access to the users table. This means they would be able to pull user data from the API as well.

I work around this problem by setting and populating the owner fields separately through direct service calls in my controllers. This add one additional query to the database tough.

Mocking modules with jest and typescript

Christian Engel — Fri, 29 Apr 2022 06:00:10 +0000

Since it took me some time to understand the behaviour and the jest docs don't tell much about it:

I want to mock
modules with jest and especially update the return values of module functions across my tests.

Consider you want to test a function called someFunctionToTest from a module called moduleA:

import {someFunctionToTest} from "moduleA";

test("It does something", () => {
    expect(someFunctionToTest()).toEqual({something: true});
});

Now you notice that the function relies on calling the method helper from moduleB. You want to mock that function
and simulate a return value:

Variant 1

import {someFunctionToTest} from "moduleA";
import {helper} from "moduleB";

jest.mock("moduleB");

test("It does something", () => {
    (helper as jest.Mock).mockReturnValue(true);
    expect(someFunctionToTest()).toEqual({something: true});
});

test("It does something else", () => {
    (helper as jest.Mock).mockReturnValue(false);
    expect(someFunctionToTest()).toEqual({something: false});
});

The trick - and its a bit counter-intuitive - is to import the mocked function as well. See line 2 where we import the helper method
into our test file. This is actually the mock function. The reason is that jest does some code shifting and altough the call to jest.mock
occures later, it will be executed before any imports are made. Therefore, helper is an instance of jest.fn() in our test file.

Now we can update the return values of our mocked function by calling mockedFunction.mockReturnValue(). There is only one catch: typescript
will complain that the imported helper has no function mockReturnValue to be called. Thats because typescript does not know that helper
is not the real thing but a mocked function. We can get around it by casting the type locally to jest.Mock.

Variant 2

After working some time with the variant 1, I came up with a variant 2 that may be more effective when you write lots of tests:

import {someFunctionToTest} from "moduleA";
import {helper as helperOriginal} from "moduleB";
const helper = helperOriginal as jest.Mock;

jest.mock("moduleB");

test("It does something", () => {
    helper.mockReturnValue(true);
    expect(someFunctionToTest()).toEqual({something: true});
});

test("It does something else", () => {
    helper.mockReturnValue(false);
    expect(someFunctionToTest()).toEqual({something: false});
});

This way, the helper method is not directly imported but imported as an alternatively named variable and then re-assigned and
casted to type jest.Mock.

There is also a third variant (if your linter allows you to use require()):

Variant 3

import {someFunctionToTest} from "moduleA";
const { helper } = require("moduleB") as { helper: jest.Mock };

jest.mock("moduleB");

test("It does something", () => {
    helper.mockReturnValue(true);
    expect(someFunctionToTest()).toEqual({something: true});
});

test("It does something else", () => {
    helper.mockReturnValue(false);
    expect(someFunctionToTest()).toEqual({something: false});
});

Pick whatever suits you the best. :)

This post was published on my personal blog, first.

You should follow me on dev.to for more tips like this. Click the follow button in the sidebar! 🚀

Introducing and using Obsidian

Christian Engel — Sun, 24 Apr 2022 07:37:23 +0000

I recently stumbled across a free app I never heard of before: Obsidian

Its an app for writing and organizing markdown text documents. While this does not sound like much, it changed my work life a lot and gave me such a positive impact that I wrote this post to share the app with you.

My struggle with taking notes

I read and learned about the art of note-taking before. I know that some sophisticated people keep huge collections of notes, thoughts and pieces of wisdom - for example in systems like the Zettelkasten which was already used by Jules Verne. I also read a story about a businessman some time ago who made a note with details about every person he ever met so he can look them up again when he would meet them again, sometimes after years.

While I always kept a classic note book in paper form near me, I only rarely used it. I am a very digital person - always working on lots of projects. Either for my employee or for myself. A note book is a linear medium. You fill page by page untill there is no more space. But my thoughts wander around. I sketch out an idea halfway through, then work on something else. Or I add more information to some topic later on. Thats difficult with a book. I always tried to leave some pages blank between unrelated topics, but it always gave me a feeling of limited space to express my thoughts. Also its not searchable. And not linkable. And I can't use it in the dark.

What makes obsidian valuable for me

The obsidian app is being installed on your device - be it a Windows, Mac or Linux desktop or an Android or iOS device - it works anywhere.
It creates a local folder with text files in it. Completely offline and completely yours. No cloud used, no account needed.
The texts can be formatted with markdown - complete with links and images.
You can go ahead and add or edit the text files in the folder with any other text editor.
It formats code blocks with beautiful syntax highlighting.
It can export your formatted texts as PDFs.
Writing texts in dark mode on my mobile is pure bliss.

On steroids with device sync

The app itself offers a paid sync feature for $4/mo (as the time of this writing). Since the app writes plain text to a folder on your device, you get some other options tough.

I went ahead with Syncthing, an open source file sync tool for Windows, MacOS, Linux and Android. Since it also works without a cloud or an account, it was the perfect solution for me. Apps like Dropbox or Google Drive dont sync a folder on your mobile and dont work in this case.

Setting it up on android was a bit tricky because of the security constraints but I eventually figured out how to make it work: the "Documents" Folder on my android device can be read/write accessed by any app with permission, so I set the Obsidian Vault location there. I then shared the vault folder through syncthing with my laptop.

Now, whenever I take notes on my mobile, I can pick them up on my laptop. Or when I write down extensive research on my laptop, I can browse and search it on my mobile when I'm on the run.

And since everything is markdown based, I even wrote this blog post in Obsidian. What a great and truly open piece of software!

I just started using obsidian in my everyday work and it already had a big impact on my workflow. I strongly suggest you to give it a try.

This post was published on my personal blog, first.

You should follow me on dev.to for more tips like this. Click the follow button in the sidebar! 🚀

A typed event system for Typescript

Christian Engel — Thu, 21 Apr 2022 16:42:51 +0000

I am working on a pet project with distributed services right now.

During the development, I was in need of a classic on/off style event system which is usually quickly written with
a couple lines of code. This time however, I wondered if it would be possible to have the whole event system type guarded
with Typescript types.

Get the code

I stored the whole 58 lines of code in a github gist. Please be aware that I don't take any responsibility if the code
does not work as intented or causes failures somewhere. Use it at your own risk.

How to use it

If you have ever worked with a on/off style event emitter, the usage of this system will be straight forward. I am still going
to explain it shortly.

How a basic on/off style event system works

You may skip to the next headline, if you know about this already :)

For an event system, you usually have points in your code which trigger events and broadcast the occurance of the events without
knowing if someone actually listens for them.

Other parts of your code may subscribe to the existing events and react on them. If you ever worked with events in the DOM of a website,
its exactly this pattern:

// Adding a callback function to "change" events on a text box.
// The callback is called every time when a change event happens.
document.getElementById("myCoolTextbox").addEventListener("change", function(event){
    // ...
});

So there may be infinite subscribers (listeners) to some event and whenever it gets triggered, all subscribers will be notified.

Prepare the types of your events

I designed the event system so you can create a typescript interface to define all your existing events as well as their data payloads.

If we for example want to create a fictional video player app with an event system, we could define the following events:

interface AppEvents {
    load: {
      filename: string;
      format: string;
      totalTimeMs: number;
    },
    update: {
        currentTimeMs: number;
    },
    play: void,
    pause: void,
    stop: void
}

So we have a load event when the user opens a file, an update event which fires continuously while playing back the file
and play, pause and stop events that are triggered upon user interaction.

Creating and using the event system

With our typescript interface at hand defining all events in our system, we can actually create the system in code:

// appEvents.ts
import createEventSystem from "./eventSystem.ts";

interface AppEvents {
    load: {
        filename: string;
        format: string;
        totalTimeMs: number;
    },
    update: {
        currentTimeMs: number;
    },
    play: void,
    pause: void,
    stop: void
}

const eventSystem = createEventSystem<AppEvents>();
export default eventSystem;

Now the system can be used from anywhere in our code. Typescript takes care that only known events can be triggered
and they need to receive exactly the expected payloads.

import appEvents from "./appEvents.ts";
import { loadAndParseAudioFile } from "./audioLoader.ts";

export async function loadFile(filename){
    const {
        filename,
        format,
        totalTimeMs
    } = await loadAndParseAudioFile(filename);

    appEvents.trigger("load", {filename, format, totalTimeMs});
}

On some other part of your application, your code may subscribe to the defined events:

// logger.ts
import appEvents from "./appEvents.ts";

appEvents.on("load", (payload) => {
    console.log(`You opened the file ${payload.filename} with a length of ${payload.totalTimeMs} milliseconds.`);
});

Stop listening to an event

To detach from receiving events, one needs to call the .off() method and pass the exactly same callback function to the
off handler:

function handler(data){
    console.log("An update happened!", data);
}

eventSystem.on("update", handler);

// And somewhere else:
eventSystem.off("update", handler);

Please be aware that it needs to be the same callback function and not another one, with similar code.

THIS WONT WORK!

eventSystem.on("update", (data) => {
    console.log("An update happened!", data);
});

eventSystem.off("update", (data) => {
    console.log("An update happened!", data);
});

// These are TWO separate functions, therefore the "off" call did not work.

Using ENUMs as event names

Since typescript interfaces do not care about the format of field names, you are free to define an ENUM to keep your
existing event names for better discoverability in your IDE:

export enum EventNames {
    LOAD,
    UPDATE,
    PLAY,
    PAUSE,
    STOP
};

interface AppEvents {
    [EventNames.LOAD]: {
        filename: string;
        format: string;
        totalTimeMs: number;
    },
    [EventNames.UPDATE]: {
        currentTimeMs: number;
    },
    [EventNames.PLAY]: void,
    [EventNames.PAUSE]: void,
    [EventNames.STOP]: void
}

This way, you can call your triggers and subscriptions like this:

eventSystem.trigger(EventNames.PLAY);

eventSystem.on(EventNames.UPDATE, ({currentTime}) => {
    console.log(`Current time: ${currentTime}`);
});

-------------

This post was published on my [personal blog](https://parastudios.de/), first. 

You should follow me on dev.to for more tips like this. Click the follow button in the sidebar! 🚀

DEV Community: Christian Engel

Advanced LLM Prompting Techniques: A Guide for Software Engineers

PLANSEARCH: Improving reasoning for LLMs

🛑 Stop Coding Already! 🛑

🚀 Enhancing OAuth Security & User Experience 🔒

Hello world, this is RoboStreamer

About me

Why I started working on RoboStreamer

How RoboStreamer works

Thanks for reading!

Limit access of Strapi users to their own entries

Extend the Strapi controller

The create() method

Why the two step process?

The find() method

The other methods

Strapi quirks you should know about

The admin UI skips all business logic implemented into the API

There are users and then there are users

Ralations to the users table are complicated

Mocking modules with jest and typescript

Variant 1

Variant 2

Variant 3

Introducing and using Obsidian

My struggle with taking notes

What makes obsidian valuable for me

On steroids with device sync

A typed event system for Typescript

Get the code

How to use it

How a basic on/off style event system works

Prepare the types of your events

Creating and using the event system

Stop listening to an event

THIS WONT WORK!

Using ENUMs as event names

The `create()` method

The `find()` method