JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js"></script>
<div class="set1">
<p>First Name: <span data-bind="text: firstName">firstName</span></p>
<p>Last Name: <span data-bind="text: lastName">lastName</span></p>
<p>Full Name: <span data-bind="text: fullName">fullName</span></p>
</div>
<div class="set2">
<p>First Name: <span data-bind="text: firstName">firstName</span></p>
<p>Last Name: <span data-bind="text: lastName">lastName</span></p>
<p>Full Name: <span data-bind="text: fullName">fullName</span></p>
</div>
<div class="set3">
<p>First Name: <span data-bind="text: firstName">firstName</span></p>
<p>Last Name: <span data-bind="text: lastName">lastName</span></p>
<p>Full Name: <span data-bind="text: fullName">fullName</span></p>
</div>

CSS

div
{
    border: 1px solid black;
}

JavaScript

var args = {
    firstName: 'John',
    lastName:  'Doe'
};

try
{
    function ViewModel1(args) {
        var self = this;

        self.firstName = ko.observable(args.firstName);
        self.lastName = ko.observable(args.lastName);
        self.fullName = ko.computed(function () {
            return self.firstName() + ' ' + self.lastName();
        });
    }
    ko.applyBindings(new ViewModel1(args), $('div.set1')[0]);
}
catch (e)
{
    alert('ViewModel1 failed: ' + e);
}

try
{
    function ViewModel2(args) {
        var self = this;

        self.fullName = ko.computed(function () {
            return self.firstName() + ' ' + self.lastName();
        });
        self.firstName = ko.observable(args.firstName);
        self.lastName = ko.observable(args.lastName);
    }
    ko.applyBindings(new ViewModel2(args), $('div.set2')[0]);
}
catch (e)
{
    alert('ViewModel2 failed: ' + e);
}

try
{
    function ViewModel3(args) {
        var self = this;
        var initializing = ko.observable(true);
    
        self.fullName = ko.computed(function () {
            if (!initializing()) {
                return self.firstName() + ' ' + self.lastName();
            }
        });
        self.firstName = ko.observable(args.firstName);
        self.lastName = ko.observable(args.lastName);
        
        initializing(false);
    }
    ko.applyBindings(new ViewModel3(args), $('div.set3')[0]);
}
catch (e)
{
    alert('ViewModel3 failed: ' + e);
}