simple wordpress block native .js

block.js

// put this .js on your theme  /blocks/ folder name it your-block.js

(function () {
    var registerBlockType = wp.blocks.registerBlockType;
    var RichText = wp.blockEditor.RichText;

    registerBlockType('your-theme/block', {
        title: 'Your Block',
        description: 'Add a title and description',
        icon: 'smiley',
        category: 'common',
        attributes: {
            title: {
                type: 'string',
                source: 'html',
                selector: 'h2',
            },
            description: {
                type: 'string',
                source: 'html',
                selector: 'p',
            },
        },
        edit: function (props) {
            var blockProps = wp.blockEditor.useBlockProps();

            var onChangeTitle = function (newTitle) {
                props.setAttributes({ title: newTitle });
            };

            var onChangeDescription = function (newDescription) {
                props.setAttributes({ description: newDescription });
            };

            return wp.element.createElement(
                'div',
                blockProps,
                wp.element.createElement(
                    RichText,
                    {
                        tagName: 'h2',
                        placeholder: 'Enter a title',
                        value: props.attributes.title,
                        onChange: onChangeTitle,
                    }
                ),
                wp.element.createElement(
                    RichText,
                    {
                        tagName: 'p',
                        placeholder: 'Enter a description',
                        value: props.attributes.description,
                        onChange: onChangeDescription,
                    }
                )
            );
        },
        save: function (props) {
            var blockProps = wp.blockEditor.useBlockProps.save();

            return wp.element.createElement(
                'div',
                blockProps,
                wp.element.createElement('h2', null, props.attributes.title),
                wp.element.createElement('p', null, props.attributes.description)
            );
        },
    });
})();

functions.php

<?php


// this is how you register your simple block on theme fucntions.php
 function your_theme_enqueue_block_editor_assets() {
    wp_enqueue_script(
        'your-block',
        get_template_directory_uri() . '/blocks/your-block.js',
        array( 'wp-blocks', 'wp-block-editor', 'wp-element' ),
        filemtime( get_template_directory() . '/blocks/your-block.js' )
    );
}

add_action( 'enqueue_block_editor_assets', 'your_theme_enqueue_block_editor_assets' );