Launched is a tool to make website content editable to clients with no codebase access or coding knowledge required. It was created by Michael Beck for the Launch platform.
To get started, check out https://launched.tech for documentation, guides, and demos.
Note
Launched is still in development. Be careful when using it in production.
npm install launched<!-- Include the Launched library -->
<script
type="module"
src="https://cdn.jsdelivr.net/npm/launched@latest/dist/bundle.js"
></script>
<!-- Include necessary dependencies -->
<script
crossorigin
src="https://cdn.jsdelivr.net/combine/npm/[email protected]/umd/react.production.min.js,npm/[email protected]/umd/react-dom.production.min.js"
></script>
<script
crossorigin
src="https://update.greasyfork.org/scripts/499179/1402245/react_jsx-runtime-umd.js"
></script>
<!-- Include stylesheets -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/launched@latest/dist/ui/globals.css"
/>// src/index.jsx
/* Import the Launched provider */
import { LaunchedProvider } from "launched";
...
/* Add the provider to your app */
root.render(
<LaunchedProvider>
<App />
</LaunchedProvider>
);// src/app.jsx
/* Import the Launched Text element */
import { Text } from "launched/components";
...
export default function App() {
return (
<div>
<Text tag="title" element="h1">Hello, world!</Text>
<Text tag="description">Welcome to my site.</Text>
</div>
)
}<!-- index.html -->
<!-- Initialize Launched -->
<script type="module" defer>
const { Launched } = launched;
const l = new Launched({
mode: "static",
save: (data) => console.log(data),
determineVisibility: () => true,
});
</script>
...
<body>
<h1 data-tag="title">Hello world!</h1>
</body>ISC