A set of PHP & JavaScript packages to solve every day frontend problems featuring Stimulus and Turbo.
$ composer require symfony/webpack-encore-bundle symfony/stimulus-bundle
$ npm install
$ npm run watch
Stimulus Controllers
<div {{ stimulus_controller('markdown') }}>
<textarea
{{ stimulus_target('markdown', 'input') }}
>Writing JavaScript is a **dream** with Stimulus 🤩</textarea>
<button {{ stimulus_action('markdown', 'render') }}>
Convert <i></i>
</button>
<div {{ stimulus_target('markdown', 'preview') }} >
<small>(click "Convert")</small>
</div>
</div>
import { Controller } from '@hotwired/stimulus';
import snarkdown from 'snarkdown';
export default class extends Controller {
static targets = ['input', 'preview'];
render(event) {
const rendered = snarkdown(this.inputTarget.value);
this.previewTarget.innerHTML = rendered;
}
}
Components