I really do not want to update Client Copy

Alfred Nutile
2 min readAug 21, 2023
Copy.vue component

With every website I create, numerous “copy” changes are inevitable. Since I use Laravel to build web applications, there are many fields, labels, and descriptions that require adjustments. To simplify this process for my clients, I’ve devised a method for them to make these changes on their own. However, this approach currently requires them to log into GitHub (until I develop a user interface) and edit a file directly.

Here’s how it works:

  1. Create a file named “app/copy.php” to house all the copy.
  2. Then write the intial copy within this file.

For example:

<?php
return [
'section_name' => [
'area_1' => 'some copy',
'area_2' => 'some copy',
],
'section_name_2' => [
'area_1' => 'some copy',
'area_2' => 'some copy',
],
];

Then since I am using Inertia I add this line to “app/Http/Middleware/HandleInertiaRequests.php”

        return array_merge(parent::share($request), [
'environment' => app()->environment(),
'copy' => config('copy'),

From here I have access to it from VueJS so I made a component “Components/Copy.vue”

<template>
<div :class="classValue">
{{ output }}
</div>
</template>

<script setup>
import {computed} from "vue";
import { Link, useForm, usePage } from '@inertiajs/vue3';

const props = defineProps({
section: String,
copy: String,
classValue: {
type: String,
default: "text-gray-500 text-sm"
}
})

const output = computed(() => {
return usePage().props.copy[props.section][props.copy]
})

</script>

<style scoped>

</style>

Then when I want to use it I can just add it to another component like this:

<div>
<Copy class="text-white" section="section_name_2" copy="area_2"/>
</div>

And that is it. Well kind of.

Once you convince a client GitHub is not that scary and show them how to edit that ONE file it will trigger my ci/cd build which you can see how easy this is to automate here https://alfrednutile.info/posts/256

Then when the build is done and deployed thanks to https://envoyer.io/ it is updated!

--

--

Alfred Nutile

Laravel, LaraChain, Vue, Inertia, Tailwind developer