DEV Community: longlivevue

How Safe Is Your SaaS in the Age of AI?

longlivevue — Tue, 06 Oct 2026 21:37:06 +0000

Introduction

As software developers, all of us have had the thought:

“I don't want to keep doing this forever. Why don't I look for a problem in the market, build a tech solution for it, and sell it?”

But how good is the idea of building a SaaS or a software product in this time?

Building SaaS Then vs Now

What used to be a challenge for people who were making SaaS back then, pre-AI era, was how much effort it took to build it.

You had to have a market research expert, a UI/UX designer, a group of developers, a marketing team, a big budget, and with all of that, you'd get an MVP after two years.

And it would take about five years for your solution to actually start growing.

Now, all you need is a $200 Claude Max subscription.

Claude can research, do UI/UX design, get you an MVP in 24 hours, and even find clients and send marketing campaigns for you.

If you're good enough with prompting and you actually know how to use AI.

How Fast Can You Ship Software Nowadays?

To share a real experience from my life.

The System

Me and a friend of mine work with a legacy, large-scale, closed-source system as end users on a daily basis.

It costed millions of dollars to make and has over a decade of development behind it.

The annoying thing was onboarding new people to this system, or even just working with it.

The system has around 300 screens, dozens of features, many concepts to understand, and a very big documentation with thousands of pages.

The First Idea

Our first thought was simple:

Let's build a knowledge base, link it to Claude via MCP, and let it guide people whenever they have a question about the system.

It took us two days of scraping, but we had it done.

Let's See What AI Can Actually Do

After that, we thought about a challenge to test out how good AI actually is.

With the big context and knowledge base we had built, we put a Claude Max x20 subscription and used Opus 5.5 as the orchestrator, with a good set of skills and a good framework setup.

To avoid building everything from scratch, we used all the libraries and technologies needed for our use case, but without building any exact feature ourselves.

Only open-source tools.

The Challenge

We created what we thought was the perfect environment and told it:

Clone the whole thing.

We used 15 sub-agents.
50 million tokens were burned.
It finished in less than 24 hours.
It costed around $800 in usage.

The Result

And the result?

A better UI, An easier UX, Faster, Less tech debt.

And it costed roughly 1,000x cheaper to build.

And let's not even talk about the time.

Of course, it still needs more optimisation. It's not a production-ready replacement that you can just deploy and forget about.

But the fact that it cloned all of those features, concepts, and workflows in less than a day is just... crazy.

So, How Safe Is Your Idea?

If you're waiting for an answer or a conclusion, you won't find it here.

That's not really the point.

The goal of this article is to open a discussion.

How safe is your idea, your SaaS, or your effort in the age of AI?

What distinguishes your solution from the solution your competitor is going to build 24 hours after seeing your idea?

If the cost and time required to build software keep dropping this fast, what actually becomes the moat?

Is it the technology? The execution? The data? The users? The brand?.

Or simply being the first one to build it?

Interesting times we live in.

How to Dynamically Recognize Mobile Mode Using Pinia in Nuxt.js

longlivevue — Wed, 05 Feb 2025 23:06:49 +0000

In this blog, we’ll walk through how to manage the mobile mode state in a Nuxt 3 application using Pinia, Vue’s state management library.
1- Install Nuxt.js and Pinia
First, if you haven't already, create a new Nuxt 3 project and install the necessary dependencies.

npx nuxi init my-nuxt-app
cd my-nuxt-app
npm install
npm install pinia

2- Create a Store to Manage the Mobile Mode State
Next, define a store using Pinia to manage the state of the mobile mode. This store will track whether the app is in mobile mode (based on the window size).

import { defineStore } from 'pinia';

export const useResponsiveStore = defineStore('responsive', {
  state: () => ({
    mobileMode: false,
  }),
  actions: {
    setMobileMode(value) {
      this.mobileMode = value;
    },
  },
});

3- Set Up Pinia in Nuxt
You need to create a plugin to integrate Pinia into your Nuxt 3 app. This plugin will ensure that the store is available globally.

Create a new file under plugins/pinia.js:

import { createPinia } from 'pinia';

export default defineNuxtPlugin((nuxtApp) => {
  const pinia = createPinia();
  nuxtApp.vueApp.use(pinia);
});

Then, make sure to register this plugin in your nuxt.config.js:

export default {
  plugins: ['~/plugins/pinia.js'],
};

4- Update Mobile Mode Based on Window Size
To handle window resizing, use a global layout or component that listens for window size changes and updates the mobile mode state accordingly.

<template>
  <div>
    <Navbar />
    <main>
      <slot />
    </main>
    <Footer />
  </div>
</template>

<script setup>
import { onMounted, onUnmounted } from 'vue';
import { useResponsiveStore } from '~/stores/useResponsiveStore';

const responsiveStore = useResponsiveStore();

const handleResize = () => {
  responsiveStore.setMobileMode(window.innerWidth < 768);
};

onMounted(() => {
  handleResize();
  window.addEventListener('resize', handleResize);
});

onUnmounted(() => {
  window.removeEventListener('resize', handleResize);
});
</script>

5- Use the Mobile Mode State in a Component
Now, let's create a simple component that conditionally renders content based on the mobile mode state.

<template>
  <div>
    <p v-if="mobileMode">You are in mobile mode.</p>
    <p v-else>You are in desktop mode.</p>
  </div>
</template>

<script setup>
import { computed } from 'vue';
import { useResponsiveStore } from '~/stores/useResponsiveStore';

const responsiveStore = useResponsiveStore();
const mobileMode = computed(() => responsiveStore.mobileMode);
</script>

With this setup, your Nuxt 3 app will dynamically adjust based on the user's screen size, and you can easily manage the mobile mode state using Pinia.

Aggregation

longlivevue — Wed, 08 Jan 2025 16:31:43 +0000

I18n vue

longlivevue — Thu, 19 Dec 2024 12:12:40 +0000