Intro

The way we are building software is changing and I see more and more people that don’t have any previous engineering experience, trying to build something.

Some have more success than others, but overall → we can all agree that AI has made building things a lot more approachable to everyone.

That’s also where the term “vibe coding” is coming from. It’s all about telling AI what to do instead of making the changes yourself.

In today’s article, we are diving into what exactly vibe coding is and I am sharing my take if it will be the future of Software Engineering. I’ve also built a quick clone of my newsletter’s first page with this approach, so definitely read on to check it out!

This is an article for paid subscribers, and here is the full index:

- So, what exactly does vibe coding mean?
- Here is how you can use vibe coding to build a clone of my newsletter’s first page
- Now, this is all fun and great, but here is the problem
🔒 So, here is my take if vibe coding is the future of Software Engineering
🔒 More and more people will have a shallow understanding of engineering practices
🔒 It’s great for building MVPs and prototypes
🔒 Last words

Resources mentioned in the article:

• How to use AI to increase Software Development productivity

Let’s get straight into it!

So, what exactly does vibe coding mean?

Well, there are several ways we could frame this and different people might refer to it differently, but it ultimately means the following:

Vibe coding is a way to create software by using plain English via prompts to an LLM and it returns the code needed for the desired behavior of that software.

No need for coding skills, just the right prompts and AI does all the rest. You normally first start with some starter template, which can either be a Next.js starter boilerplate, similar to this one or whichever template you prefer.

And then AI adjusts the template to support the desired functionalities and also creates the user interface that you wish to have.

Here is how you can use vibe coding to build a clone of my newsletter’s first page

After you have the initial template setup, let’s say that we want to create a clone of my newsletter’s first page.

You can do a prompt something like this:

This will then generate a similar UI then my newsletter’s first page. Here is how the generation looks like:

It automatically generates the code required and it will also ask you some sub-questions while doing that. You need to also accept the changes made.

And if some error occurs, you just need to do the following prompt:

Or something more detailed where you copy and paste a certain piece of code or output from the terminal (Lines 167-178 on top):

So, after you go through this, you get a similar site then my newsletter’s first page.

This is how my newsletter’s first page looks like:

And this is the version built by AI:

It generated a decent first page and with a few tweaks, we could make it look quite similar to the actual first page.

It’s a fun way to build software because there’s a lot of magic happening under the hood and you see the actual changes being generated + how AI approaches them.

And of course, this is just the UI part of the app and we would need to build the whole backend as well to mimic the necessary functionalities needed to publish newsletter articles.

But we could potentially also set up a simple backend for publishing articles by doing these prompts further.

Now, this is all fun and great, but here is the problem

The problem is when you are relying on AI too much and you don’t have the necessary expertise in order to be able to understand what’s actually happening.

Here is an example of one of the people who built a SaaS product, but didn’t put the right security in place in order to avoid the security risks.

His site got attacked multiple times and it will take time for them to figure out what’s going on or potentially they will need some assistance from someone who knows what’s happening.

So, here is my take if vibe coding is the future of Software Engineering...