Issue making UI changes in Superset

[Mr-PU]

I installed, superset through git and in order to make the superset command run I installed, it through pip as well inside an environment. Now I am trying to make UI changes in the code, inside superset-frontend, but those changes are not reflecting.

What exactly should I do this to make changes in the UI?

[dosubot[bot]]

Hey @Mr-PU! 👋 I'm here to help you with bugs, questions, and becoming a contributor. Let's tackle this together!

To make UI changes in Superset's superset-frontend code reflect, follow these steps:

1. Run Superset locally using Flask on port 8088:

   superset run -p 8088 --with-threads --reload --debugger --debug

2. In parallel, run the Webpack dev server locally on port 9000:

   npm run dev-server

3. Access http://localhost:9000 in your web browser:
   This will use the hot-reloading front-end assets from the Webpack development server while redirecting back-end queries to Flask/Superset. Your changes on the Superset codebase — either front or back-end — will then be reflected live in the browser.

By following these steps, you ensure that your UI changes are immediately visible without needing to restart the server or manually refresh the assets ^[1].

To continue talking to Dosu, mention @dosu.

[mayur249]

Hey @dosu when I run this command "superset run -p 8088 --with-threads --reload --debugger --debug", it is giving me some other error viz as follows:

--------------------------------------------------------------------------------
                                    WARNING
--------------------------------------------------------------------------------
A Default SECRET_KEY was detected, please use superset_config.py to override it.
Use a strong complex alphanumeric string and use a tool to help you generate 
a sufficiently random sequence, ex: openssl rand -base64 42 
For more info, see: https://superset.apache.org/docs/configuration/configuring-superset#specifying-a-secret_key
--------------------------------------------------------------------------------
--------------------------------------------------------------------------------
Refusing to start due to insecure SECRET_KEY

According to given information given in the doc, I have also added a updated SECRET_KEY but still I am getting the same error

[mayur249]

Hello @Mr-PU , were you able to resolve the issue which you are mentioning here in the first comment ?

[mayur249]

And @dosu , I think what you suggested is basically to run the BE server in 8088, but that I am already doing using docker

[samarsrivastav]

hey @mayur249 , were you able to solve this issue?

[mayur249]

Hey @samarsrivastav, yeah it is solved.

Try following the below steps:

1. Clone the superset repo
2. Checkout to the latest release tag
3. Inside superset folder run this command "docker compose -f docker-compose.yml up" (Running any other .yml file will not reflect your code changes, you have to run the mentioned .yml file)
4. That's it.

And also make sure you have docker desktop installed, it will be easier to monitor your superset container.

[samarsrivastav]

Hey @mayur249 @dosu tried but stuck with this loading screen !!

[mayur249]

The docker command viz "docker compose -f docker-compose.yml up" it takes time when you run it for first time, when its done you can check the browser.

[samarsrivastav]

in the terminal it is completed

[mayur249]

try one thing, open your docker desktop and delete everything related to superset i.e containers, images, volumes, builds etc. Then try running this command again and check

[Neang-Rothmny]

May I ask you, how you deploy superset in production?

[samuel-antonini]

I've encountered the same problem. I've made some UI changes and ran the build production command, but the documentation isn't very clear on the best practices on how to deploy these custom changes to production. I did not want to use docker... could anyone point me to the right direction on how to do this?