Wallogit.com
2017 © Pedro Peláez
Stylex prototyping and style guide tool
Creating prototypes or style guides with Silex and Twig., (*1)
See this blog post for more details., (*2)
I've created a Barbones project that demonstrates how to get started., (*3)
Create a style-guide or prototype front end code using Twig templates. Use YAML format to define sample data and content., (*4)
Assuming you already have Composer installed globally all you need to do is create a folder for your project and run the following command:, (*5)
composer require darrenmothersele/stylex dev-master
This will download Stylex from Github and all the dependencies. It creates the
composer.json file for you and downloads all the code for the dependencies into
a vendor folder., (*6)
As a bare minimum you will need to create a index.php to run the application, and
a starter template templates/index.html., (*7)
Create a file in the project root (same location as the generated composer.json file)
called index.php with the following code:, (*8)
<?php require_once __DIR__ . '/vendor/autoload.php'; $app = new Stylex\Application(); $app->run();
Then create a templates folder and create the first page template, templates/index.html in this folder:, (*9)
<html>
<head>
<title>Hello!</title>
</head>
<body>
{% block content %}
<h1>Hello, world!</h1>
{% endblock %}
</body>
</html>
You can run the application with PHP's build in web server. Simply run the following command:, (*10)
php -S localhost:8000
Now, browse to http://localhost:8000 to see the website., (*11)
Read about how to use the rest of the features on my blog., (*12)
Stylex prototyping and style guide tool
MIT