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

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>;
;
}
;