Create new page in fat free
To create a new page in Fat-Free Framework, you can follow these steps:
-
Open your Fat-Free project directory in your terminal or command prompt.
-
Run the following command to create a new page:
ffm new page <page_name>
Replace
<page_name>
with the name of your new page, for example, "about". -
Fat-Free will create a new directory and files for your page. The directory will be named after your page, and it will contain the following files:
index.ff
: This is the main file for your page, where you can write your HTML, CSS, and JavaScript code.layout.ff
: This file defines the layout for your page, including the header, footer, and any other common elements.model.ff
: This file defines the model for your page, which can include data and logic for your page.
-
Open the
index.ff
file in your favorite text editor and start writing your HTML, CSS, and JavaScript code. -
To render your page, you need to add a route to your
routes.ff
file. For example, if you want to access your page at/about
, you can add the following route:GET /about => about/index.ff
-
Save your changes and restart your Fat-Free server. You should now be able to access your new page by visiting
/about
in your web browser.
Here is an example of what your index.ff
file might look like:
<html>
<head>
<title>About Us</title>
</head>
<body>
<h1>About Us</h1>
<p>This is the about page.</p>
</body>
</html>
And here is an example of what your layout.ff
file might look like:
<html>
<head>
<title>{{ title }}</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a rel="nofollow" target="_blank" href="/">Home</a></li>
<li><a rel="nofollow" target="_blank" href="/about">About</a></li>
</ul>
</nav>
</header>
<main>
{{ content }}
</main>
<footer>
<p>© 2023 Your Company</p>
</footer>
</body>
</html>
In this example, the layout.ff
file defines a basic HTML structure with a header, main content area, and footer. The {{ title }}
and {{ content }}
placeholders will be replaced with the actual title and content of your page when it is rendered.