Is there an easy way to add entirely new content using the Moovweb SDK?

Question

I'm trying to make a simpler version of Facebook but want to construct a landing page from scratch. Right now, I'm doing something like

home.ts

$("/html/body") {
  remove("./*")
  insert("div", id: "wrapper") {
    insert("div", id: "categories") {
       insert("span", class: "category", "timeline")
       insert("span", class: "category", "pictures")
       ...

This method of "hardcoding" HTML is pretty tedious. Is there a way I can just insert my own HTML file, and better yet, not even fetch the original homepage (since it's not being used at all)?

Answer 1

The answer is yes, you can!

With a new feature in SDK version 4.5+ called Static Paths, you can do this!

Here are the instructions to do this:

First you must make sure you are running SDK version 4.5.73 or higher.

Then you have to configure your Mixer.lock file to use the mixer core-rewriter 2.1.74 or higher.

In your config.json file, add a new key called static_paths to the object:

{
  "host_map": [ "$.example.com => www.example.com" ],
  "static_paths": { "/new/path": "new_page.html" }
}

The value of this new static_paths key is an object with new paths.

The key "/new/path" is a new path that you want to hit in your browser: In this case, the resulting URL (if you are developing locally) will be http://mlocal.example.com/new/path

The value "new_page.html" is a brand new page that you will create under your assets/ folder.

When a request is made for /new/path, the server will respond with the content from new_page.html!

You can put multiple static paths, but keep in mind if you create a path that exists on the original site, you won't be able to get the content from there!

This method is great for making pages that only make sense on mobile sites and is a perfect example of responsive content delivery!