snail-web-template v0.0.1

website-template

Template used for creating new websites, using Webkit, Twig, Typescript and our Module Template System

BASICS

The 2 base things in this templating system is [Component] and [ComponentNode]

Every DOM element with the attribute "data-module" will have an Instance of [ComponentNode] wrapped around it. And that Instance, containing references to the [Component]'s on that DOM element.

A DOM element can only ever have one ComponentNode, but can have multiple Component's on it.

Example:

<div data-module="CompOne, CompTwo, CompThree"></div>

This would create a ComponentNode and three modules all extending [Component]'s.

SETUP

In the root folder run:

npm install
composer install

Install MaMP Pro and run a localhost on the app/ folder.

Create a .env file in the root folder and copy paste the settings from .env.defaults

Make sure the HOST and PORT in the .env is set to localhost created by MaMP

MAMP_HOST=snailtemplate
MAMP_PORT=8888

To start the server, run:

npm start

TROUBLESHOOTING

In case you are working on multiple projects using Node. Remember, you can only ever have one node server running at a time, Try:

sudo killall node 

SCRIPTS

start the node server:

npm start 

Compile a release build:

npm run build

Compile Docs:

npm run docs    

Create new Module setup with .scss .html.twig and .tsx:

plop [[ModuleName]]