Connect index.py to app.py

Dash Python
#1

Hi there. This is the first question I post with code inside, so I hope it will not be messy.

I’m following along Charming Data’s video on multipage apps, and I encountered a little inconvenient which is I don’t use PyCharm or other IDEs, I’ve always used Jupyter notebook.

Therefore, instead of having an index.py and app.py, I’m using the ipynb format (index.ipynb and app.ipynb).
However, it’s not working. If I keep the files as .py it works, but not ipynb.

I could convert the files to .py no problem, but it’s better for me to use ipynb because I get the error messages when something is messed up with the code. What do you suggest me to do? Should I download and use Pycharm? I already used it and I don’t like it as much as Jupyter Notebook, so it would be nice to solve the problem.

Below is the app.py / app.ipynb code

#this app.py (app.ipynb) is used to initiate the app

import dash

#metatags are required for the app to be responsive on the web
app = dash.Dash(__name__, 
                suppress_callback_exceptions = True,
                meta_tags = [{'name':'viewport',
                             'content':'width=device-width, initial-scale=1.0'}]
                )

server = app.server

Below is the index.py / index.ipynb code

#this is the landing page of your web app, the first page the user is going to see

import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output

#connect to app.py
from app import app #(from app.py)
from app import server #(from app.py)

#connect to the app pages
from apps import vgames, global_sales #vgames.py and #global_sales.py

#layout of the app
app.layout = html.Div([
    
    html.Div([dcc.Link('Video Games|', href='/apps/vgames'),
              dcc.Link('Other products', href='/apps/global_sales')
    ], className='row'),
    
    dcc.Location(id='url',
                 refresh=False,
                 pathname=''), #dcc.Location allows to read what the url is, through the pathname. Pathname is empty, but as soon as we click on 'Video Games' or 'Other products', the href will populate this pathname
    
    html.Div(id='page-content', children=[]) #children SUPER DUPER improtant, because it is literally the content of all our pages. The content will get there via callbacks
    
])

and this is the error I get when I run index.ipynb

---------------------------------------------------------------------------
ModuleNotFoundError                       Traceback (most recent call last)
/var/folders/s9/cwt1jrsx719bq12n99m5wvsw0000gn/T/ipykernel_2076/1224751838.py in <module>
      6 
      7 #connect to app.py
----> 8 from app import app #(from app.py)
      9 from app import server #(from app.py)
     10 

ModuleNotFoundError: No module named 'app'