How to create a React.js file in PhpStorm for WordPress Gutenberg

Question

So I am learning on how to work with Gutenberg, and a lot of these tutorials are showing their code in .jsx I believe. I've done a lot of looking up but am unsure if I'm doing this right.

I've tried using a TypeScript file, and when I paste the React code within there, it asks if I'd like to switch to a React file format. I say yes, and it creates a .jsx file, which compiles to a .js file.

However, the code I paste, within WordPress gives me an error:

Invalid regular expression: missing /

I'm not sure if I'm setting the files up right, or if there's something else I'm doing wrong. I pasted my code below

.JSX

const { registerBlockType } = wp.blocks;

registerBlockType('base-theme/tile-block', {
    title: "Tile Block",
    icon: 'welcome-write-blog',
    category: 'common',
    edit() {
        return (
            <div>Only the editor will show this</div>
        );
    },
    save() {
        return (
            <div>Only the front end will show this</div>
        );
    }
});

.JS Compiled

var registerBlockType = wp.blocks.registerBlockType;
registerBlockType('base-theme/tile-block', {
    title: "Tile Block",
    icon: 'welcome-write-blog',
    category: 'common',
    edit: function () {
        return Only;
        the;
        editor;
        will;
        show;
        this < /div>;
    }
});
save();
{
    return Only;
    the;
    front;
    end;
    will;
    show;
    this < /div>;
    ;
}
;