Creating the First File
The first thing we will do is create code that will give us a page with a catalog of paintings. To write such code, let's create our first file.
In front of us, we see the development environment (IDE), which contains all the files of our account. The list of files and folders is on the left side; there we can also add a new file. To do this, we use the bottom-left button, which is called "Add File".
- Click "Add File"
- A file type selection will appear, in it select Server TypeScript
In the window that appears, enter the file name backend and click the Create button:
So, the file is created, we see its name on the left side and its code in the central part of the screen.
Click Preview to see the result of executing this code on the right side. Currently, this file has a standard mobile screen created using our visual framework AppUI, designed for building mobile applications.
We will create our web service in HTML style for now, so let's delete all the content of the file and insert something else.
import {jsx} from '@app/html-jsx'
app.html('/', async(ctx,req) => {
return <html>
<h1>Catalog of Paintings</h1>
</html>
})
On the right, you will see that the file has been updated, and as a result, it should look like this:
Let's Understand What This Code Does
import {jsx} from '@app/html-jsx'
The first line allows us to include HTML as markup. By default, AppUI suitable for creating mobile screens is enabled in TypeScript files, but we will write this application in HTML.
The rest of the code registers an application handler that returns the page content when a user accesses this file.
app.html('/', async(ctx,req) => {
return <html>
<h1>Catalog of Paintings</h1>
</html>
})
Let's open this file and enter the address in the browser: https://<account.domain>/backend
Note: In the case of a GetCourse account, you need to add the prefix /chtm to the address https://<account.domain>/chtm/backend
