Create an .mdx file
.mdx
file in the src/pages
directory to create a page in your web application. The URL is generated based on the file path.Add page title
.mdx
file. The first heading in the page is treated as the title.Place components
Start development server
src/pages/new-page-1.mdx
-> /new-page-1
src/pages/new-page-2/index.mdx
-> /new-page-2
src/pages/new-page-3/sub-page.mdx
-> /new-page-3/sub-page
src/pages/_app.tsx
You can set up global layouts. Child routes are placed in <Outlet>
.
404.tsx
You can set up a global 404 page.
defineState()
defineState()
to declare state. defineState()
takes an object as an argument and sets it as the initial value.
.value
.value
property as follows:
defineState()
every time like in this example, you can shorten it by destructuring the variables..update()
update()
method to update state.
defineState()
.
For more details, refer to Input Components.
Using input components makes it easy to reflect user input to state.
variables
property.
By passing the values of states declared with defineState()
to this property, you can pass user input values to Python functions or SQL files.
loadData()
loadData()
function to get execution results from Python or SQL.
State
defined with defineState()
.
When State
is passed, data is retrieved again when the State
value changes.QueryState<T>
object is returned.