React web application inside theia ide

i have created a docker image of eclipse theia ide and i have import my react js code in ide and then running that react js project it running but i want to see the application preview of react inside my theia ide instead of different page. is there a way un theia or any plugin through which we can see out application webpage

Hey @Jay-Bhatt98,

You’re probably looking for the @theia/mini-browser package. It allows to handle Iframes in Theia widgets and should allow to easily embed a React application inside of Theia.

hey @msujew
this is my package.json
“private”: true,
“theia”: {
“frontend”: {
“config”: {
“warnOnPotentiallyInsecureHostPattern”: true,
“applicationName”: “My App”,
“preferences”: {
“files.enableTrash”: false
“welcome”: {
“enabled”: false
“dependencies”: {
@theia/callhierarchy”: “latest”,
@theia/file-search”: “latest”,
@theia/git”: “latest”,
@theia/markers”: “latest”,
@theia/messages”: “latest”,
@theia/navigator”: “latest”,
@theia/outline-view”: “latest”,
@theia/plugin”: “latest”,
@theia/plugin-dev”: “latest”,
@theia/plugin-ext”: “latest”,
@theia/plugin-metrics”: “latest”,
@theia/plugin-ext-vscode”: “latest”,
@theia/preferences”: “latest”,
@theia/preview”: “latest”,
@theia/search-in-workspace”: “latest”,
@theia/terminal”: “latest”,
@theia/vsx-registry”: “latest”,
@theia/mini-browser”: “latest”
“devDependencies”: {
@theia/cli”: “latest”,
“https-proxy-agent”: “^7.0.1”
“scripts”: {
“prepare”: “yarn run clean && yarn build && yarn run download:plugins”,
“clean”: “theia clean”,
“build”: “theia build --mode production”,
“start”: “theia start --ssl --plugins=local-dir:plugins --host --port 4200”,
“download:plugins”: “theia download:plugins”
“theiaPluginsDir”: “plugins”,
“workspaces”: [
“theiaPlugins”: {
“eclipse-theia.builtin-extension-pack”: “”,
“EditorConfig.EditorConfig”: “”,
“dbaeumer.vscode-eslint”: “”,
“ms-vscode.js-debug”: “”,
“ms-vscode.js-debug-companion”: “
“theiaPluginsExcludeIds”: [
i want when i start my react project there should be a preview browser mode or mini browser to see it in theia ide

@Jay-Bhatt98 You’ll need to create an instance of a mini browser widget that points to the url of your react app on Theia startup. I don’t have an example at hand right now, but you should be able to get there by taking a closer look at the @theia/mini-browser package implementation linked above.