Changing project from node js to Html?

Wappler General Need Help
1

Hi guys,
@ben
This is an interesting challenge:

  • I set up a project using NodeJs and have proceeded with designs and API’s etc in that project.

  • I have just found out that it may have to be a non NodeJs and instead be HTML based.

  • I know if I simply change the project settings then everything could be lost.

  • I have experimented with copying the code from each page and placing into a test HTML project page.

  • Obviously some issues as there is some code relating to the NodeJS set up / .EJS files etc.

  • And I attempt to save Wappler insists the page does not exist even as … @@

  • I don’t wish to recreate the core of the project again (UI, API, server actions etc).

  • Anyway is there a fix for this and for the copied code - what code NodeJS / EJS /etc code should I look for - (find and replace / delete), to allow the page to recognised in the HTML format?

Attached are reference to

  • the present ‘NofeJS’ file - named Node
  • a file format in HTML that developer colleague set up

Thanks

Html-version1
Html-version11129×708 53.6 KB
NodeJs-1
NodeJs-11156×717 62.5 KB
NodeJs-2
NodeJs-21212×737 64 KB
HTMLversion 2
HTMLversion 21214×743 54.7 KB

2

That is quite easy. Just create static documents and you are done.

image
image1036×325 75.1 KB

3

Thanks @ben - will try tmrw.
Just to clarify process-

  • should I just switch project settings first
  • create a new project in the html
    Format and then copy in code for the pages
    Or ?!
    Sorry just not clear how I should proved ,
    As may **** it up!
    Thanks!!
4

Sorry on my phone- so typing area restricted!! Excuse typos

5

Hi @UDX I’m getting the impression you’re relatively new to all this.

If not, please forgive me as I will give you some tips that are aimed at a beginner.

  1. These .EJS files are HTML files but with embedded javascript templating. https://ejs.co/

A very simple explanation for this is that it functions exactly the same as a .html file, yet it has some extra benefits. You can insert data from the server before rendering.
This is exactly what wappler is doing to give you the ‘layout’ and ‘content’ page system.
If you make a new layout page you’ll see something like this:

<!doctype html>
<html>

<head>
    <base href="/">
    <script src="/dmxAppConnect/dmxAppConnect.js"></script>
    <meta charset="UTF-8">
    <title>Untitled Document</title>

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/bootstrap/5/css/bootstrap.min.css" />
    <link rel="stylesheet" href="/css/style.css" />
    <script src="/dmxAppConnect/dmxRouting/dmxRouting.js" defer></script>
    <script src="/dmxAppConnect/dmxBootstrap5Toasts/dmxBootstrap5Toasts.js" defer></script>
    <script src="/dmxAppConnect/dmxBootstrap5Navigation/dmxBootstrap5Navigation.js" defer></script>
</head>

<body is="dmx-app" id="checkoutLayoutv2">
    <div is="dmx-view" id="content">
        <%- await include(content, locals); %>
    </div>
    <script src="/bootstrap/5/js/bootstrap.bundle.min.js"></script>
</body>

</html>

First notice that it starts with <!doctype html> ? This is basically an html file.
Secondly, you notice the <%- await include(content, locals); %> ? This is EJS.

When the user goes to the page, the server will have to render this page for the user. While rendering it combines the layout page with the content page.
It puts ALL the code you can find in the content-page.ejs into the place of <%- await include(content, locals); %> on the layout page.

I hope this helps with giving you a better understanding of what EJS does + what wappler is doing for you by default when you have a node project.

Do you NOT want a node server?
If that’s true: you need to make a new .HTML file and copy the code of the layout page + the code of the content page into that 1 HTML file.

If you want to keep your node server but for some reason don’t want .ejs files: then I don’t see the point yet of getting rid of .ejs files.

1 Like
6

Thanks - yes am new to this.
So that is helpful! Appreciate

Will trial in next day or so - when get the time!
Boss is demanding some results! :+1:

1 Like
7

Keep in mind that if you do the site as .html files. You can’t use the server connect actions, etc. That requires server side formats such as Node, php or asp.

Why does your site have to be HTML only?

2 Likes