Skip to content

Create Controllers

Jump to bottom
Tyler Ruff edited this page Aug 11, 2022 · 3 revisions

Table of Contents

  1. Installing
  2. Site-Wide Configuration
  3. Create Controllers
  4. Create Views & Routes
  5. Advanced Routing

Now, for the fun part!

Creating your controllers. A controller is the entire namespace of a single HTML file.

What does that mean?

Let's say you have an index file, index.html. On that namespace, you have the homepage and an about page (ie. https://example.com/index.html?p=about). You can actually keep scaling this one file until you start creating collisions. However, with bigger sites, this can become very slow. So, controllers allow us to divide up but also containerize (combine) your application, however you see fit.

How do I create one?

We'll start by creating an "index.html" controller.

  1. First step, create a new index.html file in the root of your project.
  2. Next, we'll layout the simple HTML page,
<!DOCTYPE HTML>
<html lang="en" dir="ltr">
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
 </head>
 <body>

 </body>
</html>
  1. Awesome! Now we'll add some scripts to the head, don't worry about the "/views/index.blz.js" file just yet, we will be adding that in the next section. Add the following to the bottom of the <head> tag:
 <link rel="stylesheet" href="lib/fire.css">
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css">
 <script src="lib/fire.js"></script>
 <script src="assets/js/site.blz.js"></script>
 <script src="assets/js/views/index.blz.js"></script>
  1. Finally, let's add the following to the <body> tag to load the page content:
 <script>
  let page = getPage();
  const config = build_config(siteConfig, 
  '[ENTER PAGE DESCRIPTION HERE]', 
  page);
  let pageData = build_routes(page);
  const app = new Fire(config);
  create_app(app.config, pageData);
 </script>
  1. Next, move on to the next tutorial where you will create your views and routes.

Other Versions of Fire

Clone this wiki locally